Coffee-Delivery

📚 Project Description

In this project, I developed an application to manage a shopping cart for a fictional coffee shop, with the following functionalities:

List of products (coffees) available for purchase
Add a specific amount of items to the cart
Increase or remove the amount of items in the cart
Form for the user to fill in his address
Display the total items in the cart in the Header
Display the total value of the sum of items in the cart multiplied by the value

📌 What did I learn?

In this project, I had the opportunity to practice working with many of ReactJS features, using styled-components, contexts, reducers, immers, routing with React Router DOM, ReactHook Form and hookform/resolvers, using zod for validation. Also, I was able to work deeper with TypeScript, allowing a better organization project's files and preventing bugs.

I was able to establish a much more organized and efficient communication logic between the components through contexts and reducers, and I practiced organizing files in different folders, following a pre-established hierarchy, giving special importance to code refactoring to facilitate readability and maintenance.

In addition, I could practice using hooks like useDebounce and useMemo, as well as creating my own useLocation hook using the Geolocation API.

🔍 Links

Preview-Site

💻 My Process

Built with:

ℹ️ How to run the application?

Clone the repository:

git clone https://github.com/maricastroc/coffee-delivery

Install the dependencies:

npm install

Start the service:

npm run dev

⏩ Access http://localhost:3000 to view the web application.