LABootcamp: dicas para aprender ReactJS

João Paulo N. Soares
LABHacker
Published in
4 min readFeb 28, 2020

Quando eu cheguei no LAB, uma das primeiras atividades passadas para mim foi: “Se prepare para apresentar no bootcamp”, o que me deixou um pouco em dúvida sobre o que era aquilo e, ao mesmo tempo, me deixou animado por ver que seria uma boa oportunidade para aprender e conhecer técnicas e tecnologias. E foi mesmo! Por isso, hoje vou falar sobre uma das ferramentas que apresentei: o ReactJS.

Se você leu 1º LABootcamp e não faz ideia do que estou falando, clique aqui.

Lego time!

O ReactJS é uma biblioteca para criar interfaces de usuário, desenvolvida pelo Facebook para resolver problemas internos e disponibilizada como um projeto open source em meados de 2013.

Ele foi e é desenvolvido em três grandes pilares:

  • Ser declarativo;
  • Ser baseado em componentes;
  • Aprenda uma vez, use em qualquer lugar.

Toda a biblioteca foi construída para criar componentes reutilizáveis. Lá, é necessário definir pequenos componentes e agrupá-los para formar outros componentes (tipo um lego que você vai montando!!!).

É importante esclarecer que a finalidade do ReactJS é criar interfaces visuais, com funções e abstrações do JavaSscript (principalmente o conceito de state da biblioteca), para tratar elementos lógicos com facilidade.

E para criar uma aplicação completa é necessário usar outras bibliotecas em conjunto. Elas podem auxiliar em diferentes níveis, desde módulos de autenticação de usuários até conexão com banco de dados. Essas combinações são chamadas de ecossistema React.

Por que essa tecnologia?

Existem várias tecnologias que trabalham com a ideia de reutilizar código, como o Angular e o VueJS. Depois de pesquisar sobre cada uma, escolhi o ReactJS principalmente pela arquitetura, comunidade e o mercado de trabalho.

No GitHub, atualmente, o ReactJS possui mais de 144 mil estrelas e é utilizado por mais de 3 milhões de projeto abertos. Embora o Vue tenha 158 mil estrelas, ele é utilizado em pouco mais de 1 milhão de projetos.

O React também é mantido por um grande número de contribuidores — até o momento são mais de 1.300 — com atualizações diárias em seu código. Em relação ao mercado de trabalho, entre as empresas que a utilizam estão: Airbnb, Yahoo, NFL, Wix, Khan Academy, Facebook e outras startups.

E agora?

No começo enfrentei muitos problemas para conseguir estruturar e organizar o código das aplicações. Pois o React tem conceitos como o Syntax Extension to JavaScript (JSX), para mesclar o uso do HTML, CSS e JS em meio ao código. E isso pode causar um choque inicial para o desenvolvedor. Mas depois que você os compreende acaba adorando o fato deles existirem!

Para quem nunca utilizou a tecnologia, primeiro, sugiro estudar os pequenos conceitos inseridos nela. Para saber quais são os principais, recomendo ler o artigo do Robisson Oliveira e colocar a mão na massa em algum projeto simples (a documentação do React traz um exemplo bem maneiro).

Além disso, deixo alguns links que podem ajudar nesta jornada no mundo do ReactJS:

1. Site oficial

Nele você encontra informações sobre o histórico, documentação oficial, tutorial e também updates sobre a linguagem. Recomendo manter um olho nesse site.

2. Github

O repositório do projeto também é muito bom, lá você pode se comunicar com a comunidade que mantém a biblioteca, além de conhecer outros usuários que a utilizam no dia a dia. E é outro ótimo local para se manter atualizado sobre o que há de novo!

3. Material-UI

É outro projeto open source muito maneiro. Ele utiliza o ReactJS para implementar componentes do Material Design da Google, o que pode auxiliar muito durante o desenvolvimento e agilizar ainda mais na construção dos seus projetos.

4. Dev.to

A página do React lá concentra vários artigos maneiros feitos pela comunidade, desde debates até tutoriais. É uma ótima fonte de conhecimento.

5. Rocketseat

É uma plataforma que fornece diversos tutoriais de ReactJS que podem te ajudar muito, desde o nível básico até o avançado. Eles oferecem alguns cursos gratuitos e organizam eventos mensais em que um projeto é implementado do zero. É ótimo para aprender na prática!E o melhor: é totalmente em português.

6. React Brasil (Medium)

Outra grande fonte de conhecimento é a página do React Brasil aqui no Medium. Lá você vai encontrar assuntos variados que podem ajudar muito no dia a dia.

Se você você tem sugestões ou experiências com o ReactJS, compartilha com a gente nos comentários!

Até a próxima!

Feito em colaboração com a Amanda Dimes ;).

--

--