https://github.com/cleytonw/sgp-js
Front-end de um sistema de gerenciamento de projetos
https://github.com/cleytonw/sgp-js
axios-react bootstrap date-fns javascript react-router-dom reactjs
Last synced: about 2 months ago
JSON representation
Front-end de um sistema de gerenciamento de projetos
- Host: GitHub
- URL: https://github.com/cleytonw/sgp-js
- Owner: CleytonW
- Created: 2025-07-30T22:12:04.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-08-12T16:42:26.000Z (11 months ago)
- Last Synced: 2025-09-07T14:19:32.975Z (10 months ago)
- Topics: axios-react, bootstrap, date-fns, javascript, react-router-dom, reactjs
- Language: JavaScript
- Homepage: https://sgp-js-cleytonw.netlify.app/
- Size: 3.98 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# SGP-JS (Front-end)
Interface web do **Sistema de Gerenciamento de Projetos (SGP)**, desenvolvida em **React** e integrada a um back-end em **Java/Spring Boot**.
O objetivo é entregar uma aplicação moderna, responsiva e escalável, com boas práticas de desenvolvimento e tecnologias amplamente utilizadas no mercado.
> O back-end deste projeto está disponível em: [SGP-API (Java/Spring Boot)](https://github.com/CleytonW/sgp-api)
---
## Visão Geral
Este projeto implementa o front-end de um sistema para gerenciamento de projetos, permitindo visualizar, cadastrar, editar e excluir informações de forma prática.
Foi desenvolvido como parte de um estudo de caso completo para consolidar habilidades em **React**, **Bootstrap**, consumo de APIs REST e manipulação de dados no navegador.
---
## Principais Recursos
- Estrutura **SPA (Single Page Application)** com **React Router DOM** para navegação fluida.
- Consumo de APIs REST com **Axios**, integrando ao back-end em Java/Spring Boot.
- Layout responsivo com **Bootstrap 5**, garantindo boa experiência em desktop e dispositivos móveis.
- Manipulação e formatação de datas com **date-fns**.
- Código estruturado em componentes reutilizáveis.
- Compatibilidade com navegadores modernos via **Browserslist**.
---
## Tecnologias Utilizadas
**Front-end**
- React 19
- React Router DOM 7
- Bootstrap 5
- Axios
- date-fns
**Ferramentas e Configuração**
- Create React App (React Scripts)
- ESLint
- Browserslist
---
## Estrutura do Projeto
```bash
src/
├── components/ # Componentes reutilizáveis
├── pages/ # Páginas principais
├── services/ # Configuração de integração com API
├── styles/ # Estilos customizados
├── App.js # Componente raiz
└── index.js # Ponto de entrada
```
## Como Executar Localmente
### Pré-requisitos
- Node.js 18+
- NPM ou Yarn instalados
### Passos
```bash
# Clone o repositório
git clone https://github.com/CleytonW/sgp-js.git
# Acesse a pasta do projeto
cd sgp-js
```
### Instale as dependências
```bash
npm install
```
### Execute em modo desenvolvimento
```bash
npm start
```
Acesse em: http://localhost:3000
# Build para Produção
```bash
npm run build
```
O código final será gerado na pasta build/.
# Próximos Passos e Possibilidades de Evolução:
Adicionar autenticação e autorização com JWT.
* Criar testes automatizados com Jest e React Testing Library.
* Implementar controle de estado global (Redux ou Context API).
* Melhorar acessibilidade (A11Y) e SEO.
* Deploy da aplicação em serviços como Vercel, Netlify ou GitHub Pages.
# Sobre o Back-end
Este front-end consome a API desenvolvida no projeto [sgp-api](https://github.com/CleytonW/sgp-api), construída em Java 17 + Spring Boot, com:
Banco de dados relacional (MySQL/PostgreSQL).
Estrutura RESTful.
Validação de dados e tratamento de erros.
Integração com o front-end via JSON.