Link do desafio: Desafio Gazin Tech
Desenvolvimento de um Projeto Full Stack JavaScript utilizando das mais mordernas ferramentas do mercado para a construção de uma API Rest e uma SPA completas através dos topicos apresentados no Desafio Gazin Tech.
- No geral:
- Api:
- Frontend:
-
API's RESTFul construída em Restify, um framework javascript construído tendo como principal objetivo o desenvolvimento de API's.
-
Frontend construido como Single Page Application com compartilhamento de estados via Redux e React-Redux.
-
Interligação entre Frontend e API via requisições http com Axios e formato JSON.
-
Cadastro, edição e remoção de Níveis.
-
Cadastro, edição e remoção de Desenvolvedores.
-
Validações dos campos dos formulários ocorrendo tanto no Frontend quanto na API de forma independente.
-
Níveis com desenvolvedores relacionados não podem ser excluídos, implementado tanto no API quanto no Frontend de forma independente.
-
Ambiente de desenvolvimento e execução Docker.
-
Ordenação dos campos na visualização de todos os itens com possibilidade de ordem crescente ou decrescente, valido tanto para Níveis quanto para Desenvolvedores.
-
Exibe na listagem de Níveis a quantidade de desenvolvedores associados a ele em uma coluna própria, que também pode ser usado como fator de ordenação.
-
Pesquisa por nome com direito a auto complete, funcional tanto na listagem de Níveis quanto na de Desenvolvedores.
-
Construção manual das imagens Docker utilizadas, o que consequentemente também permite a montagem singular dos containers(API ou Frontend) mas de preferencia e boa pratica é utilizado e se recomenda por padrão o docker-compose para a montagem do ambiente.
-
Foi construido o modelo relacional usado utilizado no MySQL e ele se encontra nas pasta projeto/
-
Banco MySQL sendo montado automaticamente com as tabelas dentro do container de banco de dados.
-
Opção para consulta/gerenciamento do Banco de Dados via phpMyAdmin.
-
Gerenciamento do banco de dados MySQL na API via modelo ORM com o uso de Sequelize.
-
Possua Docker instalado na maquina obrigatoriamente.
-
Garanta que sua maquina tenha suporte a versão 3.8 do docker-compose antes de mais nada, caso não tenha, a instalação do ambiente irá retornar um erro antes mesmo de começar a subir os containers.
-
Garanta antas da instalação deste projeto que não haja qualquer container em execução na maquina para evitar conflitos de portas.
-
A versão do Frontend em execução é a versão buildada que se encontra em src/frontend/build, qualquer alteração na codagem do ReactJS não irá refletir no navegador.
-
Dica de ouro: force um Error 404 no frontend 🔥
Acesse no link: Mapeamento de Rotas da API - Desafio Gazin Tech
👉(Clique aqui 🔥)👈
├── README.md
├── builds
│ ├── nodejs_api.Dockerfile
│ └── nodejs_frontend.Dockerfile
├── desafio
│ └── README.md
├── docker-compose.yml
├── projeto
│ ├── Modelo Relacional.mwb
│ └── Modelo Relacional.mwb.bak
├── sql
│ └── dump.sql
└── src
├── api
│ ├── app.js
│ ├── config
│ │ └── connectionBD.js
│ ├── controllers
│ │ ├── desenvolvedorController.js
│ │ └── nivelController.js
│ ├── middleware
│ │ └── cors.js
│ ├── models
│ │ ├── desenvolvedor.js
│ │ └── nivel.js
│ ├── package.json
│ └── routes
│ ├── desenvolvedor.js
│ └── nivel.js
└── frontend
├── README.md
├── build
│ ├── asset-manifest.json
│ ├── css
│ │ └── materialize.min.css
│ ├── index.html
│ ├── manifest.json
│ ├── robots.txt
│ └── static
│ ├── css
│ │ ├── main.311a51d9.css
│ │ └── main.311a51d9.css.map
│ └── js
│ ├── 787.774729bc.chunk.js
│ ├── 787.774729bc.chunk.js.map
│ ├── main.0a926070.js
│ ├── main.0a926070.js.LICENSE.txt
│ └── main.0a926070.js.map
├── package-lock.json
├── package.json
├── public
│ ├── css
│ │ └── materialize.min.css
│ ├── index.html
│ ├── manifest.json
│ └── robots.txt
└── src
├── App.jsx
├── bd.js
├── components
│ ├── Acoes.jsx
│ ├── AddButton.jsx
│ ├── Content.jsx
│ ├── Desenvolvedor
│ │ ├── DesenvolvedorForm.jsx
│ │ └── DesenvolvedorRowTable.jsx
│ ├── Head.jsx
│ ├── Header
│ │ ├── Header.jsx
│ │ ├── Navbar.jsx
│ │ └── index.jsx
│ ├── Nivel
│ │ ├── NivelForm.jsx
│ │ └── NivelRowTable.jsx
│ └── Table
│ ├── Head.jsx
│ ├── Table.jsx
│ └── index.jsx
├── index.js
├── pages
│ ├── Desenvolvedor
│ │ ├── DesenvolvedorCreate.jsx
│ │ ├── DesenvolvedorPage.jsx
│ │ └── index.jsx
│ ├── Error
│ │ ├── NotFound404Page.css
│ │ └── NotFound404Page.jsx
│ ├── Home.jsx
│ └── Nivel
│ ├── NivelCreate.jsx
│ ├── NivelPage.jsx
│ └── index.jsx
├── reportWebVitals.js
├── services
│ ├── bd
│ │ ├── desenvolvedorService.js
│ │ └── nivelService.js
│ └── tools
│ ├── convertFormatTime.js
│ ├── ordenacaoByItem.js
│ ├── searchByString.js
│ └── toastError.js
└── store
├── features
│ ├── desenvolvedor
│ │ ├── delete.js
│ │ ├── fetchById.js
│ │ ├── index.js
│ │ ├── post.js
│ │ └── put.js
│ ├── desenvolvedores
│ │ ├── fetchAllDevs.js
│ │ └── index.js
│ ├── links
│ │ └── index.js
│ ├── niveis
│ │ ├── fetchAllNiveis.js
│ │ └── index.js
│ └── nivel
│ ├── delete.js
│ ├── fetchById.js
│ ├── index.js
│ ├── post.js
│ └── put.js
└── store.js
- Clone este repositorio com:
git clone https://github.com/gusscamargo/Desafio-Gazin-Tech
- Adentre a pasta:
cd "Desafio-Gazin-Tech"
-
Garanta que esteja com o Docker inicializado e funcionando na maquina e que suporte a versão 3.8 do docker-compose.
-
Dê stop ou derrube todo e qualquer container Docker ativo para evitar conflito de portas neste momento com os containers que iremos subir.
-
Construa as builds do ambiente com(pode demorar um pouco):
docker-compose build --no-cache
- Suba os ambientes de desenvolvimento:
docker-compose up -d
-
Após os ambientes terem subido recomendo a espera de 1 minuto para a execução dos scripts de inicialização internos dos containers terminarem suas execuções antes de abrir o navegador ou o Postman e sair realizando os testes.
-
Abra o navegador em http://127.0.0.1/ ou http://127.0.0.1:8080/ caso queira abrir o phpMyAdmin.
-
Encare a seguinte tela :)
- Aproveite, faça seus testes e obrigado por me acompanhar até aqui.
