yansilveira00/calculadoraimc

Criando uma calculadora IMC com Next.JS

Desenvolvimento WEB com o framework Next.JS - Criação de uma calculadora.

Para usar o framework Next.js é necessario instalar algumas ferramentas. São elas: node.js o Yarn e o chocolatey.

Para instalar o Node é preciso acessar o site: https://nodejs.org/en/download/

Clique do usuário com o botão esquerdo do mouse em "LTS Recomendado para a maioria dos usuários

Selecionado a opção LTS, agora clique no sistema operacional desejado.

Apos o clique o Download será realizado

Clique encima para executar o instalador do Node.js

O usuário deverá clicar Next em todas as caixas de opção até concluir a instalação do Node.js

Para verificar se a instalação foi bem sucedida execute os dois comandos a seguir em uma janela do Terminal ou Prompt de Comando. Pesquise por CMD na caixa de pesquisa: Execute como Administrador: Digite os comandos acima dentro do CMD. Caso esteja tudo certo, serão apresentadas as versões conforme abaixo:

O Node.js é uma plataforma de execução JavaScript desenvolvida com o intuito de criar sistemas de rede escaláveis. Já o Yarn é um gerenciador de pacotes e dependências que funciona sobre o Node.js.

Para instalar o YARN abra o terminal e digite o seguinte comando:

Dessa forma as instalações do Node e Yarn estão finalizadas e testadas.

Próximo passo: Sera usados dois programas, o Visual Studio Code e o GitHub Desktop

O que é Visual Studio Code?

O Visual Studio Code ou Vscode é um editor de código-fonte que é gratuito e está disponível no Windows, Linux e macOS.

É desenvolvido e mantido pela Microsoft, inclui suporte para depuração, controle versão Git incorporado, realce de sintaxe, complementação inteligente de código, snippets e refatoração de código.

Instalação do VS code no Windowns:

O processo de instalação do VSCode no Windows é bem simples, basta baixar o instalador do site. Link para download: https://code.visualstudio.com/

Em seguida, execute o instalador baixado e siga as instruções na tela, não esqueça de marcar a opção “Add to Path” para adicionar o Visual Studio Code nas variáveis de ambiente.

Agora vamos baixar o GitHub Desktop: Link: https://desktop.github.com/

O processo de instalação do GitHub no Windows é bem simples, basta baixar o instalador do site.

Em seguida, execute o instalador baixado e siga as instruções na tela.

Com o Visual Studio Code e o GitHub instalados, vamos clonar o repositório do GitHub no GitHub Desktop.

Clique em Code:

Posteriormente clique em copiar link.

Pesquise pelo GitHub Desktop e execute.

Agora clique em ADD para clonar o repositório.

Cole o link dentro da caixa e clique em clonar.

Agora com o projeto selecionado no GitHub Desktop, clique em abrir projeto com o Visual Studio Code:

Após isso ira abrir o VS code.

Abra o terminal do VS code e digite o seguinte comando: yarn create next-app ./

para criar o projeto:

Para rodar o projeto, é usado o yarn dev

Com esse comando é possivel ter acesso ao link para ver o resultado do desenvolvimento do projeto pelo navegador.

Copiando e colando a url no navegador.

Vamos fazer mais algumas instalações:

yarn add styled-components

Ela é utilizada para fazer a estilização.

A outra instalação é referente a react icons:

yarn add react-icons --save

Essa instalação é usada para evitar comflitos em styled components.

Integrantes do grupo: Luis Gustavo, Rafael Henrique e Yan Silveira.