https://github.com/gablsl/coffee-delivery

Project developed during the React track of Rocketseat's Ignite course. It simulates an e-commerce platform for a coffee shop, where users can explore a variety of coffee shops, add products to the cart, choose a payment method and complete the purchase.
https://github.com/gablsl/coffee-delivery

figma react react-hook-form react-router-dom styled-components typescript vite zod

Last synced: 7 days ago
JSON representation

Project developed during the React track of Rocketseat's Ignite course. It simulates an e-commerce platform for a coffee shop, where users can explore a variety of coffee shops, add products to the cart, choose a payment method and complete the purchase.

• Host: GitHub
• URL: https://github.com/gablsl/coffee-delivery
• Owner: gablsl
• Created: 2024-03-25T18:07:39.000Z (8 months ago)
• Default Branch: main
• Last Pushed: 2024-08-14T15:00:46.000Z (3 months ago)
• Last Synced: 2024-08-15T05:03:11.586Z (3 months ago)
• Topics: figma, react, react-hook-form, react-router-dom, styled-components, typescript, vite, zod
• Language: TypeScript
• Homepage: https://coffee-delivery-rose-alpha.vercel.app
• Size: 1.55 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# ☕ Coffee Delivery

> Coffee Delivery is a project developed during the React track of Rocketseat's Ignite course. It simulates an e-commerce platform for a coffee shop,

where users can explore a variety of coffee shops, add products to the cart, choose a payment method and complete the purchase.

## 🚀 Demo

[![Demo](https://sa-east-1.graphassets.com/clts0no5706bz07kh246tdkzk/clu7a07z7044308kic9n4asca)](https://coffee-delivery-rose-alpha.vercel.app/)

## ⚙️ Features

- **Product catalog:** Displays a list of different types of coffee, with details such as name, price and description. 

- **Shopping cart:** Allows you to add, remove and adjust the quantity of products.

- **Address form:** Collects user address information for order delivery.

- **Order summary:** Shows a detailed summary of the order, including selected products, amounts and payment method.

- **Order confirmation:** After completing the purchase, a confirmation screen displays with order details and estimated delivery time.

## 🛠️ Technologies

- React, Styled-Components, React Hook Form, Context API, TypeScript, LocalStorage

## 📦 How to Run the Project

1. Clone the repository:

   ```bash

   git clone https://github.com/your-username/your-project.git

2. Install dependencies using npm

   ```bash

   npm install

3. Set up environment variables:

- Create a .env file in the root of the project and add the necessary environment variables.

4. Start the development server

   ```bash

   npm run dev

## 🤝 **How to contribue?**

1. Fork the project

2. Create a new branch: git checkout -b my-new-feature

3. Make your changes and commit: git commit -m 'Add new feature'

4. Push to the main branch: git push origin my-new-feature

5. Open a Pull Request

Developed with ❤️ Gabriel