https://github.com/geovaneborba/desafio-ignite-coffee-delivery

Desafio realizado durante o programa ignite da Rocketseat
https://github.com/geovaneborba/desafio-ignite-coffee-delivery

Last synced: 5 days ago
JSON representation

Desafio realizado durante o programa ignite da Rocketseat

• Host: GitHub
• URL: https://github.com/geovaneborba/desafio-ignite-coffee-delivery
• Owner: geovaneborba
• License: mit
• Created: 2023-03-13T21:17:07.000Z (almost 2 years ago)
• Default Branch: master
• Last Pushed: 2023-03-14T14:11:42.000Z (almost 2 years ago)
• Last Synced: 2024-11-10T19:13:18.779Z (2 months ago)
• Language: TypeScript
• Homepage: https://geovaneborba-coffee-delivery.vercel.app
• Size: 2.83 MB
• Stars: 0
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        




  

   

  











  Sobre   |  

  Tecnologias   |  

   Pré requisitos   |  

  Começando   |  

  Licença   |  

  Autor






## :dart: Sobre



  Desafio realizado durante o programa ignite da Rocketseat, onde

  foi solicitado o desenvolvimento de uma aplicação para gerenciar um carrinho de compras de uma cafeteria fictícia, que contém as seguintes funcionalidades:

- Listagem de produtos (cafés) disponíveis para compra

- Adicionar uma quantidade específicas de itens no carrinho

- Aumentar ou remover a quantidade de itens no carrinho

- Formulário para o usuário preencher o seu endereço

- Exibir o total de itens no carrinho no Header

- Exibir o valor total da soma de itens no carrinho multiplicados pelo valor

Apesar de parecer poucas funcionalidades foi trabalhado conceitos importantes do react como por exemplo:

- Estados

- ContextAPI

- LocalStorage

- Imutabilidade do estado

- Listas e chaves no ReactJS

- Propriedades

- Componentização

🎯 Clique aqui para acessar o desafio ⬅️

Além de concluir o desafio eu também adicionei algumas funcionalidades que eu achei que ficou legal 😁 como por exemplo:

- Responsividade, adaptei o layout para funcionar em dispositivos móveis

- Validação dos dados no formulário com React Hook Forms junto com o Zod

- Utilizei a API do ViaCEP para preencher o formulário, após o usuário informar o seu CEP

- Exibir uma mensagem (toast) quando o usuário adiciona um café ao carrinho

- Exibir uma mensagem (toast) quando o usuário remove um café ao carrinho

- Criei uma API Fake com os dados necessários para exibir a lista de produtos (cafés) na homepage



(Voltar para o topo)


## :rocket: Tecnologias

As seguintes tecnologias foram usadas na construção do projeto:

- [Vite](https://vitejs.dev/)

- [React](https://reactjs.org/docs/getting-started.html)

- [TypeScript](https://www.typescriptlang.org/)

- [Eslint](https://eslint.org/)

- [Prettier](https://prettier.io/)

- [React Toastify](https://fkhadra.github.io/react-toastify/introduction)

- [React Hook Form](https://react-hook-form.com/)

- [ZOD](https://github.com/colinhacks/zod)

- [React Router](https://reactrouter.com/en/main)

(Voltar para o topo)


## :warning: Pré-requisitos

Antes de começar, você precisa ter o [Git](https://git-scm.com) e o [Node](https://nodejs.org/en/) instalados em sua maquina.

(Voltar para o topo)


## :checkered_flag: Começando

```bash

# Clone este repositório

$ git clone https://github.com/geovaneborba/ignite-coffee-delivery.git

# Entre na pasta

$ cd coffee-delivery

# Instale as dependências

$ npm install

# Para iniciar o projeto

$ npm run dev

# O app vai inicializar e será informado no terminal o endereço e porta onde estará rodando a aplicação

# geralmente é http://localhost:5173/

```

(Voltar para o topo)


## :memo: Licença

Este projeto está sob licença MIT. Veja o arquivo [LICENSE](LICENSE.md) para mais detalhes.

(Voltar para o topo)


Feito com ❤️ por Geovane Borba