Existem muitas dúvidas sobre como gerenciar de forma eficiente os usuários das aplicações, sem ser aquele velho e antigo formato do banco de dados. Além disso, uma das grandes preocupações que permeia esse assunto, está relacionado a como fazer isso sem expor credenciais de segurança.
Pensando nisso, construimos uma aplicação template para que, a partir dela, você possa ter uma base de como resolver a maior parte desses dilemas e se preocupar com a regra de negócio que seu desenvolvimento precisa realizar.
Os principais recursos que irão nos apoiar no gerenciamento dos usuários de nossa aplicação são:
- GitHub:
- Controle de versionamento e features do projeto.
- CloudFormation:
- Utilizado para criar toda a infraestrutura necessária para o projeto, por meio de código.
- CodePipeline:
- Gerenciamento da pipeline de CI/CD para o build e deploy da aplicação React.
- CodeBuild:
- Recurso para realização dos comandos de testes e build da aplicação.
- S3:
- Hospedagem dos arquivos estáticos, gerados no build da plataforma React.
- Amplify:
- Interface de interação com os métodos de gerenciamento dos usuários Cognito;
- Interação com a camada de API, passando todos os parâmetros necessários para consumo.
- Cognito:
- Recurso responsável pela federação dos usuários.
Veja a arquitetura abaixo para esclarecer as conexões entre os recursos:
Como você deve saber, os recursos AWS cobram por utilização e é importante trazermos essa visão de custo envolvido na arquitetura apresentada, pois esse tema pode tornar-se um fator de tomada de decisão da viabilidade técnica e de negócio da aplicação.
- São Paulo:
- $ 1.66 / mês
- Norte Virgínia:
- $ 1.48 / mês
O link da calculadora, você pode encontrar clicando aqui
Dado todo cenário de recursos e custos envolvidos, para essa aplicação, estamos utilizando o ReactJS, baseado na arquitetura Typescript. Portanto, é necessário que você possua o NodeJS instalado.
Após a instalação do NodeJS e a conta AWS preparada para utilização, basta executar os comandos abaixo para iniciar o projeto.
Clonando o repositório e entrando na pasta:
git clone https://github.com/gugamainchein/cognito-casl
cd cognito-casl
Instalando dependências e executando o projeto:
yarn
yarn start
Criando a infraestrutura no CloudFormation:
- Inicie a criação da stack clicando aqui;
- Faça o upload do arquivo YML, que encontra-se na pasta
/docs/iac/template.yml
.
Após a criação dos recursos da infraestrutura e a inicialização do projeto com sucesso, você está pronto para integrá-lo com os recursos de sua conta AWS, por meio do passo-a-passo abaixo:
-
REACT_APP_IDENTITY_POOL_ID:
-
REACT_APP_AWS_REGION:
-
REACT_APP_USER_POOL_ID:
-
REACT_APP_USER_POOL_WEB_CLIENT_ID:
-
REACT_APP_COGNITO_DOMAIN:
-
REACT_APP_WEB_CLIENT_REDIRECT_URL:
Para o gerenciamento das permissões dos usuários na aplicação, optamos por utilizar a biblioteca CASL.
Por conta da utilização desta lib, atente-se na alteração dos perfis no arquivo /src/guards/ability.ts
, responsável por controlar todas as ações de cada grupo de usuários.
No caso da nossa aplicação, permitimos apenas ações em usuários, conforme o trecho abaixo:
export type Action = "read" | "create" | "update" | "delete";
export type Subject = "User";
Um último ponto importante salientar sobre esse mecanismo, é que é possível consultar essas ações de forma dinâmica, antes da aplicação iniciar. Isso permitiria que o controle da feature ficasse sobre responsabilidade do back-end.
Após realizar a alteração dos atribuitos no ability.ts
, basta aplicar os métodos indicados na documentação do CASL, conforme exemplo abaixo:
export default ({ post }) => <Can I="read" this={post} field="title">
Yes, you can do this! ;)
</Can>
- 0.1.0
- Primeira versão da aplicação
Gustavo Mainchein – @gugamainchein – [email protected]
- Realize o fork do projeto (https://github.com/gugamainchein/cognito-casl/fork)
- Crie a nova feature em uma branch (
git checkout -b feature/fooBar
) - Faça o commit das suas mudanças (
git commit -am 'Add some fooBar'
) - Realize o push para a branch (
git push origin feature/fooBar
) - Crie um novo pull request