gTasks

Sistema para gerenciamento de tarefas.

Sistemas

Com a intenção de construir uma solução distribuida que se comunique utilizando gRPC e REST, foi pensado nos sistemas a seguir.

Account

Sistema que irá gerenciar as contas registadas no sistema. Sua principal função será gerenciar uma conta, ou seja, irá:

• Registar uma nova conta com as informações do nome e avatar do cliente.
• Atualizar as informações.
• Cancelar uma conta.

Sua principal estrutura pode ser demonstrada abaixo:

Tasks

Sistema que irá gerenciar as tarefas dos usuários, tendo como principais funções:

• Registrar uma nova atividade informando uma descrição para a atividade, o id e o nome do cliente.
• Atualizar se a atividade foi concluída
• Excluir a atividade

Sua principal estrutura pode ser demonstrada abaixo:

API

Sistema que servirá como uma camada de interface entre as informações vindas do frontend, mas também irá orquestar os sistemas de account e tasks.

Além disso, irá garantir que só receberá requisições do domínio referente ao frontend.

Web

Sistema que será responsável tanto pela visualização quanto da comunicação com a API. As funções serão:

• Autenticação via Github
• Listagem das atividades do usuário logado
• Formulário para criação de uma nova atividade
• Ação de concluir uma atividade
• Ação de excluir uma atividade

Protótipos

Login

Listagem

BFF

Sistema simples que faz intermedio entre a API e a aplicação Web, possibilitando que exista uma comunicação, mas também seja possível realizar tratativas no meio do caminho.

Para facilitar, esse sistema estará imbutido ao framework Next na parte de api que ele fornece, facilitando também acessos.

Organização do projeto

O projeto está seguindo o padrão do monorepo, e como framework o turborepo da Vercel. A principal motivação para utilizar desse padrão é a facilidade de organização de projetos auxiliares que facilmente se comunicam entre os projetos, por exemplo o projeto de lint que fica compartilhado para todos os projetos de aplicação sem precisar configurar essa parte neles.

Além do aspecto organizacional, onde todos os projeto estarão em um único repositório e conseguirem conversar entre si, um outro motivo foi a facilidade de criação de novos projetos.

Outras tecnologias

Nesse projeto está sendo utilizado:

• gRPC: comunicação entre as aplicações Account e Tasks
• REST: comunicação entre as aplicações Web e Api
• NextJS: gerenciamento do frontend (telas, rotas) e do BFF
• Typescript: Linguagem base uitilizada em todas as aplicações
• Turborepo: sistema de gerenciamento entre aplicações
• Prisma (ORM): gerenciamento do banco de dados e interface de comunicação
• Jest: geração dos testes de todas as aplicações

Fluxo para a criação de uma task

Iniciando o projeto

Pré-install

Criar um arquivo .env nos projetos apps/account e apps/tasks e adicionar a variável:

  DATABASE_URL="file:db.db"

No projeto apps/web, crie um .env apartir do arquivo .env-example e preencha as informações:

GITHUB_ID=
GITHUB_SECRET=
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=qualquer_coisa

Para criar um app no github, acesse o link, no final desse tutorial você terá o GITHUB_ID e o GITHUB_SECRET.

Instalação e Rodar os servidores

Instalação das dependências

yarn install

Inicialização dos databases

yarn setup

Rodar o projeto

yarn dev

ou

yarn start

Acessar: http://localhost:3000

Com Docker

Construir a imagem

docker-compose build

Inicializar os databases

docker-compose run --rm tasks yarn install -W && yarn setup

Rodar os projetos

docker-compose up

Acessar: http://localhost:3000

Em caso de erro de permissão

Utilize o rack

docker-compose run --rm tasks chmod -R 777 .

Demonstração