📚 MERN Book Store Web App 📚

No License Used

This project was created to understand the MERN stack's basic CRUD operations, face more problems, and gain experience.

🚀 Steps to Run This Project:

1. Create a MongoDB connection from the MongoDB website.
2. Clone my repository.
3. Navigate to the backend folder in your code editor terminal.
4. Create a config file called config.js in the root of the backend folder and define PORT and mongoDBURL. For example:

   export const PORT = 5555;
   export const mongoDBURL = 'mongodb+srv://**********:******@*************.mongodb.net/**************/*****************************&*************'
       

5. In your backend folder, type npm install. After that, type npm run dev.
6. Next, navigate to the frontend folder from your terminal and type npm install. After that, type npm run dev.

📖 Book Store Explanation:

After running the book store project, you will see the table view (home page). If you run this project for the first time, you will see an empty table. Follow these steps to manage your books:

1. Add a Book:
   • Click the plus icon in the top right corner to navigate to the "Create Book" page.
   • Fill in the book name, author, and publish year to create a new book.
   • After creating a new book, you will be redirected to the home page where the new book will be listed.
2. Switch Views:
   • At the top center of the home page, there are two buttons: "Table" and "Card".
   • The default view is the table. Click the "Card" button to see your added books in card view.
3. Edit a Book:
   • Both the card and table views have edit icons.
   • Click the edit icon to navigate to the edit book page.
   • Make the necessary changes to the book details and save them.
4. Delete a Book:
   • Both the card and table views have delete icons.
   • Click the delete icon to navigate to the delete book page.
   • Confirm the deletion to remove the book from the list.
5. Navigate Back:
   • Each page (except the home page) has a back button to navigate to the previously opened page.

📷 Screenshots:

Home Page (Table View):

Home Page (Card View):

Create Book:

Edit Book:

Delete Book:

Show Book:

📝 How to Get MongoDB URL:

To get the MongoDB URL:

1. Log in to your MongoDB account at MongoDB website.
2. Create a new cluster or select an existing one.
3. In the cluster view, click on the "Connect" button.
4. Select "Connect your application" from the options.
5. Copy the provided connection string (MongoDB URL).

Happy Coding :)