{"id":18812398,"url":"https://github.com/parin-prog/ecommerce_mern_app","last_synced_at":"2025-09-02T16:31:53.870Z","repository":{"id":162992069,"uuid":"637442991","full_name":"parin-prog/eCommerce_MERN_app","owner":"parin-prog","description":"A eCommerce project is a web application for online shopping built using the MERN stack, which includes MongoDB, Express, React, and Node.js. The MERN stack is a popular open-source technology stack for building modern web applications that can handle a large amount of data and user traffic.","archived":false,"fork":false,"pushed_at":"2023-11-24T07:33:09.000Z","size":10532,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-11-07T23:40:11.562Z","etag":null,"topics":["chartjs","css3","express","expressjs","firebase","javascript","material-ui","mern-stack","mongodb","mui-icons","nodejs","reactjs","stripe","styled-components"],"latest_commit_sha":null,"homepage":"https://ecommerce-mern-app-henna.vercel.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/parin-prog.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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}},"created_at":"2023-05-07T15:15:10.000Z","updated_at":"2024-04-14T16:01:54.000Z","dependencies_parsed_at":"2023-06-02T03:15:24.115Z","dependency_job_id":"dd28d1d7-6710-44ad-af17-77c4068768a3","html_url":"https://github.com/parin-prog/eCommerce_MERN_app","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/parin-prog%2FeCommerce_MERN_app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/parin-prog%2FeCommerce_MERN_app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/parin-prog%2FeCommerce_MERN_app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/parin-prog%2FeCommerce_MERN_app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/parin-prog","download_url":"https://codeload.github.com/parin-prog/eCommerce_MERN_app/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":231797738,"owners_count":18428065,"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","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":["chartjs","css3","express","expressjs","firebase","javascript","material-ui","mern-stack","mongodb","mui-icons","nodejs","reactjs","stripe","styled-components"],"created_at":"2024-11-07T23:32:40.524Z","updated_at":"2024-12-30T00:15:22.203Z","avatar_url":"https://github.com/parin-prog.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":" # eCommerce_MERN_app :shopping_cart:\n![Logo](/client/src/Logo.png)\n\n\n\n### Version 1 :\n* The data is stored using MongoDB\n* Stripe integration for payment.\n* For payment and order information used firestore.\n* Yet, Features and improvements required in admin panel.\nversion 1 is hosted [HERE!](https://ecommerce-mern-app-henna.vercel.app/)\n\nAn E commerce platform made using React JS, Redux, MaterialUI, Router, ExpressJS, MongoDB, Firestore, Stripe API (temporarily creating dummy payment gateway).\n\n###  The application is composed of the following Features:\n\n## Front-End\n* A landing page with animated minimalistic design, with the major categories of items.\n* A quick peek page where 5 products of each categories are on display.\n* A page with Sign-in and Sign-out components.\n* All form related fields are made using reusable components.\n* Has a cart feature which opens up and displays the items selected in a summary, also has a checkout button.\n* The cart component also allows to edit the contents of the items selected.\n* Checkout features are integrated with the appplication. \n\n## Backend\n* API Endpoints: Various API endpoints manage CRUD operations for products, categories, users, and more.\n\n* Authentication: Secure Sign-in and Sign-out components ensure user access control through authentication tokens.\n\n* Reusable Components: Form-related fields are designed as reusable components for maintainability and extensibility.\n\n* Cart Management: Users can add and remove items, and update quantities in their shopping cart.\n\n\n## Payment\n\n* Secure Payments: Stripe API integration enhances the application's payment processing capabilities, providing a secure and reliable payment gateway for online transactions.\n\n* Order Storage: Completed orders are meticulously stored in Firestore, guaranteeing the preservation of order details for future reference and fulfillment.\n\n* Seamless Payment Flow: The Stripe integration ensures a seamless payment flow within the application, allowing users to complete transactions swiftly and securely, enhancing the overall shopping experience.\n---\n---\n### Admin panel  [Here](/admin/README.md)\n---\n---\n**SCREENSHOTS:**\n---\n\nLanding Page:\n\n![](/client/src/assets/home.png)\n---\nProduct Preview:\n\n![](/client/src/assets/product.png)\n![](/client/src/assets/explore.png)\n![](/client/src/assets/products.png)\n![](/client/src/assets/footer.png)\n---\nSign-in \u0026\u0026 Sign-Up Page:\n\n![](/client/src/assets/login.png)\n![](/client/src/assets/register.png)\n\nCart Section:\n\n![](/client/src/assets/cart.png)\n\nPayment: \n\n![](/client/src/assets/stripe.png)\n\n\n---\n\n## Developed With\n\n* [Visual Studio Code](https://code.visualstudio.com/) - A source code editor developed by Microsoft for Windows, Linux and macOS. It includes support for debugging, embedded Git control, syntax highlighting, intelligent code completion, snippets, and code refactoring\n* [React](https://reactjs.org/) - A javascript library for building user interfaces\n* [Create react app](https://create-react-app.dev/) - A quick method to start developing a react application.\n* [Babel](https://babeljs.io/) - A transpiler for javascript\n* [Webpack](https://webpack.js.org/) - A module bundler\n* [MaterialUI](https://mui.com/material-ui/) - A prebuilt comp. provider\n* [ExpressJS](https://expressjs.com/) - A web application framework for Node.js.\n* [NodeJS](https://nodejs.org/en) - A JavaScript runtime for server-side applications.\n* [MongoDB](https://www.mongodb.com/atlas/database) - A NoSQL database system.\n* [Firestore](https://firebase.google.com/) - A cloud-based NoSQL database service from Firebase.\n* [Stripe](https://stripe.com/) - A payment processing platform for online businesses.\n\n---\n\n\n## Getting Started\n\nThese instructions will get you a copy of the project up and running on your local machine for development and testing purposes.\n\n### Prerequisites\n\nThe following software is required to be installed on your system:\n\n* Node 16.x\n* Npm 8.x\n\nType the following commands in the terminal to verify your node and npm versions\n\n```bash\nnode -v\nnpm -v\n```\n\n## How to Run\n\n1. **Clone the Repository**: Start by cloning this repository to your local machine.\n\n2. **Backend Setup**:\n   - Navigate to the backend directory and run `npm install` to install the required backend dependencies.\n   - Configure the database and environment variables as specified in the backend documentation.\n   - Run `npm start` to start the server.\n\n3. **Frontend Setup**:\n   - Navigate to the frontend directory and run `npm install` to install the required frontend dependencies.\n   - Configure the frontend environment variables as necessary.\n   - Run `npm start` to launch the frontend.\n\n4. **Access the Application**:\n   - Visit the application in your web browser at `http://localhost:3000` (by default for the frontend).\n   - Ensure the backend is running on a different port as specified in your configuration.\n\nFeel free to explore and build upon this project to create a fully functional e-commerce application. For any questions or assistance, please don't hesitate to reach out to us. Happy coding and happy shopping!\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fparin-prog%2Fecommerce_mern_app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fparin-prog%2Fecommerce_mern_app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fparin-prog%2Fecommerce_mern_app/lists"}