Bazari – Super App Web3

🚀 Quick Start

# Clonar o repositório
git clone https://github.com/MonteiroKleber/bazari-super-app.git
cd bazari-super-app

# Instalar dependências
npm install

# Configurar variáveis de ambiente
cp .env.example .env

# Iniciar desenvolvimento
npm run dev

# Build para produção
npm run build

📋 Scripts Disponíveis

npm run dev — Servidor de desenvolvimento (http://localhost:3000)
npm run build — Build de produção otimizado
npm run test — Testes com Vitest
npm run test:coverage — Coverage detalhado
npm run lint / npm run lint:fix — ESLint + correções
npm run format — Prettier
npm run prepare — Hooks Git com Husky

🛠 Stack Tecnológica

Frontend Core

React 18 + TypeScript
Vite (HMR)
TailwindCSS
Framer Motion
React Router v6

Web3 & Blockchain

Polkadot.js API — Substrate
IPFS — armazenamento descentralizado
BazariChain — blockchain custom (Substrate)
Zustand — estado Web3

Desenvolvimento & Qualidade

Vitest, ESLint + Prettier, Husky + lint-staged, TS strict

PWA & Performance

Service Worker, Manifest, Lazy Loading

📐 Arquitetura

Seguimos o padrão Feature-Sliced Design para escalabilidade:

src/
├── app/           # 🏗️ Configuração da aplicação
│   ├── providers/ # Provedores globais (theme, i18n, auth)
│   ├── router/    # Configuração de rotas
│   └── i18n/      # Sistema de internacionalização
├── pages/         # 📄 Páginas e rotas principais
├── features/      # 🎯 Funcionalidades de negócio
│   ├── auth/      # Autenticação Web3
│   ├── marketplace/ # Marketplace descentralizado
│   ├── wallet/    # Carteira nativa
│   ├── social/    # Rede social
│   ├── dao/       # Governança descentralizada
│   └── trabalho/  # Protocolo de trabalho
├── shared/        # 🔧 Código compartilhado
│   ├── ui/        # Componentes de interface
│   ├── lib/       # Utilitários e helpers
│   ├── hooks/     # React hooks customizados
│   └── types/     # Tipos TypeScript globais
├── entities/      # 📊 Modelos de dados de negócio
└── services/      # 🌐 APIs e integrações externas

🌍 Sistema de Internacionalização

Multi-idioma com detecção automática: 🇧🇷 Português (padrão), 🇺🇸 English (US), 🇪🇸 Español.

// Uso básico
const { t, changeLanguage } = useTranslation()
const text = t('common', 'loading')
changeLanguage('en')

🎨 Design System Bazari

Paleta de Cores Oficial

--primary-900: #8B0000   /* Resistência e povo */
--primary-700: #A52A2A   /* Variação principal */
--secondary-400: #FFB300 /* Riqueza e esperança */
--dark-900: #1C1C1C      /* Descentralização */
--light-100: #F5F1E0     /* Simplicidade */

Sistema Tipográfico

Poppins (títulos) + Inter (texto), pesos 300–700.

Componentes Implementados

Button, Input, Select, Textarea, Card, Badge, Loading, Modal, Tooltip, Progress, Icon System

Responsividade mobile-first, acessibilidade ARIA e animações com Framer Motion.

📱 Progressive Web App (PWA)

Instalação nativa iOS/Android
Offline básico com cache inteligente
Service Worker (Workbox) + Manifest
Push notifications (preparado)

🧪 Testes e Qualidade

# Executar testes
yarn test
# Coverage detalhado (meta >70%)
yarn test:coverage
# Lint & format
yarn lint && yarn format

Configuração: Vitest, Testing Library, jsdom, coverage ≥ 70%.

🔒 Segurança Web3

Autenticação (ETAPA 3 - PRÓXIMA)

Chaves privadas criptografadas localmente
Seed phrase com confirmação
Guards de rota e persistência segura

Carteira (ETAPA 6)

Polkadot.js, gestão de saldos BZR/tokens, assinatura de transações, histórico

🗺️ Cronograma de Desenvolvimento

Desenvolvimento incremental em 9 etapas.

Etapa	Foco Principal	Dependências	Progresso	Status
1	Infraestrutura base	—	100%	✅ COMPLETA
2	Design System	1	100%	✅ COMPLETA
3	Autenticação	1–2	0%	🎯 PRÓXIMA
4	Perfil básico	1–3	0%	⏸️ Aguardando
5	Marketplace	1–4	0%	⏸️ Aguardando
6	Wallet Web3	1–5	0%	⏸️ Aguardando
7	Social features	1–6	0%	⏸️ Aguardando
8	DAO & DEX	1–7	0%	⏸️ Aguardando
9	Trabalho & Final	Todas	0%	⏸️ Aguardando

Progresso Total: 22.2% (2/9 etapas)

🎯 Próximo Passo: ETAPA 3 — Autenticação

# Objetivos
- Login com senha segura
- Criar nova conta / Importar via seed phrase
- Recuperação de conta
- Criptografia local de chaves (AES‑256)
- Persistência segura com TTL
- Guards de rota
- Telas usando Design System + testes

🎨 Demonstração do Design System

npm run dev
# Acesse: http://localhost:3000/components-demo

Inclui: 11 componentes, responsividade, acessibilidade, dark mode e animações.

🤝 Contribuição

Fork o projeto
Crie uma branch: git checkout -b feature/nova-funcionalidade
Commit: git commit -m 'feat: adicionar nova funcionalidade'
Push: git push origin feature/nova-funcionalidade
Abra um Pull Request

Padrão de commits: Conventional Commits.

📄 Licença

MIT License — veja o arquivo LICENSE para detalhes.

📞 Suporte e Comunidade

Email: contato@bazari.com.br
Discord: Comunidade Bazari
Twitter: @BazariApp
Documentação: docs.bazari.com.br
Issues: GitHub Issues