{"id":50873293,"url":"https://github.com/felipe-frc/cafeteria-raizes","last_synced_at":"2026-06-15T07:04:35.881Z","repository":{"id":352120013,"uuid":"1213810050","full_name":"felipe-frc/cafeteria-raizes","owner":"felipe-frc","description":"Aplicação web institucional para cafeteria colonial, com foco em UX, design sofisticado, vídeo imersivo e interface responsiva.","archived":false,"fork":false,"pushed_at":"2026-06-14T12:53:45.000Z","size":115031,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-06-14T13:24:02.766Z","etag":null,"topics":["cafeteria","frontend","landing-page","react","restaurant-website","tailwindcss","typescript","ui-design","vite"],"latest_commit_sha":null,"homepage":"https://cafeteria-colonial-xi.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/felipe-frc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-04-17T19:36:30.000Z","updated_at":"2026-06-14T12:24:59.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/felipe-frc/cafeteria-raizes","commit_stats":null,"previous_names":["felipe-frc/cafeteria-colonial","felipe-frc/cafeteria-raizes"],"tags_count":8,"template":false,"template_full_name":null,"purl":"pkg:github/felipe-frc/cafeteria-raizes","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipe-frc%2Fcafeteria-raizes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipe-frc%2Fcafeteria-raizes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipe-frc%2Fcafeteria-raizes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipe-frc%2Fcafeteria-raizes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/felipe-frc","download_url":"https://codeload.github.com/felipe-frc/cafeteria-raizes/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipe-frc%2Fcafeteria-raizes/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34351454,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-15T02:00:07.085Z","response_time":63,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cafeteria","frontend","landing-page","react","restaurant-website","tailwindcss","typescript","ui-design","vite"],"created_at":"2026-06-15T07:04:31.462Z","updated_at":"2026-06-15T07:04:35.868Z","avatar_url":"https://github.com/felipe-frc.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ☕ Cafeteria Raízes\n\n![Frontend CI](https://github.com/felipe-frc/cafeteria-colonial/actions/workflows/frontend-ci.yml/badge.svg)\n![Vercel](https://img.shields.io/badge/deploy-Vercel-black?logo=vercel)\n![React](https://img.shields.io/badge/React-19-61DAFB?logo=react\u0026logoColor=black)\n![TypeScript](https://img.shields.io/badge/TypeScript-5-3178C6?logo=typescript\u0026logoColor=white)\n![Vite](https://img.shields.io/badge/Vite-7-646CFF?logo=vite\u0026logoColor=white)\n![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-4-38B2AC?logo=tailwindcss\u0026logoColor=white)\n![License](https://img.shields.io/badge/license-MIT-green)\n\nAplicação web desenvolvida para a **Cafeteria Raízes**, com foco em **interface sofisticada**, **cardápio interativo**, **carrinho de pedidos**, **integração com WhatsApp**, **experiência do usuário**, **responsividade**, **organização de código** e **deploy em produção com Vercel**.\n\nO projeto foi desenvolvido com **React**, **TypeScript**, **Vite** e **Tailwind CSS**, utilizando uma estrutura limpa, componentizada e preparada para evolução.\n\nA aplicação apresenta uma landing page moderna para a **Cafeteria Raízes**, permitindo que o usuário visualize o menu, adicione produtos ao carrinho, controle quantidades e envie o pedido formatado diretamente pelo WhatsApp.\n\n---\n\n## 🌐 Acesse o Projeto\n\n👉 **Deploy:** [Cafeteria Raízes na Vercel](https://cafeteria-raizes-livid.vercel.app/)\n\n👉 **Repositório:** [Acessar no GitHub](https://github.com/felipe-frc/cafeteria-raizes)\n\n\u003e A aplicação está hospedada na Vercel como projeto front-end estático. O build de produção é gerado com Vite e publicado a partir da pasta `dist`.\n\nPara executar localmente, siga as instruções da seção **Como Executar**.\n\n---\n\n## 📌 Objetivo do Projeto\n\nEste projeto foi desenvolvido com o objetivo de praticar e demonstrar conhecimentos em:\n\n- Desenvolvimento front-end moderno com React e TypeScript;\n- Construção de landing pages responsivas;\n- Organização de componentes por responsabilidade;\n- Separação entre layout, seções, dados, hooks e utilitários;\n- Manipulação de estado com carrinho de pedidos;\n- Cálculo de totais e controle de quantidade;\n- Integração com WhatsApp através de mensagem formatada;\n- Estilização com Tailwind CSS;\n- Integração de imagens, mapa e assets locais;\n- Criação de interface com identidade visual própria;\n- Aplicação de boas práticas de UX/UI;\n- Configuração de build e deploy com Vite e Vercel;\n- Limpeza estrutural de projeto e remoção de código morto;\n- Testes automatizados com Vitest e Testing Library;\n- Documentação técnica para portfólio profissional.\n\n---\n\n## ⭐ Destaques Técnicos\n\n- Projeto front-end puro com React, TypeScript, Vite e Tailwind CSS;\n- Estrutura organizada em componentes de layout, seções, carrinho, dados, hooks e utilitários;\n- Header fixo com navegação por âncoras e contador de itens no carrinho;\n- Hero section com identidade visual forte e chamada principal;\n- Seção institucional apresentando a essência da cafeteria;\n- Cardápio interativo dividido entre **Bebidas** e **Quitandas**;\n- Carrinho lateral com controle de quantidade;\n- Cálculo automático do total do pedido;\n- Envio do pedido pelo WhatsApp com mensagem formatada;\n- Depoimentos de clientes em formato visual;\n- Seção de localização com Google Maps incorporado;\n- Background interno com imagem temática aplicada de forma sutil;\n- Imagens e assets locais organizados no projeto;\n- SEO básico configurado no `index.html`;\n- Testes automatizados configurados com Vitest e Testing Library;\n- Pipeline de CI com GitHub Actions;\n- Deploy configurado na Vercel com `vercel.json`;\n- Build de produção gerado com Vite;\n- Estrutura limpa, sem arquivos gerados, dependências desnecessárias ou código morto.\n\n---\n\n## 🧩 Funcionalidades\n\n### 🏠 Página Inicial\n\n- Apresentação visual da Cafeteria Raízes;\n- Imagem principal com identidade da marca;\n- Botão de chamada para reserva/contato;\n- Navegação direta para as seções principais da página;\n- Header fixo com acesso ao carrinho.\n\n### ☕ Nossa Essência\n\n- Seção institucional com apresentação da cafeteria;\n- Texto descritivo sobre tradição, acolhimento e experiência artesanal;\n- Indicadores visuais de anos de tradição, clientes felizes e qualidade;\n- Imagem temática para reforçar a identidade visual.\n\n### 🍵 Menu\n\n- Cardápio dividido em categorias;\n- Alternância entre **Bebidas** e **Quitandas**;\n- Exibição de imagem, nome, descrição e preço dos produtos;\n- Layout em cards responsivos;\n- Botão **Adicionar** em cada produto;\n- Hover visual nos cards para reforçar a ação de pedido.\n\n### 🛒 Carrinho de Pedidos\n\n- Adição de produtos ao carrinho;\n- Abertura automática do carrinho após adicionar item;\n- Contador de itens no header;\n- Controle de quantidade por produto;\n- Remoção individual de itens;\n- Opção para limpar o carrinho;\n- Cálculo automático do total;\n- Visualização resumida do pedido antes do envio.\n\n### 📲 Integração com WhatsApp\n\n- Geração automática da mensagem do pedido;\n- Inclusão de produtos, quantidades, valores e total;\n- Envio do pedido para o WhatsApp da cafeteria;\n- Fluxo pensado para retirada no local;\n- Experiência simples e compatível com pequenos negócios.\n\n### ⭐ Depoimentos\n\n- Depoimentos de clientes;\n- Exibição visual de estrelas;\n- Cards com nome do cliente e comentário;\n- Reforço de prova social para o negócio.\n\n### 📍 Localização e Contato\n\n- Informações de endereço;\n- Telefone;\n- E-mail;\n- Horários de funcionamento;\n- Mapa integrado com Google Maps;\n- Seção preparada para contato e conversão do usuário.\n\n---\n\n## 🛠️ Tecnologias\n\n| Camada / Finalidade     | Tecnologia                    |\n| ----------------------- | ----------------------------- |\n| Linguagem               | TypeScript                    |\n| Biblioteca de Interface | React                         |\n| Build Tool              | Vite                          |\n| Estilização             | Tailwind CSS                  |\n| Ícones                  | Lucide React                  |\n| Componentização UI      | shadcn/ui — componente Button |\n| Utilitários de classe   | clsx, tailwind-merge          |\n| Testes                  | Vitest, Testing Library       |\n| Deploy                  | Vercel                        |\n| Configuração de Deploy  | vercel.json                   |\n| Versionamento           | Git / GitHub                  |\n| CI/CD                   | GitHub Actions                |\n| Formatação              | Prettier                      |\n\n---\n\n## 🧱 Arquitetura\n\nO projeto utiliza uma estrutura front-end organizada por responsabilidade, separando componentes visuais, dados estáticos, hooks, utilitários, assets públicos e configurações de build/deploy.\n\n```txt\nprojeto/\n│\n├── client/\n│   ├── index.html\n│   │\n│   ├── public/\n│   │   ├── images/\n│   │   │   ├── background-home.png\n│   │   │   ├── background-home.webp\n│   │   │   ├── cafeteria-identidade.png\n│   │   │   ├── logo-cafeteria.png\n│   │   │   │\n│   │   │   ├── menu/\n│   │   │   │   ├── biscoito-de-polvilho.png\n│   │   │   │   ├── bolo-de-chocolate.png\n│   │   │   │   ├── bolo-de-milho.png\n│   │   │   │   ├── broa-de-milho.png\n│   │   │   │   ├── cafe-coado.png\n│   │   │   │   ├── cafe-com-leite.png\n│   │   │   │   ├── cafe-gelado.png\n│   │   │   │   ├── cappuccino-tradicional.png\n│   │   │   │   ├── croissant.png\n│   │   │   │   ├── macchiato-classico.png\n│   │   │   │   └── pao-de-queijo.png\n│   │   │   │\n│   │   │   └── telas/\n│   │   │       ├── carrinho.png\n│   │   │       ├── depoimentos.png\n│   │   │       ├── home.png\n│   │   │       ├── interface.png\n│   │   │       ├── menu-bebidas.png\n│   │   │       ├── menu-quitandas.png\n│   │   │       ├── nos-visite.png\n│   │   │       └── sobre.png\n│   │   │\n│   │   └── video/\n│   │       └── video-fundo.mp4\n│   │\n│   └── src/\n│       ├── App.tsx\n│       ├── main.tsx\n│       ├── index.css\n│       │\n│       ├── components/\n│       │   ├── ErrorBoundary.tsx\n│       │   │\n│       │   ├── cart/\n│       │   │   └── CartDrawer.tsx\n│       │   │\n│       │   ├── layout/\n│       │   │   ├── Footer.tsx\n│       │   │   └── Header.tsx\n│       │   │\n│       │   ├── sections/\n│       │   │   ├── AboutSection.tsx\n│       │   │   ├── ContactSection.tsx\n│       │   │   ├── HeroSection.tsx\n│       │   │   ├── MenuSection.tsx\n│       │   │   ├── ReviewsSection.tsx\n│       │   │   └── SectionTitle.tsx\n│       │   │\n│       │   └── ui/\n│       │       └── button.tsx\n│       │\n│       ├── data/\n│       │   ├── contact.ts\n│       │   ├── menu.ts\n│       │   └── reviews.ts\n│       │\n│       ├── hooks/\n│       │   └── useCart.ts\n│       │\n│       ├── lib/\n│       │   └── utils.ts\n│       │\n│       ├── pages/\n│       │   └── Home.tsx\n│       │\n│       └── utils/\n│           ├── currency.ts\n│           └── whatsapp.ts\n│\n├── .github/\n│   └── workflows/\n│       └── frontend-ci.yml\n│\n├── .gitignore\n├── .prettierignore\n├── .prettierrc\n├── components.json\n├── LICENSE\n├── package-lock.json\n├── package.json\n├── README.md\n├── tsconfig.json\n├── tsconfig.node.json\n├── vercel.json\n└── vite.config.ts\n```\n\n### 📂 Organização das Pastas\n\n| Caminho                                   | Responsabilidade                                    |\n| ----------------------------------------- | --------------------------------------------------- |\n| `client/index.html`                       | Arquivo HTML principal usado pelo Vite              |\n| `client/public/images`                    | Imagens públicas do projeto                         |\n| `client/public/images/menu`               | Imagens dos produtos exibidos no cardápio           |\n| `client/public/images/telas`              | Prints utilizados na documentação do README         |\n| `client/public/video`                     | Vídeo utilizado como recurso visual da aplicação    |\n| `client/src/components/ErrorBoundary.tsx` | Componente de proteção contra erros de renderização |\n| `client/src/components/cart`              | Componentes relacionados ao carrinho de pedidos     |\n| `client/src/components/layout`            | Componentes estruturais, como cabeçalho e rodapé    |\n| `client/src/components/sections`          | Seções principais da landing page                   |\n| `client/src/components/ui`                | Componentes reutilizáveis de interface              |\n| `client/src/data`                         | Dados estáticos de contato, menu e depoimentos      |\n| `client/src/hooks`                        | Hooks personalizados, como a lógica do carrinho     |\n| `client/src/lib`                          | Funções auxiliares compartilhadas                   |\n| `client/src/pages`                        | Páginas da aplicação                                |\n| `client/src/utils`                        | Utilitários para moeda e integração com WhatsApp    |\n| `.github/workflows/frontend-ci.yml`       | Pipeline de CI com validação, testes e build        |\n| `vercel.json`                             | Configuração de deploy na Vercel                    |\n| `vite.config.ts`                          | Configuração do Vite                                |\n| `tsconfig.json`                           | Configuração principal do TypeScript                |\n| `tsconfig.node.json`                      | Configuração TypeScript para arquivos Node/Vite     |\n| `components.json`                         | Configuração dos componentes de UI                  |\n\n### 🔄 Fluxo Principal da Aplicação\n\n```txt\nmain.tsx\n   ↓\nApp.tsx\n   ↓\nHome.tsx\n   ↓\nHeader\nHeroSection\nAboutSection\nMenuSection\nReviewsSection\nContactSection\nFooter\nCartDrawer\n```\n\n### 🛒 Fluxo do Carrinho\n\n```txt\nMenuSection\n   ↓\nAdicionar produto\n   ↓\nuseCart\n   ↓\nCartDrawer\n   ↓\nGerar total do pedido\n   ↓\nwhatsapp.ts\n   ↓\nEnviar pedido formatado pelo WhatsApp\n```\n\n### 🧩 Separação de Responsabilidades\n\n- `MenuSection.tsx` exibe os produtos e aciona a adição ao carrinho;\n- `useCart.ts` centraliza a lógica de adicionar, remover, alterar quantidade, limpar carrinho e calcular totais;\n- `CartDrawer.tsx` exibe o carrinho lateral e as ações do pedido;\n- `currency.ts` centraliza a formatação de valores monetários;\n- `whatsapp.ts` monta o link e a mensagem formatada para envio do pedido;\n- `menu.ts`, `reviews.ts` e `contact.ts` mantêm os dados separados da interface;\n- `Header.tsx` concentra a navegação principal e o contador de itens do carrinho;\n- `Home.tsx` organiza a composição geral da página;\n- `ErrorBoundary.tsx` adiciona uma camada de segurança para falhas inesperadas na renderização.\n\n### ⚠️ Observação sobre Arquivos Gerados\n\nAs pastas abaixo não fazem parte da arquitetura versionada do projeto e não devem ser enviadas para o GitHub:\n\n```txt\nnode_modules/\ndist/\n.git/\n```\n\n- `node_modules/` é recriada com `npm install`;\n- `dist/` é recriada com `npm run build`;\n- `.git/` pertence ao controle interno do Git e não deve ser incluída em ZIPs do projeto.\n\n---\n\n## 📸 Interface do Sistema\n\n### 📱 Interface Completa\n\nVisão geral da landing page com hero, seção institucional, menu, carrinho, depoimentos e localização.\n\n![Interface completa da Cafeteria Raízes](client/public/images/telas/interface.png)\n\n---\n\n### 🏠 Página Inicial\n\nHero section com identidade visual da cafeteria, navegação superior e chamada para contato.\n\n![Página inicial da Cafeteria Raízes](client/public/images/telas/home.png)\n\n---\n\n### ☕ Nossa Essência\n\nSeção institucional com apresentação da tradição, proposta visual e indicadores da cafeteria.\n\n![Seção Nossa Essência](client/public/images/telas/sobre.png)\n\n---\n\n### 🍵 Menu — Bebidas\n\nCardápio de bebidas com imagens, descrições, preços e botão para adicionar ao pedido.\n\n![Menu de bebidas](client/public/images/telas/menu-bebidas.png)\n\n---\n\n### 🥐 Menu — Quitandas\n\nCardápio de quitandas com produtos visuais e organização por categoria.\n\n![Menu de quitandas](client/public/images/telas/menu-quitandas.png)\n\n---\n\n### 🛒 Carrinho de Pedidos\n\nCarrinho lateral com produtos adicionados, controle de quantidade, total e envio pelo WhatsApp.\n\n![Carrinho de pedidos](client/public/images/telas/carrinho.png)\n\n---\n\n### ⭐ Depoimentos\n\nDepoimentos de clientes em cards com avaliação visual.\n\n![Depoimentos de clientes](client/public/images/telas/depoimentos.png)\n\n---\n\n### 📍 Visite-nos\n\nSeção com endereço, telefone, e-mail, horários e mapa incorporado.\n\n![Seção Visite-nos](client/public/images/telas/nos-visite.png)\n\n---\n\n## ⚙️ Como Executar\n\n### 📋 Pré-requisitos\n\n- [Node.js](https://nodejs.org/)\n- [Git](https://git-scm.com/)\n- Editor de código, como [VS Code](https://code.visualstudio.com/)\n\n---\n\n### 1. Clone o repositório\n\n```bash\ngit clone https://github.com/felipe-frc/cafeteria-colonial.git\n```\n\n---\n\n### 2. Acesse a pasta do projeto\n\n```bash\ncd cafeteria-colonial\n```\n\n---\n\n### 3. Instale as dependências\n\n```bash\nnpm install\n```\n\n---\n\n### 4. Execute em ambiente de desenvolvimento\n\n```bash\nnpm run dev\n```\n\nAcesse no navegador:\n\n```txt\nhttp://localhost:5173\n```\n\n---\n\n### 5. Valide o TypeScript\n\n```bash\nnpm run check\n```\n\n---\n\n### 6. Execute os testes automatizados\n\n```bash\nnpm run test\n```\n\n---\n\n### 7. Gere o build de produção\n\n```bash\nnpm run build\n```\n\nO Vite irá gerar a pasta:\n\n```txt\ndist/\n```\n\n---\n\n### 8. Visualize o build localmente\n\n```bash\nnpm run preview\n```\n\n---\n\n## ✅ Qualidade e Organização\n\nO projeto passou por uma limpeza estrutural para manter apenas arquivos, dependências e componentes realmente necessários.\n\nEntre as melhorias aplicadas estão:\n\n- Remoção de arquivos gerados localmente;\n- Remoção de pastas desnecessárias para o funcionamento da aplicação;\n- Simplificação da estrutura para front-end estático;\n- Organização da Home em componentes menores;\n- Separação dos dados do cardápio, contato e depoimentos;\n- Separação da lógica de carrinho em hook dedicado;\n- Separação da formatação de moeda em utilitário próprio;\n- Separação da geração de mensagem do WhatsApp em utilitário próprio;\n- Redução de dependências não utilizadas;\n- Configuração de deploy com `vercel.json`;\n- Configuração de testes automatizados com Vitest e Testing Library;\n- Configuração de CI com GitHub Actions;\n- Padronização dos scripts no `package.json`;\n- Atualização da documentação do projeto.\n\nScripts disponíveis:\n\n| Comando           | Descrição                                        |\n| ----------------- | ------------------------------------------------ |\n| `npm run dev`     | Executa o projeto em ambiente de desenvolvimento |\n| `npm run build`   | Gera o build de produção com Vite                |\n| `npm run preview` | Visualiza localmente o build gerado              |\n| `npm run check`   | Executa verificação TypeScript                   |\n| `npm run test`    | Executa os testes automatizados                  |\n| `npm run format`  | Formata os arquivos com Prettier                 |\n\n---\n\n## 🧪 Testes Automatizados\n\nO projeto possui testes automatizados configurados com **Vitest** e **Testing Library**, reforçando a confiabilidade das principais partes da aplicação.\n\nOs testes ajudam a validar comportamentos importantes da interface e reduzem o risco de regressões durante futuras melhorias.\n\nPara executar os testes localmente:\n\n```bash\nnpm run test\n```\n\nAlém dos testes, o projeto também possui verificação TypeScript:\n\n```bash\nnpm run check\n```\n\nE build de produção:\n\n```bash\nnpm run build\n```\n\nEssas validações também são executadas no fluxo de CI do GitHub Actions.\n\n---\n\n## 🧠 Decisões de Desenvolvimento\n\n### Projeto front-end estático\n\nA aplicação foi mantida como front-end puro, sem backend próprio, porque o objetivo do projeto é apresentar uma experiência institucional e comercial leve, focada em interface, cardápio, pedido e contato direto.\n\nEssa decisão simplifica o deploy, reduz complexidade e torna o projeto mais direto para avaliação em portfólio.\n\n### Carrinho sem backend\n\nO carrinho foi implementado no front-end para permitir que o usuário monte um pedido de forma simples, sem necessidade de banco de dados, autenticação ou painel administrativo.\n\nEssa abordagem é adequada para pequenos negócios que recebem pedidos diretamente por WhatsApp.\n\n### Integração com WhatsApp\n\nA integração com WhatsApp foi escolhida por ser uma solução prática e comum para cafeterias, lanchonetes e pequenos comércios.\n\nO sistema monta uma mensagem com os produtos, quantidades, valores e total, permitindo que o cliente envie o pedido de maneira rápida.\n\n### Componentização por responsabilidade\n\nA interface foi separada em componentes de layout, seções e carrinho.\n\nEssa organização evita que toda a página fique concentrada em um único arquivo e facilita futuras melhorias, como adicionar novas seções, alterar o cardápio ou evoluir o fluxo de pedidos.\n\n### Separação de dados e interface\n\nOs dados do menu, contato e depoimentos ficam separados da estrutura visual.\n\nIsso torna o código mais limpo, melhora a manutenção e permite atualizar produtos, valores, depoimentos ou telefone do WhatsApp sem alterar diretamente os componentes principais da interface.\n\n### Hooks e utilitários\n\nA lógica do carrinho foi isolada em um hook dedicado, enquanto a formatação de moeda e a montagem do link do WhatsApp foram separadas em utilitários.\n\nEssa separação melhora a legibilidade, reduz duplicação e facilita futuras alterações.\n\n### Testes automatizados\n\nO projeto utiliza testes automatizados com Vitest e Testing Library para validar comportamentos importantes da aplicação.\n\nEssa decisão melhora a confiabilidade do projeto e ajuda a evitar regressões em futuras evoluções.\n\n### Tailwind CSS para estilização\n\nO Tailwind CSS foi utilizado para construir uma interface responsiva e consistente, com controle direto sobre espaçamentos, cores, tipografia e comportamento visual.\n\n### Vercel como plataforma de deploy\n\nA Vercel foi escolhida por ser adequada para aplicações front-end modernas com Vite, oferecendo build automático a cada push na branch principal.\n\nO arquivo `vercel.json` define o diretório de saída como `dist`, garantindo que o deploy utilize corretamente o build gerado pelo Vite.\n\n---\n\n## 📦 Releases\n\n### [v3.0.0 — Carrinho de pedidos e integração com WhatsApp](https://github.com/felipe-frc/cafeteria-colonial/releases/tag/v3.0.0)\n\nVersão principal do projeto, transformando a landing page institucional em uma experiência interativa de pedidos com carrinho e envio direto pelo WhatsApp.\n\nPrincipais melhorias:\n\n- Adicionado carrinho de pedidos;\n- Adicionado botão **Adicionar** nos produtos do menu;\n- Implementado controle de quantidade dos itens;\n- Implementada remoção individual de produtos;\n- Adicionada opção para limpar o carrinho;\n- Implementado cálculo automático do total do pedido;\n- Adicionado envio do pedido pelo WhatsApp com mensagem formatada;\n- Adicionado contador de itens no carrinho;\n- Ajustado espaçamento interno dos cards do menu;\n- Corrigido posicionamento de preço e botão dentro dos cards;\n- Atualizada a imagem do produto **Macchiato Clássico**;\n- Mantida a estrutura limpa, componentizada e preparada para evolução.\n\n### [v2.1.0 — Limpeza estrutural e melhorias de layout](https://github.com/felipe-frc/cafeteria-colonial/releases/tag/v2.1.0)\n\nVersão focada na limpeza estrutural do projeto, remoção de arquivos desnecessários, organização da base de código e refinamentos visuais após a reestruturação da landing page.\n\nPrincipais melhorias:\n\n- Reorganização da estrutura do projeto;\n- Remoção de arquivos gerados e pastas desnecessárias;\n- Simplificação da aplicação como front-end React + Vite;\n- Remoção de código morto e dependências não utilizadas;\n- Separação da interface em componentes de layout, seções e dados;\n- Aplicação do background `background-home` nas seções internas;\n- Correção visual da seção **Nossa Essência**;\n- Ajuste de contraste no botão **Reservar**;\n- Correção da configuração de deploy na Vercel;\n- Adição do arquivo `vercel.json`;\n- Atualização da documentação do projeto.\n\n### [v2.0.0 — Rebranding e Reestruturação](https://github.com/felipe-frc/cafeteria-colonial/releases/tag/v2.0.0)\n\nNova versão principal do projeto, com reformulação visual e estrutural da landing page da cafeteria.\n\nPrincipais melhorias:\n\n- Reformulação significativa da interface;\n- Reorganização da estrutura do projeto;\n- Atualização da identidade visual;\n- Substituição de assets externos por arquivos locais;\n- Cardápio interativo com categorias;\n- Seção institucional;\n- Mapa integrado na seção de contato;\n- Favicon com a logo do projeto;\n\n### [v1.0.1 — Atualização de estabilidade e documentação](https://github.com/felipe-frc/cafeteria-colonial/releases/tag/v.1.0.1)\n\nAtualização do projeto com foco em estabilidade, organização e melhoria da documentação.\n\nPrincipais melhorias:\n\n- Correção da estrutura inicial do projeto;\n- Ajustes nas configurações de build;\n- Estabilização de dependências;\n- Melhoria na organização do código;\n- Atualização do README;\n- Preparação do projeto para deploy e evolução contínua.\n\n\u003e Observação: esta versão utilizou a tag `v.1.0.1`. Nas próximas versões, o padrão recomendado é manter tags no formato `v1.0.1`, sem ponto após o `v`.\n\n### [v1.0.0 — Primeira versão estável](https://github.com/felipe-frc/cafeteria-colonial/releases/tag/v1.0.0)\n\nPrimeira versão oficial do projeto Cafeteria Raízes.\n\nPrincipais entregas:\n\n- Layout institucional completo da cafeteria;\n- Hero section com identidade visual;\n- Proposta visual sofisticada da marca;\n- Menu dividido entre bebidas e alimentos;\n- Seção de depoimentos;\n- Seção de localização com mapa incorporado;\n- Footer com informações de contato;\n- Organização inicial do projeto para portfólio.\n\n---\n\n## 📈 Melhorias Futuras\n\n- Formulário de contato funcional;\n- Seleção entre retirada no local e entrega;\n- Campo de observações no carrinho;\n- Validação de pedido mínimo;\n- Persistência do carrinho com `localStorage`;\n- Melhorias de acessibilidade;\n- Animações sutis entre seções;\n- Galeria de fotos do ambiente e produtos;\n- Domínio personalizado;\n- Área administrativa para gerenciar o cardápio.\n\n---\n\n## 📄 Licença\n\nEste projeto está sob a licença MIT. Veja o arquivo [LICENSE](LICENSE) para mais detalhes.\n\n---\n\n## 👨🏻‍💻 Autor\n\n**Marcos Felipe França**\n\n[LinkedIn](https://www.linkedin.com/in/marcosfelipefrc) · [GitHub](https://github.com/felipe-frc)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelipe-frc%2Fcafeteria-raizes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffelipe-frc%2Fcafeteria-raizes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelipe-frc%2Fcafeteria-raizes/lists"}