docs(README): Translate to Portuguese and enhance with project details

- Added NutriScan logo and updated badge versions for accuracy
- Translated entire README from English to Portuguese for localization
- Introduced new sections: mission, differentials, statistics, and visual demonstration
- Restructured table of contents and expanded project description for better user engagement and clarity
This commit is contained in:
Evandro Fonseca Junior committed 2025-10-09 08:26:15 -03:00
1 parent 888dee8b62
commit 68ed76a563
13 files changed
+670 -529

No files matched your search

+366 -251
View File
@@ -2,295 +2,314 @@
<div align="center"> <div align="center">
[![Next.js](https://img.shields.io/badge/Next.js-14-black?style=for-the-badge&logo=next.js&logoColor=white)](https://nextjs.org/) ![NutriScan Logo](./public/apple-touch-icon.png)
[![TypeScript](https://img.shields.io/badge/TypeScript-5.7-blue?style=for-the-badge&logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
[![Prisma](https://img.shields.io/badge/Prisma-5.22-2D3748?style=for-the-badge&logo=prisma&logoColor=white)](https://www.prisma.io/) **Plataforma completa de informações nutricionais alimentares**
[![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-3.4-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white)](https://tailwindcss.com/)
_Descubra o que a comunidade alimentar sabe sobre seus alimentos_
[![Next.js](https://img.shields.io/badge/Next.js-14.2.18-black?style=for-the-badge&logo=next.js&logoColor=white)](https://nextjs.org/)
[![TypeScript](https://img.shields.io/badge/TypeScript-5.7.2-blue?style=for-the-badge&logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
[![Prisma](https://img.shields.io/badge/Prisma-5.22.0-2D3748?style=for-the-badge&logo=prisma&logoColor=white)](https://www.prisma.io/)
[![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-3.4.15-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white)](https://tailwindcss.com/)
[![Open Food Facts](https://img.shields.io/badge/Open_Food_Facts-API-4CAF50?style=for-the-badge&logo=openfoodfacts&logoColor=white)](https://world.openfoodfacts.org/) [![Open Food Facts](https://img.shields.io/badge/Open_Food_Facts-API-4CAF50?style=for-the-badge&logo=openfoodfacts&logoColor=white)](https://world.openfoodfacts.org/)
[![Live Demo](https://img.shields.io/badge/Live_Demo-00B37E?style=for-the-badge&logo=vercel&logoColor=white)](https://nutriscan.evandro.dev.br) [![Live Demo](https://img.shields.io/badge/Live_Demo-00B37E?style=for-the-badge&logo=vercel&logoColor=white)](https://nutriscan.evandro.dev.br)
[![Report Bug](https://img.shields.io/badge/Report_Bug-E62117?style=for-the-badge&logo=github&logoColor=white)](https://github.com/evandrodevbr/lista-compras/issues) [![Report Bug](https://img.shields.io/badge/Report_Bug-E62117?style=for-the-badge&logo=github&logoColor=white)](https://github.com/evandrodevbr/lista-compras/issues)
[![Request Feature](https://img.shields.io/badge/Request_Feature-2EA043?style=for-the-badge&logo=github&logoColor=white)](https://github.com/evandrodevbr/lista-compras/issues) [![Request Feature](https://img.shields.io/badge/Request_Feature-2EA043?style=for-the-badge&logo=github&logoColor=white)](https://github.com/evandrodevbr/lista-compras/issues)
**A comprehensive nutritional information platform powered by Open Food Facts API**
</div> </div>
## Table of Contents ## 📋 Índice
- [About the Project](#-about-the-project) - [Sobre o Projeto](#-sobre-o-projeto)
- [Features](#-features) - [Demonstração Visual](#-demonstração-visual)
- [Tech Stack](#-tech-stack) - [Funcionalidades](#-funcionalidades)
- [Architecture](#-architecture) - [Stack Tecnológica](#-stack-tecnológica)
- [Getting Started](#-getting-started) - [Arquitetura](#-arquitetura)
- [Project Structure](#-project-structure) - [Instalação e Setup](#-instalação-e-setup)
- [API Integration](#-api-integration) - [API e Integrações](#-api-e-integrações)
- [Database Schema](#-database-schema) - [Database Schema](#-database-schema)
- [Available Scripts](#-available-scripts) - [Performance e Otimizações](#-performance-e-otimizações)
- [Contributing](#-contributing) - [Deployment](#-deployment)
- [License](#-license) - [Scripts Disponíveis](#-scripts-disponíveis)
- [Contact](#-contact) - [Contribuindo](#-contribuindo)
- [Acknowledgments](#-acknowledgments) - [Licença](#-licença)
- [Contato](#-contato)
- [Agradecimentos](#-agradecimentos)
## 🚀 About the Project ## 🚀 Sobre o Projeto
NutriScan is a modern web application designed to provide users with comprehensive nutritional information about food products. By leveraging the powerful Open Food Facts API, NutriScan enables users to search for products by barcode or name and access detailed nutritional data, ingredient lists, and health classifications to make informed dietary choices. **NutriScan** é uma plataforma web moderna que democratiza o acesso a informações nutricionais transparentes e confiáveis. Desenvolvida com foco na experiência do usuário e performance, a aplicação conecta consumidores conscientes à maior base de dados colaborativa de alimentos do mundo.
### 🎯 Mission ### 🎯 Missão
Empower users with accurate, comprehensive nutritional data to make healthier food choices through an intuitive, fast, and reliable platform. Empoderar usuários com dados nutricionais precisos e abrangentes para tomada de decisões alimentares mais conscientes através de uma plataforma intuitiva, rápida e confiável.
### 🎯 Key Differentiators ### ⭐ Diferenciais
- **Comprehensive Data**: Access to millions of products from the world's largest open food database - **Dados Colaborativos**: Acesso a milhões de produtos da maior base de dados open source do mundo
- **Advanced Filtering**: Sophisticated search and filter capabilities for precise product discovery - **Filtros Avançados**: Sistema sofisticado de busca e filtros para descoberta precisa de produtos
- **Health Classifications**: Nutri-Score and NOVA group ratings for quick health assessment - **Classificações de Saúde**: Nutri-Score e NOVA group para avaliação rápida da qualidade
- **Real-time Updates**: Live data synchronization and instant search results - **Atualizações em Tempo Real**: Sincronização de dados ao vivo e resultados instantâneos
- **Developer-Friendly**: Clean architecture with modern web technologies - **Arquitetura Moderna**: Desenvolvida com tecnologias de ponta e foco em performance
## ✨ Features ### 📊 Estatísticas
### 🔍 Nutritional Search | Métrica | Valor |
| ------------------- | ----- |
| Produtos no banco | 2M+ |
| Países cobertos | 100+ |
| Disponibilidade | 24/7 |
| Dados colaborativos | Sim |
- **Barcode Scanning**: Instant product lookup using barcode numbers ## 📱 Demonstração Visual
- **Text Search**: Search products by name, brand, or category
- **Advanced Filtering**: Filter by nutrition grades, categories, brands, allergens, and more
- **Real-time Results**: Fast search with instant feedback
### 📊 Comprehensive Data > **Nota**: Screenshots serão adicionados em breve mostrando as principais funcionalidades da aplicação.
- **Nutritional Information**: Complete macronutrient and micronutrient breakdown ### Principais Telas
- **Health Classifications**: Nutri-Score (A-E) and NOVA group (1-4) ratings
- **Ingredient Analysis**: Detailed ingredient lists with allergen identification
- **Additive Information**: Complete additive and preservative listings
### 🛒 Shopping Lists - **Página Inicial**: Interface de busca com hero section e barra de pesquisa
- **Resultados**: Lista de produtos com filtros avançados e ordenação
- **Detalhes do Produto**: Informações nutricionais completas e classificações
- **Lista de Compras**: Gerenciamento de produtos com quantidades e status
- **Modos de Tema**: Visualização em tema claro e escuro
- **Collaborative Lists**: Create and share shopping lists with others ## ✨ Funcionalidades
- **Real-time Updates**: Live synchronization across devices
- **Product Management**: Add, remove, and mark items as purchased
- **Quantity Tracking**: Specify quantities and units for each item
### 🎨 User Experience ### 🔍 Sistema de Busca Inteligente
- **Responsive Design**: Optimized for desktop, tablet, and mobile devices O NutriScan oferece múltiplas formas de encontrar produtos alimentícios:
- **Dark/Light Themes**: Automatic theme switching with system preferences
- **Accessibility**: WCAG compliant with keyboard navigation and screen reader support
- **Performance**: Optimized loading times with caching and pagination
### ⚡ Technical Features - **Busca por Código de Barras**: Reconhecimento automático de códigos de 8-13 dígitos
- **Busca por Nome/Marca**: Pesquisa textual inteligente com sugestões
- **Detecção Automática**: Sistema que identifica o tipo de busca automaticamente
- **Geolocalização**: Priorização de produtos locais baseada na localização do usuário
- **API Proxy**: Chamadas seguras através de rotas Next.js para evitar problemas de CORS
- **Server Actions**: Real-time data updates without page refreshes ### 💾 Sistema de Cache Avançado
- **Caching Strategy**: Intelligent caching for improved performance
- **API Proxy**: Secure API calls through Next.js API routes
- **Type Safety**: Full TypeScript implementation for reliability
## 🛠 Tech Stack Sistema multi-camada de cache para performance otimizada:
### Core Framework - **Cache localStorage**: Armazenamento local com TTL configurável
- **Cache de Buscas**: Armazenamento completo de buscas com filtros aplicados
- **Cache JSON**: 218 produtos pré-carregados para uso offline
- **Modo Cache-Only**: Funcionamento completo sem conexão com internet
- **Sincronização Inteligente**: Atualização automática de dados quando online
- **Estatísticas de Storage**: Monitoramento de uso de armazenamento
- **[Next.js 14](https://nextjs.org/)** - React framework with App Router and Server Actions ### 🎛️ Filtros e Ordenação
- **[TypeScript](https://www.typescriptlang.org/)** - Type-safe JavaScript development
- **[React 18](https://react.dev/)** - Modern React with concurrent features
### Database & ORM Sistema robusto de filtros para descoberta precisa:
- **[Prisma](https://www.prisma.io/)** - Type-safe database ORM #### Classificações de Saúde
- **[SQLite](https://www.sqlite.org/)** - Lightweight, serverless database
### Styling & UI - **Nutri-Score**: Filtro por classificação A-E (muito bom a muito ruim)
- **NOVA Group**: Filtro por nível de processamento 1-4 (não processado a ultraprocessado)
- **[Tailwind CSS](https://tailwindcss.com/)** - Utility-first CSS framework #### Filtros de Produto
- **[shadcn/ui](https://ui.shadcn.com/)** - Reusable component library
- **[Radix UI](https://www.radix-ui.com/)** - Unstyled, accessible UI primitives
- **[Lucide Icons](https://lucide.dev/)** - Beautiful, customizable icons
- **[Framer Motion](https://www.framer.com/motion/)** - Animation library
### External APIs - **Categorias**: Filtro por tipo de alimento (bebidas, laticínios, snacks, etc.)
- **Marcas**: Filtro por fabricante
- **Alérgenos**: Identificação e filtro por substâncias alergênicas
- **Aditivos**: Filtro por aditivos alimentares e conservantes
- **[Open Food Facts](https://world.openfoodfacts.org/)** - Global food product database #### Filtros Nutricionais
- **Geolocation API** - Location-based product recommendations
### Development Tools - **Ranges Personalizados**: Filtros por valores nutricionais (calorias, gorduras, açúcares, etc.)
- **12 Opções de Ordenação**: Por relevância, nutrição, nome, marca, valores nutricionais, etc.
- **[ESLint](https://eslint.org/)** - Code linting and formatting ### 🛒 Listas de Compras Colaborativas
- **[PostCSS](https://postcss.org/)** - CSS processing
- **[pnpm](https://pnpm.io/)** - Fast, disk space efficient package manager
## 🏗 Architecture Sistema completo de gerenciamento de compras:
### App Router Structure - **Múltiplas Listas**: Criação e gerenciamento de várias listas de compras
- **Produtos Detalhados**: Adição com quantidade, unidade e observações
- **Status de Compra**: Marcação de itens como comprados
- **Sincronização**: Persistência via Prisma + SQLite
- **Compartilhamento**: Compartilhamento de listas via ID único
The application uses Next.js 14's App Router with the following organization: ### 🎨 Interface e Experiência do Usuário
Design moderno e acessível:
- **Design Responsivo**: Mobile-first com adaptação para todos os dispositivos
- **Temas**: Modo claro e escuro com persistência de preferência
- **Animações**: Transições suaves com Framer Motion
- **Acessibilidade**: Componentes Radix UI com suporte completo a leitores de tela
- **Estados de Loading**: Skeletons e indicadores de carregamento
- **Paginação Otimizada**: Carregamento eficiente de grandes listas
- **Imagens Otimizadas**: Lazy loading e otimização automática
## 🛠 Stack Tecnológica
### Framework Principal
- **[Next.js 14.2.18](https://nextjs.org/)** - React framework com App Router e Server Actions
- **[TypeScript 5.7.2](https://www.typescriptlang.org/)** - JavaScript tipado para maior confiabilidade
- **[React 18.3.1](https://react.dev/)** - Biblioteca de interface moderna com recursos concorrentes
### Banco de Dados e ORM
- **[Prisma 5.22.0](https://www.prisma.io/)** - ORM type-safe para gerenciamento de dados
- **[SQLite](https://www.sqlite.org/)** - Banco de dados leve e serverless
### Estilização e UI
- **[Tailwind CSS 3.4.15](https://tailwindcss.com/)** - Framework CSS utility-first
- **[shadcn/ui](https://ui.shadcn.com/)** - Biblioteca de componentes reutilizáveis
- **[Radix UI](https://www.radix-ui.com/)** - Primitivos acessíveis não estilizados
- **[Lucide Icons 0.460.0](https://lucide.dev/)** - Ícones bonitos e customizáveis
- **[Framer Motion 11.12.0](https://www.framer.com/motion/)** - Biblioteca de animações
### APIs Externas
- **[Open Food Facts](https://world.openfoodfacts.org/)** - Base de dados global de produtos alimentícios
- **Geolocation API** - Recomendações baseadas em localização
### Ferramentas de Desenvolvimento
- **[ESLint 8.57.1](https://eslint.org/)** - Linting e formatação de código
- **[PostCSS 8.4.49](https://postcss.org/)** - Processamento de CSS
- **[pnpm](https://pnpm.io/)** - Gerenciador de pacotes eficiente
## 🏗 Arquitetura
### Estrutura do App Router
``` ```
app/ app/
├── actions.ts # Server Actions for data mutations ├── actions.ts # Server Actions para mutações de dados
├── api/ # API Routes for external service proxies ├── api/ # Rotas de API para proxies de serviços externos
│ ├── location/ # Geolocation services │ ├── cache/sync/ # Sincronização de cache
│ ├── products/[barcode]/ # Product lookup proxy │ ├── location/ # Serviços de geolocalização
│ └── search/ # Search proxy for Open Food Facts │ ├── products/[barcode]/ # Proxy de busca de produto
├── components/ # Feature-specific components │ ├── search/ # Proxy de busca Open Food Facts
│ ├── landing/ # Landing page sections │ └── storage-stats/ # Estatísticas de armazenamento
│ └── [various components] # Reusable feature components ├── components/ # Componentes específicos de funcionalidades
├── lista/[id]/ # Shopping list pages │ ├── landing/ # Seções da página inicial
├── produto/[barcode]/ # Product detail pages │ └── [componentes diversos] # Componentes reutilizáveis
├── resultados/ # Search results page ├── lista/[id]/ # Páginas de lista de compras
└── layout.tsx # Root layout ├── produto/[barcode]/ # Páginas de detalhes do produto
├── resultados/ # Página de resultados de busca
└── layout.tsx # Layout raiz
``` ```
### Component Organization ### Fluxo de Dados
- **UI Components** (`/components/ui/`): Reusable, styled components from shadcn/ui 1. **Requisições de Busca**: Entrada do usuário → Rota de API → API Open Food Facts → Resposta
- **Feature Components** (`/app/components/`): Business logic components 2. **Gerenciamento de Listas**: Ações do usuário → Server Actions → Prisma → Banco de dados
- **Layout Components**: Header, footer, and navigation components 3. **Atualizações em Tempo Real**: Server Actions → Banco de dados → Revalidação → Atualização da UI
### Data Flow ### Sistema de Cache
1. **Search Requests**: User input → API Route → Open Food Facts API → Response ```mermaid
2. **List Management**: User actions → Server Actions → Prisma → Database graph TD
3. **Real-time Updates**: Server Actions → Database → Revalidation → UI Update A[Usuário] --> B[Interface]
B --> C{Cache Local?}
C -->|Sim| D[Retornar Dados]
C -->|Não| E[API Route]
E --> F[Open Food Facts API]
F --> G[Salvar no Cache]
G --> D
```
## 🚦 Getting Started ## 🚦 Instalação e Setup
### Prerequisites ### Pré-requisitos
- **Node.js** 18.0 or higher - **Node.js** 18.0 ou superior
- **pnpm** 8.0 or higher (recommended package manager) - **pnpm** 8.0 ou superior (gerenciador de pacotes recomendado)
### Installation ### Instalação Passo a Passo
1. **Clone the repository** 1. **Clone o repositório**
```bash ```bash
git clone https://github.com/evandrodevbr/lista-compras.git git clone https://github.com/evandrodevbr/lista-compras.git
cd lista-compras cd lista-compras
``` ```
2. **Install dependencies** 2. **Instale as dependências**
```bash ```bash
pnpm install pnpm install
``` ```
3. **Set up environment variables** 3. **Configure as variáveis de ambiente**
```bash ```bash
cp .env.example .env.local cp .env.example .env.local
``` ```
Configure the following variables: Configure as seguintes variáveis:
```env ```env
DATABASE_URL="file:./prisma/db/database.sqlite" DATABASE_URL="file:./prisma/db/database.sqlite"
NEXT_PUBLIC_SITE_URL="http://localhost:3000" NEXT_PUBLIC_SITE_URL="http://localhost:3000"
``` ```
4. **Initialize the database** 4. **Inicialize o banco de dados**
```bash ```bash
pnpm db:generate pnpm db:generate
pnpm db:migrate pnpm db:migrate
``` ```
5. **Start the development server** 5. **Inicie o servidor de desenvolvimento**
```bash ```bash
pnpm dev pnpm dev
``` ```
6. **Open your browser** 6. **Abra seu navegador**
Navigate to [http://localhost:3000](http://localhost:3000) Navegue para [http://localhost:3000](http://localhost:3000)
## 📁 Project Structure ### Troubleshooting
``` **Problema**: Erro de conexão com banco de dados
nutriscan/
├── app/ # Next.js App Router
│ ├── actions.ts # Server Actions
│ ├── api/ # API Routes
│ │ ├── location/ # Geolocation API route
│ │ ├── products/[barcode]/ # Product lookup proxy
│ │ └── search/ # Search proxy for Open Food Facts
│ ├── components/ # Feature components
│ │ ├── landing/ # Landing page sections
│ │ │ ├── Features.tsx
│ │ │ ├── Hero.tsx
│ │ │ ├── HowItWorks.tsx
│ │ │ └── SearchBar.tsx
│ │ ├── pricing/ # Pricing page components
│ │ ├── card.tsx
│ │ ├── FilterSidebar.tsx
│ │ ├── ListaProductCard.tsx
│ │ ├── NutritionChart.tsx
│ │ └── [other components]
│ ├── lista/[id]/ # Shopping list pages
│ ├── produto/[barcode]/ # Product detail pages
│ ├── resultados/ # Search results page
│ ├── pricing/ # Pricing page
│ ├── layout.tsx # Root layout
│ ├── page.tsx # Home page
│ └── providers.tsx # Context providers
├── components/ # Reusable UI components
│ ├── ui/ # shadcn/ui components
│ │ ├── button.tsx
│ │ ├── card.tsx
│ │ ├── input.tsx
│ │ └── [other UI components]
│ └── theme-toggle.tsx
├── hooks/ # Custom React hooks
│ ├── useProductFilters.ts
│ └── useSearchCache.ts
├── lib/ # Utility libraries
│ ├── openFoodFactsApi.ts # Open Food Facts API wrapper
│ ├── cacheManager.ts # Search cache logic
│ ├── geolocation.ts # Location services
│ ├── prisma.ts # Prisma client
│ ├── types.ts # TypeScript definitions
│ └── utils.ts # Utility functions
├── prisma/ # Database configuration
│ ├── migrations/ # Database migrations
│ ├── db/ # SQLite database files
│ └── schema.prisma # Database schema
├── public/ # Static assets
│ └── manifest.json
├── docs/ # Documentation
│ └── openFoodFacts.md
├── package.json # Dependencies and scripts
├── tailwind.config.ts # Tailwind CSS configuration
├── tsconfig.json # TypeScript configuration
└── next.config.mjs # Next.js configuration
```
## 🔌 API Integration - **Solução**: Verifique se o arquivo `database.sqlite` existe em `prisma/db/`
### Open Food Facts Integration **Problema**: Erro de build do Prisma
NutriScan integrates with the Open Food Facts API through a custom wrapper (`lib/openFoodFactsApi.ts`) that provides: - **Solução**: Execute `pnpm db:generate` antes do build
- **Product Search**: Search products by name, brand, or category **Problema**: Dependências não instaladas
- **Barcode Lookup**: Direct product lookup using barcode numbers
- **Advanced Filtering**: Filter by nutrition grades, allergens, additives, and more
- **Caching**: Intelligent caching strategy for improved performance
- **Error Handling**: Comprehensive error handling and fallback mechanisms
### API Routes - **Solução**: Use `pnpm install --no-frozen-lockfile`
The application uses Next.js API routes as proxies to avoid CORS issues: ## 🔌 API e Integrações
- **`/api/search`**: Product search endpoint ### Integração Open Food Facts
- **`/api/products/[barcode]`**: Individual product lookup
- **`/api/location`**: Geolocation services for regional product data
### Caching Strategy O NutriScan integra com a API Open Food Facts através de um wrapper customizado (`lib/openFoodFactsApi.ts`) que fornece:
- **Search Results**: Cached for 1 hour to reduce API calls - **Busca de Produtos**: Pesquisa por nome, marca ou categoria
- **Product Details**: Cached for 24 hours for frequently accessed products - **Lookup por Código de Barras**: Busca direta usando códigos de barras
- **Filter Options**: Cached for 1 week for static data like categories and brands - **Filtros Avançados**: Filtros por notas nutricionais, alérgenos, aditivos e mais
- **Cache**: Estratégia de cache inteligente para melhor performance
- **Tratamento de Erros**: Tratamento abrangente de erros e mecanismos de fallback
### Endpoints Disponíveis
| Endpoint | Descrição | Método |
| ------------------------- | ----------------------------- | ------ |
| `/api/search` | Busca de produtos | GET |
| `/api/products/[barcode]` | Busca de produto específico | GET |
| `/api/location` | Serviços de geolocalização | GET |
| `/api/cache/sync` | Sincronização de cache | POST |
| `/api/storage-stats` | Estatísticas de armazenamento | GET |
### Rate Limits e Cache
- **Resultados de Busca**: Cache de 1 hora para reduzir chamadas à API
- **Detalhes de Produto**: Cache de 24 horas para produtos frequentemente acessados
- **Opções de Filtro**: Cache de 1 semana para dados estáticos como categorias e marcas
## 🗄 Database Schema ## 🗄 Database Schema
The application uses a simple but effective database schema: ### Schema Prisma
```prisma ```prisma
model Lista { model Lista {
@@ -313,112 +332,208 @@ model Produtos {
} }
``` ```
### Key Features ### Características Principais
- **Simple Structure**: Easy to understand and maintain - **Estrutura Simples**: Fácil de entender e manter
- **Flexible Lists**: Support for multiple shopping lists - **Listas Flexíveis**: Suporte para múltiplas listas de compras
- **Product Tracking**: Quantity and unit management - **Rastreamento de Produtos**: Gerenciamento de quantidade e unidade
- **Status Tracking**: Purchase status for each item - **Rastreamento de Status**: Status de compra para cada item
- **Timestamps**: Automatic creation and update tracking - **Timestamps**: Rastreamento automático de criação e atualização
## 📜 Available Scripts ## ⚡ Performance e Otimizações
```bash ### Estratégia de Cache Multi-Camada
# Development
pnpm dev # Start development server
pnpm build # Build for production
pnpm start # Start production server
pnpm lint # Run ESLint
# Database 1. **Cache de Busca**: Armazenamento local de resultados de busca
pnpm db:push # Push Prisma schema to database 2. **Cache de Produtos**: Cache JSON de produtos populares
pnpm db:generate # Generate Prisma Client 3. **Cache de Imagens**: Lazy loading e otimização automática
pnpm db:migrate # Run database migrations 4. **Cache de API**: Cache de respostas da API Open Food Facts
# Post-install ### Otimizações de Performance
pnpm postinstall # Generate Prisma Client after install
- **Lazy Loading**: Carregamento sob demanda de imagens e componentes
- **Code Splitting**: Divisão automática de código por rota
- **Otimização de Bundle**: Minificação e tree-shaking automáticos
- **Server Actions**: Atualizações de dados sem recarregamento de página
- **Image Optimization**: Otimização automática de imagens com Next.js
### Métricas de Performance
- **First Load JS**: ~87.3 kB compartilhado
- **Build Time**: Otimizado com Prisma e Next.js
- **Cache Hit Rate**: Monitorado via storage stats API
## 🚀 Deployment
### Configuração Dokploy
O projeto inclui configuração para deployment via Dokploy (`dokploy.yaml`):
```yaml
build:
pre_build:
- npm install -g pnpm@latest
- export PNPM_HOME="/root/.local/share/pnpm"
- export PATH="$PNPM_HOME:$PATH"
steps:
- name: Verify pnpm
run: which pnpm && pnpm --version
- name: Install dependencies
run: pnpm install --no-frozen-lockfile
- name: Generate Prisma Client
run: pnpx prisma generate
- name: Build application
run: pnpm run build
``` ```
## 🤝 Contributing ### Configuração Nixpacks
We welcome contributions from the community! Here's how you can help: Configuração alternativa para deployment (`nixpacks.toml`):
### For Developers ```toml
[phases.setup]
nixPkgs = ['nodejs_18', 'openssl']
cmds = [
'npm install -g pnpm@latest',
'npm install -g prisma'
]
1. **Fork the repository** [phases.install]
2. **Create a feature branch** cmds = [
'npx pnpm install --no-frozen-lockfile',
'mkdir -p prisma',
'touch prisma/dev.db',
'chmod -R 777 prisma'
]
[phases.build]
cmds = [
'mkdir -p node_modules/.prisma',
'mkdir -p .next',
'chmod -R 777 node_modules/.prisma node_modules/.bin .next prisma',
'npx prisma generate',
'npx prisma db push --accept-data-loss',
'npx pnpm run build'
]
[start]
cmd = 'npx pnpm start'
```
### Checklist de Deployment
- [ ] Configurar variáveis de ambiente
- [ ] Executar migrações do banco de dados
- [ ] Gerar Prisma Client
- [ ] Build da aplicação
- [ ] Configurar domínio e SSL
- [ ] Testar funcionalidades principais
## 📜 Scripts Disponíveis
### Desenvolvimento
```bash
pnpm dev # Inicia servidor de desenvolvimento (http://localhost:3000)
pnpm build # Build para produção
pnpm start # Inicia servidor de produção
pnpm lint # Executa ESLint
```
### Banco de Dados
```bash
pnpm db:push # Push do schema Prisma para o banco
pnpm db:generate # Gera Prisma Client
pnpm db:migrate # Executa migrações do banco
```
### Pós-instalação
```bash
pnpm postinstall # Gera Prisma Client após instalação
```
## 🤝 Contribuindo
Agradecemos contribuições da comunidade! Aqui está como você pode ajudar:
### Para Desenvolvedores
1. **Fork o repositório**
2. **Crie uma branch de feature**
```bash ```bash
git checkout -b feature/amazing-feature git checkout -b feature/amazing-feature
``` ```
3. **Make your changes** 3. **Faça suas alterações**
4. **Commit your changes** 4. **Commit suas alterações**
```bash ```bash
git commit -m 'Add: amazing feature' git commit -m 'Add: amazing feature'
``` ```
5. **Push to the branch** 5. **Push para a branch**
```bash ```bash
git push origin feature/amazing-feature git push origin feature/amazing-feature
``` ```
6. **Open a Pull Request** 6. **Abra um Pull Request**
### For End Users ### Para Usuários Finais
- **Report Bugs**: Use the [GitHub Issues](https://github.com/evandrodevbr/lista-compras/issues) to report bugs - **Reportar Bugs**: Use [GitHub Issues](https://github.com/evandrodevbr/lista-compras/issues)
- **Request Features**: Suggest new features through [GitHub Issues](https://github.com/evandrodevbr/lista-compras/issues) - **Solicitar Features**: Sugira novas funcionalidades via [GitHub Issues](https://github.com/evandrodevbr/lista-compras/issues)
- **Provide Feedback**: Share your experience and suggestions - **Fornecer Feedback**: Compartilhe sua experiência e sugestões
### Development Guidelines ### Guidelines de Desenvolvimento
- Follow the existing code style and patterns - Siga o estilo de código existente
- Write clear commit messages - Escreva mensagens de commit claras
- Add tests for new features - Adicione testes para novas funcionalidades
- Update documentation as needed - Atualize documentação quando necessário
- Ensure all checks pass before submitting PR - Certifique-se de que todos os checks passem antes de submeter PR
## 📄 License ## 📄 Licença
This project is licensed under a **Personal Use License**. Este projeto está licenciado sob uma **Licença de Uso Pessoal**.
**Permissions:** ### Permissões
- ✅ Personal use on localhost - ✅ Uso pessoal em localhost
- ✅ Code inspection and learning - ✅ Inspeção de código e aprendizado
- ✅ Local development and testing - ✅ Desenvolvimento e teste local
**Restrictions:** ### Restrições
- ❌ Public web deployment - ❌ Deploy público na web
- ❌ Commercial use - ❌ Uso comercial
- ❌ Redistribution to third parties - ❌ Redistribuição para terceiros
- ❌ Creating derivative works for public distribution - ❌ Criação de obras derivadas para distribuição pública
For the complete license terms, see the [LICENSE](LICENSE) file. Para os termos completos da licença, consulte o arquivo [LICENSE](LICENSE).
## 📫 Contact ## 📫 Contato
**Author:** Evandro **Autor:** Evandro
**Website:** [evandro.dev.br](https://evandro.dev.br) **Website:** [evandro.dev.br](https://evandro.dev.br)
**GitHub:** [@evandrodevbr](https://github.com/evandrodevbr) **GitHub:** [@evandrodevbr](https://github.com/evandrodevbr)
**Email:** evandro@evandro.dev.br **Email:** evandro@evandro.dev.br
**Project Links:** ### Links do Projeto
- **Live Demo:** [nutriscan.evandro.dev.br](https://nutriscan.evandro.dev.br) - **Live Demo:** [nutriscan.evandro.dev.br](https://nutriscan.evandro.dev.br)
- **Repository:** [github.com/evandrodevbr/lista-compras](https://github.com/evandrodevbr/lista-compras) - **Repositório:** [github.com/evandrodevbr/lista-compras](https://github.com/evandrodevbr/lista-compras)
- **Issues:** [GitHub Issues](https://github.com/evandrodevbr/lista-compras/issues) - **Issues:** [GitHub Issues](https://github.com/evandrodevbr/lista-compras/issues)
## 🙏 Acknowledgments ## 🙏 Agradecimentos
- **[Open Food Facts](https://world.openfoodfacts.org/)** - For providing the comprehensive food database - **[Open Food Facts](https://world.openfoodfacts.org/)** - Pela base de dados abrangente de alimentos
- **[shadcn/ui](https://ui.shadcn.com/)** - For the beautiful, accessible component library - **[shadcn/ui](https://ui.shadcn.com/)** - Pela biblioteca de componentes acessíveis
- **[Next.js Team](https://nextjs.org/)** - For the amazing React framework - **[Next.js Team](https://nextjs.org/)** - Pelo framework React incrível
- **[Vercel](https://vercel.com/)** - For hosting and deployment solutions - **[Vercel](https://vercel.com/)** - Por soluções de hosting e deployment
- **[Prisma](https://www.prisma.io/)** - For the excellent database ORM - **[Prisma](https://www.prisma.io/)** - Pelo excelente ORM
- **Contributors** - Thank you to all contributors who help improve this project - **Contribuidores** - Obrigado a todos que ajudam a melhorar este projeto
--- ---
<div align="center"> <div align="center">
<p>Developed with ❤️ by <a href="https://evandro.dev.br">evandro.dev.br</a></p> <p>Desenvolvido com ❤️ por <a href="https://evandro.dev.br">evandro.dev.br</a></p>
<p>Made for health-conscious users and developers worldwide</p> <p>Feito para usuários conscientes com a saúde e desenvolvedores ao redor do mundo</p>
</div> </div>
+6 -4
View File
@@ -1,10 +1,10 @@
import { import {
ScanLine,
ExternalLink, ExternalLink,
Github, Github,
Heart, Heart,
Globe, Globe,
Shield, Shield,
ScanLine,
} from "lucide-react"; } from "lucide-react";
export function Footer() { export function Footer() {
@@ -15,9 +15,11 @@ export function Footer() {
{/* Brand */} {/* Brand */}
<div className="md:col-span-1"> <div className="md:col-span-1">
<div className="flex items-center gap-3 mb-6"> <div className="flex items-center gap-3 mb-6">
<div className="w-10 h-10 bg-gradient-to-r from-blue-600 to-green-600 rounded-xl flex items-center justify-center"> <img
<ScanLine className="w-6 h-6 text-white" /> src="/apple-touch-icon.png"
</div> alt="NutriScan Logo"
className="w-10 h-10 rounded-xl"
/>
<div> <div>
<h3 className="text-xl font-bold">NutriScan</h3> <h3 className="text-xl font-bold">NutriScan</h3>
<p className="text-sm text-gray-400"> <p className="text-sm text-gray-400">
+6 -4
View File
@@ -1,7 +1,7 @@
"use client"; "use client";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import { useTheme } from "next-themes"; import { useTheme } from "next-themes";
import { Sun, Moon, Menu, X, ScanLine } from "lucide-react"; import { Sun, Moon, Menu, X } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
export function Header() { export function Header() {
@@ -27,9 +27,11 @@ export function Header() {
<div className="flex items-center justify-between h-14 sm:h-16"> <div className="flex items-center justify-between h-14 sm:h-16">
{/* Logo - compacto em mobile */} {/* Logo - compacto em mobile */}
<div className="flex items-center gap-2 sm:gap-3"> <div className="flex items-center gap-2 sm:gap-3">
<div className="w-8 h-8 sm:w-10 sm:h-10 bg-gradient-to-r from-blue-600 to-green-600 rounded-xl flex items-center justify-center"> <img
<ScanLine className="w-5 h-5 sm:w-6 sm:h-6 text-white" /> src="/apple-touch-icon.png"
</div> alt="NutriScan Logo"
className="w-8 h-8 sm:w-10 sm:h-10 rounded-xl"
/>
<div className="hidden sm:block"> <div className="hidden sm:block">
<h1 className="text-xl font-bold text-gray-900 dark:text-white"> <h1 className="text-xl font-bold text-gray-900 dark:text-white">
NutriScan NutriScan
BIN
View File
Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 321 KiB

+16
View File
@@ -25,6 +25,13 @@ export const metadata: Metadata = {
], ],
authors: [{ name: "Evandro", url: "https://evandro.dev.br" }], authors: [{ name: "Evandro", url: "https://evandro.dev.br" }],
creator: "Evandro", creator: "Evandro",
icons: {
icon: [
{ url: "/favicon.ico", sizes: "any" },
{ url: "/icon.png", sizes: "512x512", type: "image/png" },
],
apple: [{ url: "/icon.png", sizes: "512x512", type: "image/png" }],
},
openGraph: { openGraph: {
type: "website", type: "website",
locale: "pt_BR", locale: "pt_BR",
@@ -33,6 +40,14 @@ export const metadata: Metadata = {
description: description:
"Descubra informações nutricionais completas de milhares de produtos alimentícios.", "Descubra informações nutricionais completas de milhares de produtos alimentícios.",
siteName: "NutriScan", siteName: "NutriScan",
images: [
{
url: "/icon.png",
width: 512,
height: 512,
alt: "NutriScan Logo",
},
],
}, },
twitter: { twitter: {
card: "summary_large_image", card: "summary_large_image",
@@ -40,6 +55,7 @@ export const metadata: Metadata = {
description: description:
"Descubra informações nutricionais completas de milhares de produtos alimentícios.", "Descubra informações nutricionais completas de milhares de produtos alimentícios.",
creator: "@evandrodev", creator: "@evandrodev",
images: ["/icon.png"],
}, },
manifest: "/manifest.json", manifest: "/manifest.json",
robots: { robots: {
+6 -6
View File
@@ -1,12 +1,12 @@
import { MetadataRoute } from 'next' import { MetadataRoute } from "next";
export default function robots(): MetadataRoute.Robots { export default function robots(): MetadataRoute.Robots {
return { return {
rules: { rules: {
userAgent: '*', userAgent: "*",
allow: '/', allow: "/",
disallow: '/private/', disallow: "/private/",
}, },
sitemap: 'https://resenhaitapoa.com.br/sitemap.xml', sitemap: "https://nutriscan.evandro.dev.br/sitemap.xml",
} };
} }
+5 -5
View File
@@ -1,12 +1,12 @@
import { MetadataRoute } from 'next' import { MetadataRoute } from "next";
export default function sitemap(): MetadataRoute.Sitemap { export default function sitemap(): MetadataRoute.Sitemap {
return [ return [
{ {
url: 'https://resenhaitapoa.com.br', url: "https://nutriscan.evandro.dev.br",
lastModified: new Date(), lastModified: new Date(),
changeFrequency: 'daily', changeFrequency: "daily",
priority: 1, priority: 1,
} },
] ];
} }
+259 -259
View File
File diff suppressed because it is too large. Load diff
Binary file not shown.

After

Width:  |  Height:  |  Size: 321 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 321 KiB

+6
View File
@@ -13,6 +13,12 @@
"src": "/favicon.ico", "src": "/favicon.ico",
"sizes": "any", "sizes": "any",
"type": "image/x-icon" "type": "image/x-icon"
},
{
"src": "/icon.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "any maskable"
} }
] ]
} }