Bookstore App

The Bookstore App is a web application that allows users to browse books, add books to a favorites list, and search for books using the Google Books API. Built with modern technologies like React and Redux, the app offers an intuitive interface with a smooth user experience.

Key Features

. Book Display: Browse books across different categories (e.g., Fiction, History, and more). . Advanced Search: Search for books using keywords. . Favorites: Save your favorite books to a personal list. . Sign Up / Sign In: Register an account using email or log in with Google. . Pagination: Navigate through multiple pages for a better book browsing experience.

Technologies Used

. React: For building dynamic and interactive user interfaces. . Redux: For global state management. . Firebase: For storing user data and handling authentication. . Google Books API: To fetch books from the Google Books library. . React Router: For navigation between pages. . CSS & Swiper: For designing the UI and enhancing user interaction.

Installation

1. Clone the Repository https://github.com/RubaMansour/reactProject.git

2. Navigate to the Project Directory cd reactProject

3. Install Dependencies
   npm install

4. Configure Firebase Set up your Firebase account and configure your app settings in firebase.js: 1. Create a new project on Firebase Console. 2. Create a web app and add Firebase configurations in firebase.js. 3. Enable "Email/Password Authentication" and "Google Authentication" in Firebase settings.

5. Run the App Once all dependencies are installed, you can run the app with: npm run dev

Project Structure

bookstore-app/

├── public/ │ ├── index.html │ └── ... ├── src/ │ ├── components/ │ │ ├── Navbar.js │ │ ├── Home.js │ │ └── ... │ ├── redux/ │ │ └── booksSlice.js │ ├── App.js │ ├── firebase.js │ └── index.js ├── .gitignore ├── package.json ├── README.md └── ...

How the App Works

1. Sign Up and Sign In:

   . Users can sign up using email or log in with their Google account. . Once logged in, user data is stored in Firebase Firestore.

2. Display Books:

   . The app uses the Google Books API to fetch book data based on the search keyword or selected category. . Books are displayed on the "Shop" page, with the ability to browse through multiple pages.

3. Add Books to Favorites:

   . Users can add books to their favorites list using the "Add To Wishlist" button.

4. Navigation:

 . The app uses React Router to navigate between pages, including the homepage, book details, 
   and shop pages.