diff --git a/.gitmodules b/.gitmodules new file mode 100644 index 0000000..6fbc188 --- /dev/null +++ b/.gitmodules @@ -0,0 +1,6 @@ +[submodule "backend"] + path = backend + url = https://github.com/tuliogontijo/desafio-votacao-dbserver-backend.git +[submodule "frontend"] + path = frontend + url = https://github.com/tuliogontijo/desafio-votacao-dbserver-frontend.git diff --git a/README.md b/README.md index a7e5303..7931579 100644 --- a/README.md +++ b/README.md @@ -1,99 +1,92 @@ -# votacao-react-java +# Desafio Votação - Full Stack -## Objetivo +Este é um projeto desenvolvido como parte de um desafio técnico para criar uma solução para dispositivos móveis que gerenciem e participem de sessões de votação em cooperativas. A solução foi implementada em Java, utilizando o framework Spring Boot para o backend e Javascript com a biblioteca React para o frontend. -Imagine que você deve criar uma solução web para gerenciar e participar de sessões de votação. +👉 As instruções para este desafio foram propostas **[aqui](docs/INSTRUCOES_DEASAFIO.md)** -Essa solução deve ser executada na nuvem e promover as seguintes funcionalidades através de uma API REST: +## Tecnologias Utilizadas -- Cadastrar uma nova pauta -- Abrir uma sessão de votação em uma **pauta** (a sessão de votação deve ficar aberta por um tempo determinado na chamada de abertura ou 1 minuto por *default*) -- Receber votos nas pautas (os votos são apenas 'Sim'/'Não'. Cada usuário é identificado por um id único e pode votar apenas uma vez por pauta) -- Contabilizar os votos e dar o resultado da votação na pauta +### Backend *(IDE: IntelliJ)* +- Java 17 +- Spring Boot +- Maven +- PostgreSQL +- JUnit +- Mockito -Para fins de exercício a solução deve ser construída em Java (SpringBoot) no backend e React no frontend. Frameworks e bibliotecas são de livre escolha (desde que não infrinja direitos de uso). +### Frontend *(IDE: Visual Studio Code)* +- Javascript +- React +- Vite +- Ant Design +- Axios -É importante que as pautas e os votos sejam persistidos e que não sejam perdidos com o restart da aplicação. +## Modelagem de banco de dados -O foco dessa avaliação é a comunicação entre o backend e o frontend. Essa comunicação é feita através de mensagens no formato JSON, onde essas mensagens serão interpretadas pelo cliente para montar as telas onde o usuário vai interagir com o sistema. O formato fica a seu criterio e as telas estão descritas no anexo 1. +Para a modelagem do banco de dados fora considerada a existências de duas entidades a serem persistidas: **Pautas** e **Votos**. O controle de abertura e fechamento de sessão foi feito com a manipulação de atributos da entidade Pauta. -## Como proceder +Modelagem do banco de dados -Por favor, realize o FORK desse repositório e implemente sua solução no FORK em seu repositório GitHub, ao final, notifique da conclusão para que possamos analisar o código implementado. +## Pré-requisitos -Lembre-se de deixar todas as orientações necessárias para executar o seu código. +Para executar este projeto, é necessário ter instalado: -## Tarefas bônus +- JDK 17 ou superior +- Npm ou yarn +- PostgreSQL 16 +- Git -### Tarefa Bônus 1 - Controle de usuários +## Como Executar o Projeto Localmente -- Criar cadastro de usuários para votação (apenas CPFs validos) -- Adicionar usuários específicos como admin -- Apenas usuários admin podem acessar alguns recursos - - Criar pautas - - Cadastrar usuários votantes +Siga as instruções abaixo para executar o projeto localmente: -### Tarefa Bônus 2 - Performance +1. Abra o terminal em um diretório na sua máquina local e clone este repositório; +``` +git clone https://github.com/tuliogontijo/votacao-react-java.git +``` +2. Inicie o serviço postgreSQL e crie um datasource como nome "desafio_votacao"; -- Imagine que sua aplicação possa ser usada em cenários que existam centenas de milhares de votos. Ela deve se comportar de maneira performática nesses cenários -- Testes de performance são uma boa maneira de garantir e observar como sua aplicação se comporta +### Backend -### Tarefa Bônus 3 - Versionamento da API +3. Navegue até o diretório do backend; +``` +cd backend +``` +4. Instale as dependências; +``` +./mvnw clean install +``` +5. Rode a aplicação +``` +./mvnw springboot:app +``` +- Se tudo estiver correto a aplicação Java Spring Boot estará disponível em http://localhost:8080 e o banco PostgreSQL na porta padrão 5432. -- Como você versionaria a API da sua aplicação? Que estratégia usar? +- Também é possível acessar a documentação e executar as requisições através do endereço: **http://localhost:8080/swagger-ui/index.html** -## Dicas e observações +### Frontend -- Teste bem sua solução, evite bugs; -- Não inicie o teste sem sanar todas as dúvidas; -- Iremos executar a aplicação para testá-la, cuide com qualquer dependência externa e deixe claro caso haja instruções especiais para execução do mesmo; +6. Navegue até o diretório do frontend +``` + cd .. + cd frontend +``` +7. Instale as dependências do projeto +``` + yarn +``` +8. Rode o seguinte script pré-configurado pelo vite para rodar o projeto +``` + yarn dev +``` -## Anexo 1 +A aplicação rodará e estará acessível no seu localhost na porta padrão do vite: 5173 (http://localhost:5173) -### Introdução +## Funcionalidades da Aplicação -A seguir serão detalhados quais telas são necessárias para a conclusão do desafio, assim como os tipos de campos disponíveis para a interação do usuário. +A aplicação oferece as seguintes funcionalidades: -### Tipo de tela – FORMULARIO - -Criar um formulário para cadastro de uma pauta com o tempo de sessão. - -### Tipo de tela – SELECAO - -Exibir uma lista de pautas para que o usuário acesse e consiga votar. - -Apenas pautas com sessão disponíveis devem ser exibidas. - -Deve ser possível filtrar uma pauta por **categoria** - -### Tipo de tela – VOTACAO - -Exibir os dados da pauta e as opções de voto disponíveis. - -Ao acessar a votação uma sessão precisa estar aberta para a pauta em questão. - -Pautas com sessão expiradas não podem receber votos. - -A votação pode ser acessada por qualquer pessoa com link, sendo necessário informar o CFP antes de votar. - -### Tipo de tela – DETALHES - -Exibir os dados da pauta, quantidade de votos total e se a mesma foi aprovada. - -Ao acessar os detalhes deve exibir se a sessão já terminou. - -## O que será analisado - -- Simplicidade no design da solução (evitar over engineering) -- Organização do código -- Arquitetura do projeto -- Boas práticas de programação (manutenibilidade, legibilidade etc) -- Possíveis bugs -- Tratamento de erros e exceções -- Explicação breve do porquê das escolhas tomadas durante o desenvolvimento da solução -- Uso de testes automatizados e ferramentas de qualidade -- Limpeza do código -- Documentação do código e da API -- Logs da aplicação -- Mensagens e organização dos commits -- Layout responsivo +- Cadastro de uma nova pauta +- Abertura de uma sessão de votação em uma pauta +- Recebimento de votos nas pautas (apenas 'Sim'/'Não') +- Contabilização dos votos e resultado da votação na pauta \ No newline at end of file diff --git a/backend b/backend new file mode 160000 index 0000000..2a104af --- /dev/null +++ b/backend @@ -0,0 +1 @@ +Subproject commit 2a104afa41480c1b2dba32659b34c3b6c1d656fb diff --git a/docs/INSTRUCOES_DEASAFIO.md b/docs/INSTRUCOES_DEASAFIO.md new file mode 100644 index 0000000..a7e5303 --- /dev/null +++ b/docs/INSTRUCOES_DEASAFIO.md @@ -0,0 +1,99 @@ +# votacao-react-java + +## Objetivo + +Imagine que você deve criar uma solução web para gerenciar e participar de sessões de votação. + +Essa solução deve ser executada na nuvem e promover as seguintes funcionalidades através de uma API REST: + +- Cadastrar uma nova pauta +- Abrir uma sessão de votação em uma **pauta** (a sessão de votação deve ficar aberta por um tempo determinado na chamada de abertura ou 1 minuto por *default*) +- Receber votos nas pautas (os votos são apenas 'Sim'/'Não'. Cada usuário é identificado por um id único e pode votar apenas uma vez por pauta) +- Contabilizar os votos e dar o resultado da votação na pauta + +Para fins de exercício a solução deve ser construída em Java (SpringBoot) no backend e React no frontend. Frameworks e bibliotecas são de livre escolha (desde que não infrinja direitos de uso). + +É importante que as pautas e os votos sejam persistidos e que não sejam perdidos com o restart da aplicação. + +O foco dessa avaliação é a comunicação entre o backend e o frontend. Essa comunicação é feita através de mensagens no formato JSON, onde essas mensagens serão interpretadas pelo cliente para montar as telas onde o usuário vai interagir com o sistema. O formato fica a seu criterio e as telas estão descritas no anexo 1. + +## Como proceder + +Por favor, realize o FORK desse repositório e implemente sua solução no FORK em seu repositório GitHub, ao final, notifique da conclusão para que possamos analisar o código implementado. + +Lembre-se de deixar todas as orientações necessárias para executar o seu código. + +## Tarefas bônus + +### Tarefa Bônus 1 - Controle de usuários + +- Criar cadastro de usuários para votação (apenas CPFs validos) +- Adicionar usuários específicos como admin +- Apenas usuários admin podem acessar alguns recursos + - Criar pautas + - Cadastrar usuários votantes + +### Tarefa Bônus 2 - Performance + +- Imagine que sua aplicação possa ser usada em cenários que existam centenas de milhares de votos. Ela deve se comportar de maneira performática nesses cenários +- Testes de performance são uma boa maneira de garantir e observar como sua aplicação se comporta + +### Tarefa Bônus 3 - Versionamento da API + +- Como você versionaria a API da sua aplicação? Que estratégia usar? + +## Dicas e observações + +- Teste bem sua solução, evite bugs; +- Não inicie o teste sem sanar todas as dúvidas; +- Iremos executar a aplicação para testá-la, cuide com qualquer dependência externa e deixe claro caso haja instruções especiais para execução do mesmo; + +## Anexo 1 + +### Introdução + +A seguir serão detalhados quais telas são necessárias para a conclusão do desafio, assim como os tipos de campos disponíveis para a interação do usuário. + +### Tipo de tela – FORMULARIO + +Criar um formulário para cadastro de uma pauta com o tempo de sessão. + +### Tipo de tela – SELECAO + +Exibir uma lista de pautas para que o usuário acesse e consiga votar. + +Apenas pautas com sessão disponíveis devem ser exibidas. + +Deve ser possível filtrar uma pauta por **categoria** + +### Tipo de tela – VOTACAO + +Exibir os dados da pauta e as opções de voto disponíveis. + +Ao acessar a votação uma sessão precisa estar aberta para a pauta em questão. + +Pautas com sessão expiradas não podem receber votos. + +A votação pode ser acessada por qualquer pessoa com link, sendo necessário informar o CFP antes de votar. + +### Tipo de tela – DETALHES + +Exibir os dados da pauta, quantidade de votos total e se a mesma foi aprovada. + +Ao acessar os detalhes deve exibir se a sessão já terminou. + +## O que será analisado + +- Simplicidade no design da solução (evitar over engineering) +- Organização do código +- Arquitetura do projeto +- Boas práticas de programação (manutenibilidade, legibilidade etc) +- Possíveis bugs +- Tratamento de erros e exceções +- Explicação breve do porquê das escolhas tomadas durante o desenvolvimento da solução +- Uso de testes automatizados e ferramentas de qualidade +- Limpeza do código +- Documentação do código e da API +- Logs da aplicação +- Mensagens e organização dos commits +- Layout responsivo diff --git a/docs/img/desafio_votacao.png b/docs/img/desafio_votacao.png new file mode 100644 index 0000000..6dfb2a9 Binary files /dev/null and b/docs/img/desafio_votacao.png differ diff --git a/frontend b/frontend new file mode 160000 index 0000000..d8ea3cf --- /dev/null +++ b/frontend @@ -0,0 +1 @@ +Subproject commit d8ea3cf0e3296a00ee4ea803a7b627a44fd7fe01