Nesse curso iremos aprender a desenvolver uma simples aplicação com a stack MERN(Mongo, Express, React e Node), uma das stack mais utilizadas para a criação de aplicações SPA(Single Page Application). No minicurso iremos aprender conceitos como:
- Entender como funciona a arquitetura Cliente-Servidor
- Entender o desenvolvimento de aplicações Front-End e Back-End
- Configuração de Ambiente de Desenvolvimento
- Utilização de Gerenciamento de Pacotes
- Desenvolvimento de uma API com NodeJS + Express
- Desenvolvimento de Interfaces com React
- Criação de uma SPA(Single Page Application)
- Introdução a utilização do Socket.io
Navegar com o terminal até a pasta backend
Rodar o comando
yarn
Depois rodar comando
yarn start
Iniciar outra instância do terminal ou uma nova aba e fazer o mesmo na pasta frontend
Desenvolvendo com React + Node
Banco de Dados não relacional mais utilizado atualmente. Para sua instalação basta acessar o link abaixo e seguir os passos de instalação para sua plataforma. Link de Download do MongoDB
Segundo o seu site, ele é um Runtime Build de Javascript, ou seja, um construtor ou compilador de Javascript que não roda na WEB. Para instalarmos o NodeJS, acesse o site e faça o download selecionando o seu sistema operacional. (Recomendo a versão LTS)
Yarn é um gerenciador de pacotes muito utilizado no mundo do Javascript. Ele tem como dependência o NodeJS, então deve-se instalar o NodeJS antes. Com o NodeJS instalado, é só acessar o link abaixo e seguir o tutorial para o seu sistema operacional. Link de Instalação do Yarn
Para "instalação" do React, apenas precisamos baixar o seu "criador de projetos" chamado create-react-app. Depois de ter instalado o Yarn colocaremos o seguinte código no terminal.
yarn global add create-react-app
Para a criação e teste de requests, utilizaremos o Insomnia, uma ferramenta gratuita que pode fazer requisições para a nossa API. Você consegue fazer o download no link abaixo. Link de Instalação do Insomnia
Você pode dar uma olhada no Roadmap desenvolvido pela comunidade React. Nele tem tecnologias que você pode aprender para melhorar suas skills, como: Redux, Styled-Components, Prop-Types e dentre outros.
Se você se sentiu desafiado com React, tambem tem o React Native, que transpila o código React para iOS e Android. Assim criando aplicativos com interfaces nativas e o melhor com uma base bem similar com a que você viu nesse minicurso. Link do site do React Native
É isso ai! Agora você já consegue desenvolver aplicações com React, conectar e criar uma API utilizando NodeJS, Express e MongoDB. Não pare por ai! Crie ou copie novas aplicações para desenvolver suas habilidades! Gostaríamos de agradecer ao pessoal da gestão do SECOMP pela organização, ao pessoal da UTFPR por nos ceder o local e a vocês por virem aprender mais!
Qualquer dúvida nos mande um email.
Gabriel Barreto
Pedro Nolasco