Home | Sprints | Requisitos | Arquitetura | Configuração | Mockups | BD | Instalação | GP | Horários | Processo |
---|
Configuração do Projeto
Tópicos
- Links
- Instalação do Node
- Instalação do Docker
- Instalação do MySql
- Configuração do Ambiente de Desenvolvimento
- Execução dos Projetos
Links
- Back-end repo: https://tools.ages.pucrs.br/cine-clube/backend
- Front-end repo: https://tools.ages.pucrs.br/cine-clube/frontend
- Homologação: http://hml.ages.pucrs.br
Backend
Frontend
Instalação do Node
Instalação
O download do instalador do Node pode ser realizado pelo seguinte link.
Faça o download e siga os passos de instalação da versão mais recente que possua LTS (Long Term Support).
Para verificar se o node foi instalado corretamente, execute o comando node -v
e verifique se o retorno é semelhante ao apresentado abaixo (caso a versão seja diferente não se preocupe).
node -v
v14.16.0
Instalação do Docker
Tutorial de instalação: Windows / MacOS / Ubuntu / Debian
Instalação do MySql
Para realizar a instalação de uma instância do MySql através do docker, utilize o comando abaixo.
Caso esteja no Windows, utilize o PowerShell.
Caso esteja usando Linux, deve-se adicionar sudo
antes de cada comando do docker.
docker run --name <nome-do-container> -e MYSQL_ROOT_PASSWORD=<senha-root> -e MYSQL_USER=<nome-usuario> -e MYSQL_PASSWORD=<senha-usuario> -e MYSQL_DATABASE=cine_clube -p 3306:3306 -d mysql:latest
Onde:
-
<nome-do-container>
é o nome do container a ser criado. Ex: cine-clube-mysql. -
<senha-root>
é a senha que será utilizada para acessar o banco de dados como usuário root. -
<nome-usuario>
é o nome de usuário que será utilizado para acesso ao banco de dados e<senha-usuario>
é a senha do mesmo.
O comando final será algo como o exemplo abaixo.
docker run --name cine-clube-mysql -e MYSQL_ROOT_PASSWORD=rootpass123 -e MYSQL_USER=myuser -e MYSQL_PASSWORD=mypassword -e MYSQL_DATABASE=cine_clube -p 3306:3306 -d mysql:latest
Configuração do Ambiente de Desenvolvimento
Aplicações necessárias
- Visual Studio Code: link para download do VisualStudio Code
- Postman: link para download do Postman
OBS: Não é necessário criar uma conta para utilizar o Postman. Ao iniciar o app, simplesmente clique em "Skip signing in and take me straigt to the app"
VisualStudio Code
Utilizaremos o VisualStudio Code para o desenvolvimento da aplicação. Para facilitar no desenvolvimento, instale os seguintes pacotes:
- ESLint
- Prettier
- Docker
Após a instalação das extensões, vá nas configurações do VisualStudio Code (File > Preferences > Settings), procure format on save
e marque a opção Editor: Format On Save.
Postman
O Postman é utilizado para testar as rotas/endpoints do backend.
TODO: Adicionar exemplo/descrição.
Execução dos Projetos
Backend
Pré-requesitos
- Node.js
- npm
Iniciando
-
Clonar este repositório
git clone http://tools.ages.pucrs.br/cine-clube/backend.git
-
Entrar no diretório do projeto
cd backend
-
Instalar as dependências
npm install
Execute o seguinte comando:
cp .env.example .env
A seguir, altere os valores de DB_USERNAME e DB_USERNAME do arquivo .env, substituindo-os pelo usuário e senha do banco de dados.
OBS: Se ainda não instalou o banco de dados, veja como na página de configuração.
Também deve se inserir o endereço do arquivo de configuração do Firebase em GOOGLE_APPLICATION_CREDENTIALS
O arquivo deve ser obtido no console do Firebase. Acesse as configurações > Usuários e permissões > Contas de serviço > Gerar nova chave privada.
Renomeie o arquivo para firebase-config.json
Onde o valor final deve ser como o abaixo:
GOOGLE_APPLICATION_CREDENTIALS = "C:\Users\username\Documents\AGES\backend\firebase-config.json"
-
Rodar as migrações do banco
npm run typeorm -- migration:run
-
Popular o banco de dados
npm run db:seed
-
Fazer a geração das rotas
npm run tsoa:gen
-
Iniciar a aplicação
npm run dev
-
Acesse pelo navegador
http://localhost:5000
Comandos do TypeORM
-
Rodar as migrações do banco
npm run typeorm -- migration:run
-
Criar as novas migrações
npm run typeorm -- migration:generate -n <nome da migração>
-
Reverter a última migração do banco
npm run typeorm -- migration:revert
Frontend
Pré-requesitos
- Node.js
- Yarn ou npm
Iniciando
- Clonar este repositório
git clone http://tools.ages.pucrs.br/cine-clube/frontend.git
- Entrar no diretório do projeto
cd frontend
- Instalar as dependências
npm install
ouyarn install
Execute o seguinte comando:
cp .env.example .env
Altere os valores dentro do arquivo .env, substituindo-os pelos dados da conta do Firebase.
Como encontrar os dados.
- Iniciar a aplicação
npm start
ouyarn start
- Acesse pelo navegador
http://localhost:3000
Obtendo os dados do Firebase
Acesse o console do Firebase.
Faça o login utilizando a conta do time. (Os dados de login estão no Discord do time. Se não encontrá-los, pergunte para algum AGES 3/4).
Entre no projeto do Cine Clube e acesse as configurações do projeto. No final da página estarão os valores necessários.
Insira-os no arquivo .env de maneira que o resultado final seja semelhante ao abaixo:
REACT_APP_API_KEY = AIzaSyCvNn-3-DBBO5TysLO67f0nsOEhOqpwi4E
REACT_APP_AUTH_DOMAIN = cineclube-ab123.firebaseapp.com
REACT_APP_PROJECT_ID = cineclube-ab123
REACT_APP_STORAGE_BUCKET = cineclube-ab123.appspot.com
REACT_APP_MESSAGING_SENDER_ID = 123456789012
REACT_APP_APP_ID = 1:123456789012:web:95b53dd4e787b16e2979fa