... | ... | @@ -6,33 +6,17 @@ |
|
|
|
|
|
# Página de Configuração do Projeto
|
|
|
|
|
|
## Página de Configuração do Front
|
|
|
## Frontend
|
|
|
|
|
|
O front foi desenvolvido utilizando tecnologia React e o seu código-fonte pode ser obtido [neste repositório](https://tools.ages.pucrs.br/free-from-club/frontend).
|
|
|
### Configurando e executando (Windows e Linux)
|
|
|
|
|
|
* Primeiro você deve clonar o projeto pelo terminal/Git Bash pelo comando
|
|
|
|
|
|
`git clone https://tools.ages.pucrs.br/free-from-club/frontend.git`
|
|
|
* Após isso, você deve garantir que possui o [NodeJS](https://nodejs.org/en/) instalado. Para verificar a versão atual do NodeJS instalado no seu computador digite no terminal: `node --version`. Caso não o tenha instalado pode seguir para este [link](https://nodejs.org/en/download/) que irá lhe auxiliar na instalação.
|
|
|
* OBS1: Ao instalar o node o [NPM](https://www.npmjs.com/) será instalado também. Para verificar a versão atual do NPM digite no terminal: `npm --version`
|
|
|
Caso necessite de mais informações acesse (https://www.npmjs.com/get-npm)
|
|
|
* Com estes dois requisitos instalados, você pode entrar na pasta raiz do projeto e digitar `npm install` para instalar as dependências do projeto. Caso necessite de mais informações acesse (https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)
|
|
|
* Por fim, você pode rodar seu projeto com `npm start`. Automaticamente irá abrir uma página no navegador e você pode começar a desenvolver a aplicação.
|
|
|
* Configuração das extensões do Visual Studio Code
|
|
|
* 1° passo: Baixar o [Visual Studio Code](https://code.visualstudio.com).
|
|
|
* 2° passo: Dentro do Visual Studio Code abrir a as extensões e baixar os seguintes plugins.
|
|
|
|
|
|
<s>**Lista de plugins**.
|
|
|
* [Bracket Pair Colorizer](https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer)
|
|
|
* [HTML CSS Support](https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css)
|
|
|
* [JavaScript (ES6) code snippets](https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets)
|
|
|
* [Npm](https://marketplace.visualstudio.com/items?itemName=eg2.vscode-npm-script)
|
|
|
* [HTML Snippets](https://marketplace.visualstudio.com/items?itemName=abusaidm.html-snippets)</s>
|
|
|
|
|
|
Aqui deve ser explicado como configurar o Ambiente para que os Desenvolvedores do Projeto possam configurar o projeto para rodar em seus computadores, deve ser sempre atualizado a cada mudança de instalação feita.
|
|
|
|
|
|
* Deve ser explicado a configuração de **TODAS** as partes do projeto, tanto BACK,BANCO,FRONT,etc...
|
|
|
* Além de explicar aqui, deve ter em cada Repositório o **RESUMO** de como instalar para quando os Desenvolvedores baixarem o projeto possam configurar por lá também
|
|
|
1) Instalar [Configurações Gerais](#configurações-gerais)
|
|
|
2) Instalar globalmente em seu terminal o [Expo](https://docs.expo.dev/) utilizando o comando ```
|
|
|
npm install -g expo-cli```
|
|
|
3) Em seu diretório local, Realizar o comando ```git clone https://tools.ages.pucrs.br/meu-mundo-azul/meu-mundo-azul-frontend.git ``` e ```git checkout nome-branch ``` para a branch que está trabalhando
|
|
|
4) Abra o projeto na sua IDE e, no terminal, execute o comando ```npm install``` e, em seguida, ```npm start```
|
|
|
5) Faça o Download do [Expo GO](https://expo.dev/client) na App Store ou Google Play em seu Android e/ou iOS. Abra o app e escaneie o QR code que aparecer na tela. Se preferir você também tem a opção de abrir em um emulador pressionando ```a``` ou na web, pressionando ```w```
|
|
|
|
|
|
---
|
|
|
|
... | ... | |