Cadastro de Filmes

Conteúdos

Sobre
Features
Pré-requisitos
Instalação
- API
- UI
Como usar
- API
- UI
Tecnologias
Demonstração

Sobre

Este é um pequeno CRUD de filmes utilizando Spring Boot com autenticação oAuth2, JWT e Angular 12

A implementação conta com upload de arquivos, login expirado por inatividade, envio de email, cors e muito mais.

Esse projeto está em construção e periodicamente será atualizado.

🚧 Em construção...🚧

Features

Back-end

Access Token

Refresh Token

Logout

Cadastrar Filme

Consultar Filme

Atualizar Filme

Listar Filme

Excluir Filme

Front-end

Login

Logout

Cadastrar Filme

Consultar Filme

Atualizar Filme

Listar Filme

Excluir Filme

Pré-requisitos

Mysql 8

JDK 11+

Postman v9.13.2

Node 4.15.0

NPM 6.14.8

Angular CLI 12.2.16

Instalação

API (back-end)

Importe para o seu Mysql o arquivo database.sql, que se encontra em _files. Na pasta _files encontra-se também o arquivo movies.postman_collection.json para que você importe para o seu postman. Esse arquivo contém os endpoints da aplicação. A API está documentada com Swagger e você pode acessar pela url localhost:port/api/v1/swagger-ui.html. No rquivo application.properties contém as configurações da API, uma das mais importantes é api.config.allow-origin , nela você vai informar onde a aplicação Angular está rodando. Só serão aceitas requisições desta origem.

Repositório API

UI (front-end)

Abra o projeto no VSCode ou a IDE de sua preferência, abra o terminal e digite npm install. Isso irá baixar todas as dependências necessária para rodar o projeto. Após baixar as dependências, digite npm start para iniciar o projeto. No arquivo environment.ts existem duas configurações (apiUrl e startWatching), a apiUrl aponta para a url que está rodando a API e a startWatching é o tempo em segundos que a aplicação irá expirar caso fique inativo. Configure o tempo que achar necessário para aplicação inativa expirar.

Repositório UI

Como Usar

API (back-end)

Primeiramente, edite o arquivo application.properties e altere as seguintes informações:

spring.datasource.url=<sua url do banco>.

spring.datasource.username=<seu usuário do banco>.

spring.datasource.password=<sua senhado banco>.

server.port=<port> - Caso queira rodar em outra porta.

api.config.allow-origin=<origem permitida>. Url onde está rodando a aplicação Angular.

server.port=<port> - Caso queira rodar em outra porta.

Abra o projeto no Intellij (ou na sua IDE preferia), e execute-o utilizando o Maven.
Para testar os endpoints no Postman, abra-o e importe o arquivo movies.postman_collection.json que se encontra em files. Gere o Access Token e coleque-o no Bearer. Após, é só testar os endpoints.
A API está documentada com o Swagger, é só entrar no seu navegador e digitar localhost:port/api/v1/swagger-ui.html e você verá todos os endpoints da API.

Repositório API

UI (front-end)

Abra o projeto no VSCode ou na IDE de sua preferência, abra o terminal e digite npm start. Por padrão, a aplicação irá rodar na porta 4200 (http://localhost:4200/).

Atenção: Se você alterar a porta padrão, será necessário alterar a configuração na API informando a Origem Permitida no arquivo application.properties api.config.allow-origin=http://localhost:port/