Portalweb

O código-fonte deste software é confidencial e não será fornecido.
É estritamente proibido realizar engenharia reversa, descompilar ou desmontar o software.
É proibido copiar, redistribuir ou sublicenciar este software sem autorização por escrito.
A violação destes termos poderá resultar em responsabilização civil e criminal.



## Project Structure

src/
├── app/                    # Diretório de app do Next.js 13+ (roteamento)
├── components/            # Componentes React
│   ├── ui/               # Componentes de UI reutilizáveis
│   ├── layout/           # Componentes de layout
│   └── features/         # Componentes específicos de funcionalidades
├── hooks/                # Hooks personalizados do React
│   ├── useNavigation.ts  # Hook para abstrair navegação da aplicação
│   └── ...               # Outros hooks personalizados
├── utils/                # Funções utilitárias
├── types/                # Tipos e interfaces TypeScript
├── styles/               # Estilos globais e configuração de tema
├── lib/                  # Configurações de bibliotecas de terceiros
├── constants/            # Constantes da aplicação
└── public/               # Arquivos estáticos


## Directory Details

### `/src/app`
Contém a estrutura de diretório app do Next.js 13+

Responsável pelo roteamento e componentes de página

Inclui layout.tsx para layouts compartilhados

Inclui page.tsx para a página inicial

### `/src/components`
- **ui/**: Componentes de UI reutilizáveis (ex: Botão, Input, Card)
- **layout/**: Componentes de layout (ex: Cabeçalho, Rodapé, Barra Lateral)
- **features/**: Componentes específicos de funcionalidades, que podem não ser reutilizáveis

### `/src/hooks`
- Hooks personalizados do React para lógica compartilhada
- Exemplo: useTheme para gerenciamento de tema
- **useNavigation**: Abstrai a lógica de navegação comum, fornecendo métodos como:
  - `goToHome()`: Navega para a página inicial
  - `goToLogin()`: Navega para a página de login
  - `goToOrdersFind()`: Navega para a busca de pedidos
  - `goToOrderDetail(id)`: Navega para o detalhe de um pedido
  - `goBack()`: Volta para a página anterior
  - `navigateTo(url)`: Navega para uma URL específica

### `/src/utils`
-Funções utilitárias para operações comuns
-Exemplo: format.ts para formatação de datas e moedas


### `/src/types`
- Interfaces e tipos TypeScript

- Tipos comuns usados em toda a aplicação

### `/src/constants`
- Constantes globais da aplicação
- Rotas, breakpoints e outros valores estáticos

### `/src/styles`
- Estilos globais e configuração de tema

- Configuração do Tailwind CSS (se estiver sendo utilizado)

### `/src/lib`
- Configurações de bibliotecas de terceiros

- Clientes de API e outras integrações externas

### `/public`
Arquivos estáticos (imagens, fontes, etc.)

Favicon e outros arquivos públicos

### Componentes
Mantenha os componentes pequenos e com uma única responsabilidade

Use TypeScript para segurança de tipos

Siga o padrão de design atômico quando apropriado

Defina corretamente os tipos de props e valores padrão

### Hooks
Crie hooks personalizados para lógica reutilizável

Mantenha os hooks focados em uma funcionalidade específica

Tipifique corretamente os parâmetros e retornos com TypeScript

### Styling
Use Tailwind CSS para estilização

Siga uma convenção de nomes consistente

Mantenha os estilos modulares e reutilizáveis

### TypeScript
Utilize uma configuração estrita de TypeScript

Defina interfaces apropriadas para todos os componentes e funções

Use inferência de tipos sempre que possível

### Code Organization
Mantenha arquivos relacionados próximos uns dos outros

Use arquivos index.ts para importações mais limpas

Siga o princípio do menor privilégio

## Getting Started

1. Install dependencies:
```bash
npm install
```

2. Run the development server:
```bash
npm run dev
```

3. Build for production:
```bash
npm run build
```

## Development Guidelines

1. ### Criação de Componentes

Crie os componentes no diretório apropriado

Use TypeScript para segurança de tipos

Adicione documentação apropriada

2. ### Gerenciamento de Estado

Use hooks do React para estado local

Considere contextos para estado global

Mantenha o estado o mais próximo possível de onde é usado

3. ### Estilização

Use classes do Tailwind CSS

Mantenha os estilos consistentes entre os componentes

Use variáveis CSS para valores de tema