{"id":31158080,"url":"https://github.com/arnobt78/ecommerce-shop-1-bookstore--react-fullstack","last_synced_at":"2025-10-25T14:44:45.669Z","repository":{"id":302177211,"uuid":"850136675","full_name":"arnobt78/Ecommerce-Shop-1-BookStore--React-FullStack","owner":"arnobt78","description":"eBookStore is a full-fledged React E-Commerce Web Application (Global Level State Application) where you can place an order for codebooks. Frontend (deployed on Netlify) and Backend (deployed on Render) are separately developed here. Filter Properties, Search Option, JSON-Server, JSON-Server-Auth, JSON Web Tokens (JWT), Protect Routes are used.","archived":false,"fork":false,"pushed_at":"2025-08-23T22:13:29.000Z","size":1086,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-24T09:17:39.065Z","etag":null,"topics":["ecommerce","ecommerce-website","html","javascript","json-api","json-auth-server","json-server","json-web-tokens","jwt-authentication","netlify-deployment","react","react-components","react-hooks","react-router","react-router-dom","reactjs","render-deployment","session-storage","tailwindcss"],"latest_commit_sha":null,"homepage":"https://ebookstore-arnob.netlify.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/arnobt78.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-08-31T00:54:05.000Z","updated_at":"2025-08-23T22:13:32.000Z","dependencies_parsed_at":"2025-07-01T01:33:59.794Z","dependency_job_id":"93fbeae9-fba5-4526-8a87-9a3c0d8b8c7b","html_url":"https://github.com/arnobt78/Ecommerce-Shop-1-BookStore--React-FullStack","commit_stats":null,"previous_names":["arnobt78/ebookstore--react","arnobt78/ecommerce-shop-1-bookstore--react-fullstack"],"tags_count":0,"template":true,"template_full_name":null,"purl":"pkg:github/arnobt78/Ecommerce-Shop-1-BookStore--React-FullStack","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FEcommerce-Shop-1-BookStore--React-FullStack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FEcommerce-Shop-1-BookStore--React-FullStack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FEcommerce-Shop-1-BookStore--React-FullStack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FEcommerce-Shop-1-BookStore--React-FullStack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/arnobt78","download_url":"https://codeload.github.com/arnobt78/Ecommerce-Shop-1-BookStore--React-FullStack/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arnobt78%2FEcommerce-Shop-1-BookStore--React-FullStack/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":275852053,"owners_count":25540136,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-18T02:00:09.552Z","response_time":77,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ecommerce","ecommerce-website","html","javascript","json-api","json-auth-server","json-server","json-web-tokens","jwt-authentication","netlify-deployment","react","react-components","react-hooks","react-router","react-router-dom","reactjs","render-deployment","session-storage","tailwindcss"],"created_at":"2025-09-18T23:30:40.940Z","updated_at":"2025-09-18T23:30:42.878Z","avatar_url":"https://github.com/arnobt78.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# CodeBook – Modern Computer Science eBook Store - React, Express E-Commerce Website\n\n![Screenshot 2024-09-03 at 19 04 34](https://github.com/user-attachments/assets/a1701da8-19dc-4493-b02d-f2cb4e37feea) ![Screenshot 2024-09-03 at 19 04 50](https://github.com/user-attachments/assets/580eb690-e02b-4123-be4f-7c6b82bb4985) ![Screenshot 2024-09-03 at 19 05 04](https://github.com/user-attachments/assets/695f1bd5-3d8f-4049-9a11-f3f3a7805fda) ![Screenshot 2024-09-03 at 19 05 24](https://github.com/user-attachments/assets/25cf13dc-84c3-46f7-a9f9-9449da72123a) ![Screenshot 2024-09-03 at 19 06 17](https://github.com/user-attachments/assets/f35ea3d3-43ba-4114-8508-fb6509af8232) ![Screenshot 2024-09-03 at 19 07 19](https://github.com/user-attachments/assets/b8d5f055-7719-47d7-901c-f86b7b7f78f5) ![Screenshot 2024-09-03 at 19 07 42](https://github.com/user-attachments/assets/64583a22-c1b6-42e3-b459-d9c95002b2af) ![Screenshot 2024-09-03 at 19 07 52](https://github.com/user-attachments/assets/8772d23c-f95f-454d-957f-16d98936cf32) ![Screenshot 2024-09-03 at 19 08 45](https://github.com/user-attachments/assets/5e1a348b-f873-463d-9e8c-27e4f1e12aff) ![Screenshot 2024-09-03 at 19 09 19](https://github.com/user-attachments/assets/2dafa0c2-451a-4333-99a8-0167d9493df4) ![Screenshot 2024-09-03 at 19 09 29](https://github.com/user-attachments/assets/7a565cef-3caf-4295-b1b0-b3cc35086276) ![Screenshot 2024-09-03 at 19 09 43](https://github.com/user-attachments/assets/26854077-9177-40c6-9337-3bb3ec0ebd19) ![Screenshot 2024-09-03 at 19 10 10](https://github.com/user-attachments/assets/006d3b5b-a967-4dd6-9dee-2bf662c4d6c2)\n\n---\n\nCodeBook is a full-featured, modern eBook store built with React, designed for computer science learners and developers. It demonstrates best practices in React, global state management, authentication, RESTful API integration, and responsive UI with Tailwind CSS. The project is ideal for learning, teaching, and real-world deployment (Netlify \u0026 Render). Users can browse, search, and order the latest codebooks and e-books, with a seamless frontend and a mock backend.\n\n- **Frontend-Live:** [https://ebookstore-arnob.netlify.app](https://ebookstore-arnob.netlify.app)\n- **Backend-Live:** [https://codebook-mock-server-j8n3.onrender.com](https://codebook-mock-server-j8n3.onrender.com)\n- **Backend-Source:** [eBookStore-Mock-Server Repo](https://github.com/arnobt78/eBookStore-Mock-Server)\n\n---\n\n## Table of Contents\n\n1. [Project Overview](#project-overview)\n2. [Key Features](#key-features)\n3. [Live Demo](#live-demo)\n4. [Project Structure](#project-structure)\n5. [Technology Stack](#technology-stack)\n6. [Installation \u0026 Setup](#installation--setup)\n7. [Usage \u0026 Walkthrough](#usage--walkthrough)\n8. [Component \u0026 API Reference](#component--api-reference)\n9. [Routing \u0026 Navigation](#routing--navigation)\n10. [Customization \u0026 Reuse](#customization--reuse)\n11. [Keywords](#keywords)\n12. [Conclusion](#conclusion)\n\n---\n\n## Project Overview\n\nCodeBook is a scalable, modular React e-commerce site for codebooks and eBooks. It features JWT-based authentication, protected routes, persistent cart, and a robust API layer. The backend is a mock server (JSON Server + Auth), making it easy to run locally or deploy.\n\n---\n\n## Key Features\n\n- Modern React with Hooks \u0026 Context API\n- Shopping Cart Functionality\n- User Authentication (JWT)\n- RESTful API Integration\n- React Router v6 for Navigation\n- Responsive UI with Tailwind CSS\n- Global Loading Spinner (UX)\n- Error Handling \u0026 Toast Notifications\n- Modular Components \u0026 Custom Hooks\n- Ready for Netlify (Frontend) \u0026 Render (Backend) Deployment\n\n---\n\n## Live Demo\n\n- **Frontend:** \u003chttps://ebookstore-arnob.netlify.app\u003e\n- **Backend:** \u003chttps://codebook-mock-server-j8n3.onrender.com\u003e\n- **Author Portfolio:** \u003chttps://arnob-mahmud.vercel.app/\u003e\n\n---\n\n## Project Structure\n\n```bash\ncodebook/\n├── data/                  # Mock database \u0026 routes config\n├── public/                # Static assets and index.html\n├── src/                   # Main React source code\n│   ├── components/        # Reusable and page components\n│   ├── context/           # Global state (Context API, Providers)\n│   ├── hooks/             # Custom React hooks\n│   ├── pages/             # Page-level components\n│   ├── reducers/          # Reducers for state management\n│   ├── routes/            # Routing components\n│   ├── services/          # API and data services\n│   ├── App.js             # Root component \u0026 routing\n│   ├── index.js           # Entry point\n│   └── ...other files\n├── package.json           # Project metadata \u0026 dependencies\n├── tailwind.config.js     # Tailwind CSS config\n└── README.md              # Documentation (this file)\n```\n\n---\n\n## Technology Stack\n\n- **Frontend:** React, React Router, Context API, Tailwind CSS\n- **Backend:** JSON Server, JSON Server Auth (Mock REST API)\n- **Testing:** React Testing Library, Jest\n- **Deployment:** Netlify (Frontend), Render (Backend)\n- **Utilities:** dotenv, JWT, Fetch API, React Toastify\n\n---\n\n## Installation \u0026 Setup\n\n### Prerequisites\n\n- Node.js (v14+ recommended)\n- npm (comes with Node.js)\n\n### Frontend Setup\n\n```bash\n# Clone the repository\ngit clone https://github.com/arnobt78/eBookStore--React.git\ncd eBookStore--React\n\n# Install dependencies\nnpm install\n\n# Start the development server\nnpm start\n# Visit http://localhost:3000\n```\n\n### Backend Setup (Mock Server)\n\n```bash\n# Install JSON Server and Auth\nnpm install -D json-server json-server-auth\n\n# Run JSON Server\nnpx json-server data/db.json\n\n# Run Auth Server (in a second terminal)\nnpx json-server data/db.json -m ./node_modules/json-server-auth -r data/routes.json --port 8000\n```\n\n### Environment Variables\n\nCreate a `.env` file in your root project directory:\n\n```env\nREACT_APP_HOST=http://localhost:8000\nREACT_APP_GUEST_LOGIN=arnob@example.com\nREACT_APP_GUEST_PASSWORD=learnreact\n```\n\n---\n\n## Usage \u0026 Walkthrough\n\n### Main Functionalities\n\n- **Browse \u0026 Search:** Explore eBooks, filter by best seller, in stock, price, etc.\n- **Product Detail:** View detailed info, add/remove from cart.\n- **Cart:** Persistent cart, checkout, and order summary.\n- **Authentication:** Register, login, JWT-protected routes.\n- **Dashboard:** View your orders (protected route).\n- **Global Loading Spinner:** Shows while fetching data.\n- **Error Handling:** Toast notifications for errors.\n\n### Example: Using a Component\n\n```jsx\nimport { ProductCard } from \"./components\";\n\n\u003cProductCard product={product} /\u003e;\n```\n\n### Example: Fetching Products\n\n```js\nimport { getProductList } from \"./services\";\nconst products = await getProductList(\"searchTerm\");\n```\n\n---\n\n## Component \u0026 API Reference\n\n### Main Components\n\n- `Header`, `Footer`, `ProductCard`, `Rating`, `DropdownLoggedIn`, `DropdownLoggedOut`, `ScrollToTop`, `LoadingSpinner`\n- **Pages:** Home, Products, Product Detail, Cart, Order, Dashboard, Login, Register, PageNotFound\n\n### Context \u0026 State\n\n- `CartContext`, `FilterContext`, `LoadingContext` for global state\n- Reducers for cart and filter logic\n\n### API Services\n\n- `getProductList`, `getProduct`, `getFeaturedList`, `getUser`, `getUserOrders`, `createOrder`, `login`, `register`, `logout`\n\n---\n\n## Routing \u0026 Navigation\n\nRoutes are defined in `src/routes/AllRoutes.js`:\n\n- `/` — Home\n- `/products` — Product listing\n- `/products/:id` — Product detail\n- `/cart` — Cart (protected)\n- `/order-summary` — Order summary (protected)\n- `/dashboard` — User dashboard (protected)\n- `/login` — Login\n- `/register` — Register\n- `*` — 404 Page Not Found\n\nProtected routes use the `ProtectedRoute` component and require authentication.\n\n---\n\n## Customization \u0026 Reuse\n\n- **Component Reuse:** All UI components are modular and can be imported into other projects.\n- **API Layer:** Easily adapt the API services for your own backend.\n- **Styling:** Tailwind CSS makes it easy to customize the look and feel.\n- **State Management:** Context and reducers are reusable for other React apps.\n\n---\n\n## Keywords\n\n`React`, `E-Commerce`, `Mock Server`, `JWT Auth`, `React Router`, `Tailwind CSS`, `Full Stack`, `Netlify`, `Render`, `Learning Project`, `REST API`, `Codebooks`, `Global State`, `Context API`, `Shopping Cart`, `Modern Web`, `Reusable Components`, `Teaching`, `Open Source`\n\n---\n\n## Conclusion\n\nCodeBook is not just a project—it's a learning journey. It combines real-world tech stacks, best practices, and deployment workflows, making it perfect for both beginners and intermediate developers keen to master modern React and full-stack development. Fork, clone, and start coding!\n\n---\n\n## Happy Coding! 🎉\n\nFeel free to use this project repository and extend this project further!\n\nIf you have any questions or want to share your work, reach out via GitHub or my portfolio at [https://arnob-mahmud.vercel.app/](https://arnob-mahmud.vercel.app/).\n\n**Enjoy building and learning!** 🚀\n\nThank you! 😊\n\n---\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farnobt78%2Fecommerce-shop-1-bookstore--react-fullstack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Farnobt78%2Fecommerce-shop-1-bookstore--react-fullstack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farnobt78%2Fecommerce-shop-1-bookstore--react-fullstack/lists"}