{"id":19320305,"url":"https://github.com/kms74/next.js-shopping-cart-app","last_synced_at":"2025-04-12T14:40:30.653Z","repository":{"id":186205152,"uuid":"628441831","full_name":"KMS74/Next.js-Shopping-Cart-App","owner":"KMS74","description":"This project is a React Next.js app that consumes the Fake Store API (https://fakestoreapi.com) to display a list of products, allow users to add products to a cart, view the contents of their cart, and edit their cart.","archived":false,"fork":false,"pushed_at":"2024-12-28T20:36:36.000Z","size":352,"stargazers_count":22,"open_issues_count":1,"forks_count":5,"subscribers_count":1,"default_branch":"develop","last_synced_at":"2025-03-26T09:11:26.968Z","etag":null,"topics":["dark-theme","material-ui","nextjs","react","rest-api","typescript"],"latest_commit_sha":null,"homepage":"https://next-js-shopping-cart-app.vercel.app","language":"TypeScript","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/KMS74.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}},"created_at":"2023-04-16T00:32:25.000Z","updated_at":"2025-03-01T04:32:28.000Z","dependencies_parsed_at":null,"dependency_job_id":"d6a4a021-fc78-4623-b11a-87c5239055c8","html_url":"https://github.com/KMS74/Next.js-Shopping-Cart-App","commit_stats":null,"previous_names":["kms74/next.js-shopping-cart-app"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KMS74%2FNext.js-Shopping-Cart-App","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KMS74%2FNext.js-Shopping-Cart-App/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KMS74%2FNext.js-Shopping-Cart-App/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KMS74%2FNext.js-Shopping-Cart-App/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/KMS74","download_url":"https://codeload.github.com/KMS74/Next.js-Shopping-Cart-App/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248582313,"owners_count":21128355,"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":["dark-theme","material-ui","nextjs","react","rest-api","typescript"],"created_at":"2024-11-10T01:28:13.176Z","updated_at":"2025-04-12T14:40:30.620Z","avatar_url":"https://github.com/KMS74.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Next.js Shopping Cart App\n\nThis project is a React Next.js app that consumes the Fake Store API (https://fakestoreapi.com) to display a list of products, allow users to add products to a cart, view the contents of their cart, and edit their cart.\n\n## Live Preview\n\nhttps://next-js-shopping-cart-app.vercel.app/\n\n## Required Technologies\n\n- Typescript\n- React.js 19\n- React Context API\n- Next.js 15 App Router\n- Material UI\n\n## Usage\n\nThe app consists of two pages: the home page and the cart page .\n\n### Home Page\n\nThe home page displays a list of products retrieved from the Fake Store API. Each product is displayed with its name, picture, category, price, and available quantity.\n\n### Cart Page\n\nThe cart page displays the contents of the user's cart, including the items quantity, items cost, and total cost. Users can edit the quantity of items in their cart or remove items entirely.\n\n## Features\n\n- Displays a list of products retrieved from the Fake Store API.\n- Allows users to add products to their cart.\n- Allows users to view the contents of their cart.\n- Allows users to edit the quantity of items in their cart or remove items entirely.\n- React Material UI custom theme\n- Toggle between light and dark theme\n\n## Contributing\n\nContributions to the project are welcome! To contribute, follow these steps:\n\n1. Fork the repository.\n2. Create a new branch for your changes.\n3. Make your changes and commit them with descriptive commit messages.\n4. Push your changes to your fork.\n5. Create a pull request to merge your changes into the main repository.\n\n## Credits\n\nThis app was created by [Karem Shabana](https://www.linkedin.com/in/karem-shabana/)\n.\n\n## License\n\nThis project is licensed under the MIT license. See the `LICENSE` file for more details.\n\nThis is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template\u0026filter=next.js\u0026utm_source=create-next-app\u0026utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkms74%2Fnext.js-shopping-cart-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkms74%2Fnext.js-shopping-cart-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkms74%2Fnext.js-shopping-cart-app/lists"}