O projeto Coffee Delivery é uma loja de café online que oferece a conveniência de entrega dos produtos diretamente na casa dos clientes. A aplicação foi desenvolvida utilizando diversas tecnologias e ferramentas para garantir uma experiência completa e amigável para o usuário.
As funcionalidades do projeto Coffee Delivery incluem três telas principais:
-
Tela de apresentação e listagem de cafés disponíveis: Nessa tela, os usuários podem visualizar os diferentes tipos de café disponíveis para compra. As informações dos cafés são exibidas, como nome, descrição e preço.
-
Tela de preenchimento de formulário: Nessa tela, o usuário precisa preencher um formulário com seus dados de endereço para a entrega do pedido. Ao lado direito do formulário, é exibido o carrinho de compras, onde o usuário pode visualizar os itens selecionados, alterar a quantidade ou remover itens.
-
Tela de confirmação do pedido: Nessa tela final, é exibida uma confirmação do pedido feito pelo usuário, mostrando os detalhes da compra, como itens selecionados, preço total e informações de entrega.
As principais tecnologias utilizadas no projeto são as seguintes:
- Vite: Um framework de desenvolvimento web que permite a criação rápida e eficiente de aplicativos React.
- Styled Components: Uma biblioteca que permite escrever estilos CSS dentro do próprio código JavaScript, facilitando a estilização dos componentes.
- Local Storage: Uma ferramenta de armazenamento local no navegador, utilizada para salvar informações do usuário, como preferências de café ou histórico de pedidos.
- TypeScript: Uma linguagem de programação que adiciona tipagem estática ao JavaScript, proporcionando maior segurança e facilidade de manutenção ao código.
- Context API: Uma API do React que permite o compartilhamento de dados entre componentes sem a necessidade de passar props manualmente, facilitando a comunicação entre diferentes partes da aplicação.
- React Router Dom: Uma biblioteca que facilita a navegação entre páginas ou telas em um aplicativo React.
- React Hook Form: Uma biblioteca que simplifica o gerenciamento de formulários no React, oferecendo recursos como validação, manipulação de dados e controle de estado.
- Validações de formulário com Zod: Zod é uma biblioteca de validação de esquema que pode ser usada para validar e tipar dados de entrada em formulários. Ela ajuda a garantir que os dados fornecidos pelo usuário estejam corretos e adequados antes de serem processados.
# Clone o repositório:
git clone https://github.com/filipefdm/coffee-delivery.git
# Acesse a pasta do projeto:
cd coffee-delivery
# Instalando as dependências do projeto:
npm install
# Rodando a aplicação:
npm run dev
Acesse http://localhost:3000 no navegador para ver o resultado!
Feito com 💜 por Filipe Motta 😊