Comfy E-commerce

About the Project:

Comfy Ecommerce is a furniture Ecommerce project that has the following features:

• Registration and Logging system
• Shopping cart
• Product details
• Checkout process
• User account
• Search for products
• Filter products by category, company, name, price
• Responsive design
• Dark and white theme

Sample task, photo:

• Products

• Cart

• Checkout

• Orders

Technologies, Libraries:

• React JS

• Vite JS, ESLint, Prettier

• https://tailwindcss.com/ Tailwind CSS is a utility-first CSS framework for rapidly building custom designs directly in your HTML markup. Instead of using pre-designed components like traditional frameworks (e.g., Bootstrap), it provides a vast collection of low-level utility classes that you compose to create unique styles.

• https://daisyui.com/ daisyUI is a Tailwind CSS component library that provides pre-designed UI components and styles to help developers build responsive and visually appealing web applications quickly.

• https://reactrouter.com/start/declarative/installation React Router is a standard library for routing in React applications. It enables navigation among views or components, allowing developers to create single-page applications with multiple routes and dynamic content rendering based on the URL.

• https://react-icons.github.io/react-icons a popular, open-source library that allows developers to easily include a vast collection of icons from various popular icon sets

• https://axios-http.com/docs/intro Axios is a popular, promise-based JavaScript library for making HTTP requests from browsers or Node.js, simplifying tasks like fetching data from APIs with methods like GET, POST, and DELETE. It offers features like interceptors, automatic JSON transformation, and better error handling, making asynchronous network operations cleaner and more efficient than native browser APIs.

• https://redux-toolkit.js.org/tutorials/quick-start Redux Toolkit is used for writing redux code but in a more concise way. Redux Toolkit (RTK) solves problems that most of the developer’s face who used redux in a react application. RTK abstracts the basic redux code and provides us boilerplates that enable us to write redux code in less lines of code

• https://fkhadra.github.io/react-toastify/introduction/ React Toastify is a popular, lightweight library for adding non-blocking toast notifications to React applications with ease. It provides a simple API for displaying alerts, feedback messages (success, error, info, warning), and custom content to users.

• JWT Authentication in React with react-router

• https://github.com/iamkun/dayjs Day.js is a minimalist JavaScript library that parses, validates, manipulates, and displays dates and times for modern browsers.

• https://tanstack.com/query/latest/docs/framework/react/overview React Query is a powerful data-fetching library for React applications that simplifies the management of server state by providing tools for fetching, caching, synchronizing, and updating data, allowing developers to build more efficient and responsive user interfaces with less boilerplate code.

Run the app:

• Clone a project: git clone

git clone https://github.com/SimAndrew/comfy-ecommerce-reactjs.git

• Open project code in your editor.
• Install the dependencies, enter into the terminal:

npm install

• Run the project, enter into the terminal:

npm run dev