Omnistack Week 11: O que rolou?
O que foi abordado na última semana omnistack da Rocketseat
Sabemos que hoje em dia há uma abundância se tratando de materiais sobre desenvolvimento de software na internet. Porém, é muito fácil encontrar cursos, tutoriais e workshops que sofrem com conteúdo fraco e instrutores não tão preparados assim. Imagina quando encontramos um material de qualidade e ainda por cima, gratuito.
Pois é isso que é a Rocketseat vem propondo há muito tempo. Além da Semana Omnistack e dos seus bootcamps, eles possuem um riquíssimo canal no youtube, cobrindo os mais variados assuntos envolvendo Node.js, React e React Native. Fora isso, tratam dos mais diversos temas relacionados ao desenvolvimento de software.
A Semana Omnistack
Este é apenas um dos modos que a Rocketseat encontrou para disponibilizar material de qualidade para quem os acompanha. Apesar de ser um evento de lançamento para o seu principal produto, o bootcamp GoStack, é uma ótima maneira de ver como essas tecnologias se conversam, organizar os estudos e, claro, incrementar o seu portifolio.
A cada semana omnistack, durante 5 dias, são lançados 5 vídeos percorrendo o desenvolvimento de uma aplicação completa dentro da stack do Javascript. Backend, frontend e o aplicativo mobile são abordados de maneira simples e objetiva.
Desta vez, dos dias 25 a 28 de Março, a aplicação desenvolvida foi o Be the Hero, uma plataforma para unir ONGs que necessitam de apoio financeiro com pessoas que estejam dispostas a apoiar uma causa e salvar o dia. Você pode conferir a aplicação completa aqui.
Vamos ao que interessa!
Primeiro Dia
O primeiro dia da Semana Omnistack foi uma introdução a stack Node/React/React Native. Além disso, o Diego abordou conceitos de arquitetura de uma aplicação: o que é o backend, frontend e o aplicativo mobile, qual é o papel de cada um deles na arquitetura e como eles se conversam durante a execução de um sistema.
Além disso, foi o momento de configurar o ambiente para o desenvolvimento da aplicação. Criamos os repositórios no GitHub e iniciamos os projetos.
Segundo Dia
No segundo dia já colocamos a mão na massa! Iniciamos o desenvolvimento do backend da aplicação utilizando Node.js, disponibilizando uma API que cadastra e lista ONGs; e cadastra, lista e deleta incidentes que uma ONG possua.
Para o desenvolvimento dos serviços, foram usadas ferramentas já conhecidas por quem trabalha com node: express, nodemon, axios e cors.
O mais bacana disso tudo é que nesta semana omnistack tivemos a adição de mais uma ferramenta fantástica: o knex. Este carinha é responsável por gerenciar as migrations de bancos de dados! Além disso, ele é um sql query builder para Postgres, MSSQL, MySQL, MariaDB, SQLite3, Oracle, and Amazon Redshift, e a maneira como ele faz isso é uma sacada muito legal.
Para criarmos o nosso banco de dados sqlite3, foi necessário criar nosso arquivo de configuração, que é feito através do comando npx knex init
, para depois criarmos nossas migrations com o comando npx knex migrate:make <nome_da_migration>
.
Executamos o comando npx knex migrate:latest
e pronto, nossa tabela está criada!
Para inserirmos um registro na tabela ong
, basta incluirmos o trecho abaixo:
Para consultar o nome de uma ong através do deu id, é só executar:
Simples!
Com o nosso backend pronto, é hora de irmos para o terceiro dia da semana.
Terceiro Dia
Neste momento, iniciamos o desenvolvimento da aplicação frontend utilizando React. Assuntos como estados de componentes do React, hooks e componentização foram abordados. Além disso, vimos como comunicar nossa aplicação web com o backend, através da ferramenta axios.
Apesar de ser uma interface simples, foi interessante ver estes conceitos bem aplicados!
Quarto Dia
Dia de React Native! No quarto dia da semana omnistack, desenvolvemos o aplicativo mobile da plataforma. Através do app, o usuário pode ver incidentes abertos por todas as ongs, ver seus detalhes e entrar em contato com a ONG para poder ajudá-las.
O mais bacana desse dia foi ver a utilização da ferramenta Expo para criar o projeto. O Expo é um workflow completo para desenvolvimento de aplicações utilizando React Native. Ele permite que o desenvolvedor crie suas aplicações sem necessitar do XCode e Android Studio. Além disso, ele disponibiliza uma SDK para acesso a funcionalidades nativas do sistema, como câmera, geolocalização, etc. É muito completo!
Ainda, vimos como fazer a integração com outros apps, como o whatsapp, e envio de emails.
Um ponto legal aqui foi o uso da nova versão do react-navigation, a versão 5. Ela acrescenta muitas coisas bacanas, como uma nova API de temas e novos hooks!
Quinto Dia
Chegamos ao quinto e último dia. Aqui fizemos uma retrospectiva do que foi feito durante os quatro dias anteriores. Além disso, também foram abordados assuntos como validação de parâmetros no serviço e testes unitários e testes de integração.
Vimos como podemos usar a biblioteca celebrate, que encapsula a biblioteca de validação joi, para fazermos as validações dos parâmetros de entrada do nosso serviço!
E aí é só incluir o validador na configuração da rota do serviço e voila!
Para os testes da aplicação, o Diego nos mostrou como preparar o ambiente para os testes, incluindo configurar um banco de testes através do knex. Como ferramenta de testes, utilizamos o Jest e o Supertest.
Falando nisso, como é legal e simples usar o jest e o supertest para fazer nossos testes de integração, em conjunto com knex.
O Diego também teve a oportunidade de falar um pouco sobre deploy de aplicações na nuvem, como AWS, por exemplo. Aqui, deixo a recomendação de um vídeo do canal da rocketseat sobre deploy de aplicações node.js!
Participar da semana omnistack é interessante para ver como a stack javascript é poderosa ainda que simples e fácil de aplicar. O tamanho da comunidade javascript/node/react é gigantesca, e isso trás muitos benefícios para quem usa essas tecnologias. Participar das semanas omnistack é uma experiência enriquecedora para quem quer se aprofundar nessa stack de tecnologias!
Lembrando que o bootcamp GoStack está com inscrições abertas por tempo limitado.