🚀 Acessar site em produção

Sumário

• Objetivo
• Pré Requisitos
• Tecnologias que estão sendo utilizadas no projeto
• Padrão de código
• IDE utilizada para a codificação
• Plugins para instalar no Visual Studio Code (Vscode)
• Instalação do projeto
• Rodando os Testes no projeto
• Features já desenvolvidas
• Referências pra desenvolvimento

🎯 Objetivo

O aperte o play é uma site que disponibiliza vídeos baseados no youtube.

📚 Pré Requisitos

• Node
• Yarn
• Git
• Editor de código

---

🛠️ Tecnologias que estão sendo utilizadas no projeto

• React
• Hooks
• Function Components
• Axios
• Styled Components
• Jest

🖥️ Padrão de código

• Eslint
• Prettier
• EditorConfig
• Commitlint

🎧 IDE utilizada para a codificação

• Visual Studio Code

🔌 Plugins para instalar no Visual Studio Code (Vscode)

• EditorConfig for VS Code - Mantém a configuração do projeto igual em todas a ide's do vscode
• EsLint - É responsável por verificar a sintaxe e análise de código, provendo sugestões de solução
• Prettier - É responsável por formatar o código de uma maneira padronizada de acordo com as configurações já definidas
• VSCode Styled Components - É necessário para que o vscode reconheça a sintaxe do styled components

🔧 Instalação do projeto

Abra seu terminal e faça o clone do projeto em um diretório da sua máquina, para isso rode:

git clone https://github.com/ReneSena/app-youtube-flix.git ou git@github.com:ReneSena/app-youtube-flix.git

Após o download do projeto ser finalizado, a pasta front-saas-backoffice estará disponível no diretório que foi realizado o download.

🚀 Como executar o projeto?

Existem duas formas de abrir o projeto, uma delas é abrindo o vscode indo na opção File -> Open Folder e escolher a pasta do projeto que deseja abrir. A outra opção é navegar através do terminal até pasta que deseja abrir e rodar o comando:

code .

Isso fará com que o vscode seja aberto na pasta selecionada.

1️⃣ Instalando dependências do projeto

Depois de ter realizado o processo de clonagem, é necessário instalar as dependências do projeto, para isso em seu terminal na pasta do projeto rode:

yarn install

2️⃣ Executando o projeto localmente

Depois que as dependências foram instaladas, é necessário observar que uma pasta node_modules foi criada, é ela que gerenciará nossos pacotes que são instalados no projeto. Bom, agora com o ambiente preparado basta executarmos o comando:

yarn start

👀 Executando os testes

No projeto, existem testes relacionados a api do Youtube. Para executá los, basta abrir o terminal e rodar o comando:

yarn test

🌎 Ambientes

• Desenvolvimento: http://localhost:3000/
• Produção: http://app-youtube-flix-renesena.vercel.app/

✔️ Features já desenvolvidas

• Listagem de categorias baseadas em playlists pré-definidas
• Assistir videos selecionados
• Gerenciar videos selecionados como favorito
• Pesquisar outros tipos de videos além das categorias já prédefinidas

📚 Referências

• Youtube Api
• React
• Dribbble