Skip to main content
Pré-requisitos:
  • Node.js v20 ou superior
  • npm v10+ (ou pnpm v9+)
  • Acesso à API backend rodando (local ou remota)

1. Clonar o repositório

git clone <url-do-repositorio>
cd hub-marketplace

2. Instalar dependências

npm install

3. Configurar variáveis de ambiente

Copie o arquivo de exemplo e preencha os valores:
cp .env.example .env.local
Edite .env.local:
# URL da API backend — obrigatória
NEXT_PUBLIC_API_URL=http://localhost:3000/api

# Nome da aplicação (opcional)
NEXT_PUBLIC_APP_NAME=Hub Marketplace
O prefixo NEXT_PUBLIC_ é obrigatório para que a variável seja acessível no browser. Variáveis sem esse prefixo só ficam disponíveis no servidor.

4. Rodar em desenvolvimento

npm run dev
Acesse em http://localhost:3001 (ou a porta disponível).
O backend por padrão sobe na porta 3000. O Next.js tentará a porta 3000 e, se ocupada, usará 3001 automaticamente.

5. Outros comandos

ComandoO que faz
npm run devServidor de desenvolvimento com hot reload
npm run buildBuild de produção
npm run startServe o build de produção localmente
npm run lintExecuta ESLint no projeto

Verificar se está funcionando

  1. Abra http://localhost:3001
  2. Você deve ser redirecionado para /login
  3. Faça login com as credenciais do backend
  4. O dashboard deve carregar sem erros no console

Estrutura de rotas

RotaTipoDescrição
/loginPúblicaTela de autenticação
/dashboardProtegidaPainel principal
/productsProtegidaCatálogo de produtos
/inventoryProtegidaControle de estoque
/ordersProtegidaGestão de pedidos
/listingsProtegidaAnúncios dos marketplaces
/integrationsProtegidaConexões com marketplaces
/importsProtegidaImportação de NF-e
Rotas protegidas redirecionam automaticamente para /login caso o usuário não esteja autenticado.

Dependências principais

PacoteVersãoUso
next16.0.7Framework principal
react19.2.0Biblioteca de UI
typescript^5Tipagem estática
tailwindcss^4.1Estilização utilitária
@tanstack/react-query^5Cache e fetching de dados
zustand^5Estado global
axios^1.13HTTP client
react-hook-form^7Gerenciamento de formulários
zod^4Validação de schemas
@radix-ui/*variadoComponentes UI acessíveis
framer-motion^12Animações
recharts^3Gráficos
sonner^2Toast notifications
lucide-react^0.554Ícones

Troubleshooting

A variável NEXT_PUBLIC_API_URL está incorreta ou o backend não está rodando. Verifique se o backend está acessível na URL configurada.
O cookie de refreshToken não está sendo enviado. Verifique se o backend está configurado com CORS permitindo credentials: true para a origem do frontend.
O Next.js usa automaticamente a próxima porta disponível (ex: 3001). Verifique o terminal — a URL correta é exibida na inicialização. Alternativamente, configure NEXT_PUBLIC_API_URL para apontar para a porta correta do backend.
Limpe o cache do Next.js e reinicie:
rm -rf .next
npm run dev