From 53f64dd15ff03637ad3b188899b8af235532cf48 Mon Sep 17 00:00:00 2001 From: Artur Oliveira Date: Tue, 16 Dec 2025 10:50:14 -0300 Subject: [PATCH] =?UTF-8?q?chore(docs):=20alinhar=20integra=C3=A7=C3=A3o?= =?UTF-8?q?=20front/backend=20e=20CORS?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 60 ++++++++++--------- backend/README.md | 41 +++++++++++++ frontned/README.md | 99 ++++++++++---------------------- frontned/src/App.tsx | 3 +- frontned/src/pages/Dashboard.tsx | 3 + 5 files changed, 106 insertions(+), 100 deletions(-) create mode 100644 backend/README.md create mode 100644 frontned/src/pages/Dashboard.tsx diff --git a/README.md b/README.md index 83e66aa..78c9062 100644 --- a/README.md +++ b/README.md @@ -1,38 +1,36 @@ -# Hit Server Manager +# Servers Manager -Plataforma interna da Hit Communications para catalogar os servidores corporativos e expor essas informações de forma rápida ao time de Análise de Sistemas e Desenvolvimento. O backend centraliza cadastros, contexto técnico (tipo, aplicação e banco) e credenciais operacionais, facilitando consultas padronizadas e mantendo histórico de alterações. +Plataforma interna para catalogar servidores corporativos e facilitar consultas rápidas pelo time de desenvolvimento/analistas. Inclui backend em Spring Boot (JWT + refresh token em cookies) e frontend React/Vite consumindo os endpoints. -## Principais recursos -- CRUD completo de usuários internos e servidores -- Validação de domínio corporativo para criação de usuários -- Mapeamentos DTO ↔ entidades com MapStruct -- API REST documentada via coleção Postman (`postman_collection.json`) -- Persistência em H2 (memória/disco) com Spring Data JPA e geração automática de IDs personalizados para servidores +## Estrutura +- `backend/`: API em Spring Boot 4 (Java 21), JWT stateless, cookies para auth. +- `frontned/`: Front em React + Vite (TS), login integrado via cookies. +- `postman_collection.json`: Coleção para testar autenticação e CRUDs de usuários/servidores. -## Stack -- Java 21 + Spring Boot 4.0 -- Spring Web MVC, Validation, Data JPA -- H2 Database -- MapStruct 1.6 -- Lombok -- Spring Security (JWT em breve) -- Docker Compose para orquestração local -- ReactJS +## Requisitos +- JDK 21 +- Node 20+ (Yarn ou npm) -## Como rodar -1. **Pré-requisitos**: JDK 21 e acesso ao Gradle Wrapper (`./gradlew`). -2. **Instalar dependências e rodar testes**: - ```bash - ./gradlew clean test - ``` -3. **Subir o backend**: +## Rodando local +1. **Backend** ```bash + cd backend ./gradlew bootRun - ``` -4. A API ficará disponível em `http://localhost:8080`. Utilize a coleção Postman incluída para exercitar os endpoints de `Users` e `Servers` (`{{base_url}}` já configurado com esse endereço). + ``` + Variáveis úteis: `JWT_SECRET` (>=32 chars), `DB_*` (Postgres). Por padrão usa `localhost:8080`. -## Próximos passos -- [ ] Substituir H2 por PostgreSQL para persistência -- [ ] Proteger os endpoints com autenticação (Spring Security com JWT) -- [ ] Criar o frontend React integrado ao backend -- [ ] Containerizar backend + frontend com Docker Compose +2. **Frontend** + ```bash + cd frontned + cp .env.example .env # ajuste VITE_BACKEND_URL se necessário + yarn install # ou npm install + yarn dev # ou npm run dev + ``` + Acesse `http://localhost:5173`. + +3. **Testar via Postman** + Importe `postman_collection.json`. Rode "Auth / Login" para setar cookies e seguir para os demais endpoints. + +## Documentação específica +- Backend: `backend/README.md` +- Frontend: `frontned/README.md` diff --git a/backend/README.md b/backend/README.md new file mode 100644 index 0000000..53255c3 --- /dev/null +++ b/backend/README.md @@ -0,0 +1,41 @@ +# Backend - Servers Manager + +API REST em Spring Boot 4 (Java 21) com autenticação JWT stateless e refresh token em cookie HttpOnly. + +## Stack +- Spring Boot 4.0 (Web MVC, Validation, Data JPA) +- Spring Security (JWT, stateless) +- MapStruct 1.6, Lombok +- PostgreSQL (padrão) ou H2 +- JJWT 0.12 para geração/validação de tokens + +## Configuração +Variáveis principais: +- `DB_HOST`, `DB_PORT`, `DB_NAME`, `DB_USER`, `DB_PASSWD` — Postgres +- `JWT_SECRET` — chave HMAC >= 32 chars +- `security.jwt.access-token-expiration` — padrão 30m +- `security.jwt.refresh-token-expiration` — padrão 30d + +Arquivo `src/main/resources/application.yaml` já traz defaults; adicione um `.env` ou exporte variáveis conforme o ambiente. + +Seed: `src/main/resources/data.sql` cria usuário padrão `default@hittelco.com` (senha `senha123`, bcrypt). + +## Endpoints chave +- `POST /api/auth/login` — autentica e devolve `access_token` (cookie) + `refresh_token` (HttpOnly). +- `POST /api/auth/refresh` — reemite cookies a partir do refresh. +- `POST /api/auth/signup` — cria usuário (requer auth). +- CRUD `/api/users` e `/api/servers` protegidos. + +## Rodar local +```bash +./gradlew bootRun +``` +API em `http://localhost:8080` com CORS liberado para `http://localhost:5173`. + +## Testes +```bash +./gradlew test +``` + +## Postman +Use `postman_collection.json` na raiz; o login grava cookies e variáveis `access_token`/`refresh_token`. diff --git a/frontned/README.md b/frontned/README.md index d2e7761..957d94c 100644 --- a/frontned/README.md +++ b/frontned/README.md @@ -1,73 +1,36 @@ -# React + TypeScript + Vite +# Frontend - Servers Manager -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. +## Stack +- React 19, React Router 7 +- Axios (withCredentials) +- Tailwind (config in `tailwind.config.js`) +- react-hot-toast para feedback -Currently, two official plugins are available: - -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh - -## React Compiler - -The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation). - -## Expanding the ESLint configuration - -If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules: - -```js -export default defineConfig([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... - - // Remove tseslint.configs.recommended and replace with this - tseslint.configs.recommendedTypeChecked, - // Alternatively, use this for stricter rules - tseslint.configs.strictTypeChecked, - // Optionally, add this for stylistic rules - tseslint.configs.stylisticTypeChecked, - - // Other configs... - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) +## Configuração +Crie `.env` a partir de `.env.example`: +``` +VITE_BACKEND_URL=http://localhost:8080 ``` -You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules: - -```js -// eslint.config.js -import reactX from 'eslint-plugin-react-x' -import reactDom from 'eslint-plugin-react-dom' - -export default defineConfig([ - globalIgnores(['dist']), - { - files: ['**/*.{ts,tsx}'], - extends: [ - // Other configs... - // Enable lint rules for React - reactX.configs['recommended-typescript'], - // Enable lint rules for React DOM - reactDom.configs.recommended, - ], - languageOptions: { - parserOptions: { - project: ['./tsconfig.node.json', './tsconfig.app.json'], - tsconfigRootDir: import.meta.dirname, - }, - // other options... - }, - }, -]) +## Rodar +```bash +yarn install # ou npm install +yarn dev # ou npm run dev +``` +Acesse `http://localhost:5173`. + +## Fluxo de login +- Página `/login` envia `POST /api/auth/login` com email/senha. +- Tokens vêm em cookies (`access_token` e `refresh_token` HttpOnly). Axios usa `withCredentials`. +- Após sucesso, redireciona para `/` (ajuste rota/dashboard conforme evoluir). + +## Estrutura +- `src/Api.ts`: cliente axios com `withCredentials`. +- `src/pages/Login.tsx`: tela de login e toasts. +- `src/components/Layout.tsx`: layout base. + +## Build/Lint +```bash +yarn build +yarn lint ``` diff --git a/frontned/src/App.tsx b/frontned/src/App.tsx index 5ce1eab..f1e22f8 100644 --- a/frontned/src/App.tsx +++ b/frontned/src/App.tsx @@ -1,13 +1,14 @@ import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom'; import './App.css'; import { Login } from './pages/Login'; +import { Dashboard } from './pages/Dashboard'; function App() { return ( - } /> + } /> } /> diff --git a/frontned/src/pages/Dashboard.tsx b/frontned/src/pages/Dashboard.tsx new file mode 100644 index 0000000..ce5c9e0 --- /dev/null +++ b/frontned/src/pages/Dashboard.tsx @@ -0,0 +1,3 @@ +export const Dashboard = () => { + return
Dashboard Page
; +}; \ No newline at end of file