This is a Next.js project bootstrapped with latest create-next-app
.
-
Clone the repository:
git clone https://github.com/coding404life/supermarket.git cd supermarket
-
Install dependencies:
yarn install
-
Build and run the application using Docker Compose:
docker-compose up --build
-
Run tests:
yarn test
-
Open http://localhost:3000 with your browser to see the result.
-
Stop the application:
docker-compose down
- Next.js: Chosen for its powerful features like server-side rendering, static site generation, and API routes, which are beneficial for building modern web applications.
- React Query: Used for data fetching and state management, providing a robust solution for handling server state.
- MSW (Mock Service Worker): Utilized for API mocking in tests, ensuring that tests are reliable and do not depend on external services.
- Jest: Selected as the testing framework for its comprehensive features and ease of integration with React and Next.js.
- React Testing Library: Used for testing React components, providing utilities to test the UI.
- Product listing page assumed that the products will be changing based on new products and search will be fetched from API, as well as future pagination in the Product listing, so the page is CSR
- Product Details page assumed that this page should be SSR for each product to enhance SEO
- Assumed that product details page should have the meta data for each product
- The API endpoint
https://dummyjson.com/products
is assumed to be stable and reliable for fetching product data.