naygomes / insights

O que é o Insights?

O Insights é um projeto proposto pela equipe da Globo para os candidatos e candidatas do seu processo seletivo. A ideia do Insights é que ele seja um app mobile para criação de Cards de conteúdo esportivos (Insights).

Status do projeto

🚧 Projeto em construção... 🚧

Conteúdo

• Pré-requisitos
• Interace HTTP REST API
• CLI para importação dos cards
• Interface WEB
• Autora

Pré-requisitos

• Instalação Node

• Instalação de ferramenta para fazer as requisições na API (Insomnia, Postman)

• Clone o projeto em seu computador:

$ git clone https://github.com/naygomes/insights.git

Interface HTTP REST API

• Estando dentro da pasta 'insights', entre na pasta 'backend' e execute o seguinte comando no terminal:

$ npm install

• Agora, execute o seguinte comando no terminal para fazer uma cópia do .env:

$ cp .env.example .env

• Abra o arquivo .env e, no campo 'DB_HOST', adicione o seguinte caminho:

DB_HOST=/insights/backend/

• A seguir, rode o comando abaixo para migrar as tabelas para a base de dados:

$ npm run migrate

• Por fim, execute o seguinte comando para servir o projeto:

$ npm run start

OBS: Para servir o projeto no modo dev, execute o comando abaixo.

$ npm run dev

CLI para importação dos cards

• Estando dentro da pasta 'insights', entre na pasta 'cli' e execute o seguinte comando para instalar as dependências do projeto:

$ npm install

Existe um arquivo csv na pasta 'cli' chamado 'cards'. Nesse arquivo contém alguns dados pré-definidos para teste. Para usar outros dados, existem duas opções;

• Apagar o arquivo cards.csv e adicionar o arquivo na mesma pasta, renomeando-o para cards.csv;
• Copiar todo o conteúdo do arquivo desejado e colar no cards.csv, não esquecendo de apagar todos os dados de teste.

• Agora, basta executar o projeto com o seguinte comando:

$ npm run start

Pronto! Agora os dados do arquivo estão cadastrados no banco.

Interface WEB

Como no protótipo, o projeto foi baseado em telas de dispositivos mobile, e recomenda-se testá-lo em telas de smartphones, em especial Iphone Xr, Iphone 11 pro max, etc.

• Caso ainda não tenha o Angular instalado, basta rodar o seguinte comando no terminal;

$ npm install -g @angular/cli

• Estando dentro da pasta 'insights', entre na pasta 'frontend' e execute o seguinte comando no terminal:

$ npm install

• Para servir, basta executar o seguinte comando no terminal:

$ ng serve

Após finalizar a compilação, abra o seu prompt de comando e execute o seguinte comando:

$ start chrome --user-data-dir="C:/Chrome dev session" --disable-web-security

Esse comando abrirá uma janela do Google Chrome que desabilita a CORS, permitindo com que as requisições possam ser feitas pelo app.

Na janela do navegador que acabamos de abrir, pressione a tecla F12. Em seguida, no campo 'dimensão' na parte superior, escolha a opção "iphone Xr" ou outro smartphone. Por fim, digite o endereço http://localhost:4200/.

---

Autora

Nayara Gomes
_{Desenvolvedora Jr}