New Level Week #1!
Rocketseat levando minha carreira para um outro nível.
Confesso que estava ansiosa pela NLW e, quando começou, vi que estava certa na empolgação. Fiz minha inscrição no nível iniciante e as aulas foram ministradas por Mayk Brito. Então, nem preciso dizer que são excelentes, não é?
Gosto demais da didática dele e sua forma tranquila de falar, além de que bom humor ajuda muito no processo de aprendizagem. E ele sempre antecipa minhas dúvidas! É muito bacana!
A proposta da week foi a realização desse site:
Eu decidi fazer modificações e criar o meu próprio, para tentar exercitar mais.
E como faço para acompanhar as aulas?
Optei pelo seguinte método: vou assistindo e, depois que entendi o que ele fez, volto pra ir fazendo junto. Então, a cada implementação, eu presto bastante atenção e depois volto o vídeo, alternando minha tela e a dele, fazendo tudinho junto. Quando sinto confiança, faço modificações que se enquadram melhor no que eu pensei para meu próprio projeto.
Primeiro dia:
O vídeo começa com uma rápida introdução sobre o que é programação e como iniciar na carreira de dev. Interessante que o Mayk fala para o aprendizado ser um processo constante, que demanda muito esforço e tranquilidade, por bem BEM longo. De fato, pensei bastante sobre isso: numa maratona, não adianta dar todo o seu máximo logo na largada. É um caminho longo, no qual a constância e a perseverança contam mais do que o entusiamo inicial e efêmero. Assuma um ritmo de estudo sustentável e mantenha seu foco em aprender.
Iniciamos o layout da página inicial e já gosto de trabalhar com CSS. São muitos nomes e detalhes, mas quando você pega a lógica da coisa, tudo fica mais claro.
A minha dificuldade foi porque resolvi fazer meu próprio projeto e isso implicou em buscar outra imagem para o background e conseguir fazer com sua localização na página ficasse como eu queria, sem que isso atrapalhasse os outros elementos (que eu quis seguir no projeto do Mayk).
Esse foi meu resultado do primeiro dia:
Segundo dia:
Fizemos o formulário de cadastro! Achei essa forma de estruturar o formulário a mais fácil que fiz até hoje e adorei. Vou ficar fazendo assim! Toda uma lógica de como as partes se integram, no CSS. Muito bacana!
Tem coisa mais legal do que fazer uma página responder de acordo com as regras que você coloca, seguindo seu raciocínio? Eu adoro essa parte e gosto muito de ver como o Mayk explica bem direitinho o caminho que ele pensou para chegar a um determinado resultado. O bacana é que ele sempre fala sobre outras possíveis soluções que você poderia implementar. Nesse vídeo, ele explica em 30 minutos conceitos básicos do JS, que são sempre interessantes de serem revisados. O mais legal de tudo foi inserir um menu de estados e cidades populado pela API do IBGE!
E qual foi a minha dificuldade hoje? Tudo ia acontecendo maravilhosamente até que, no último minuto, surge um erro no meu navegador. E, por mais que eu conferisse meu código com o do Mayk, eu não achava o que estava errado. Não entendia o motivo pelo qual o dele funcionava e o meu, não.
Fui no canal do Discord, para ver se o pessoal estava passando pela mesma coisa. Mas, não estavam. Os erros eram outros. Inclusive, pessoal do canal, vocês foram muito gente boa!
Depois de quase duas horas, resolvi pensar a respeito do erro que estava aparecendo para mim. Dizia linha 25 e eu já tinha até decorado o que estava escrito lá e foi quando eu pensei: “mas e as coisas que estão ligadas a isso aqui? E a parte do HTML?”. TCHARAM!!! E foi no HTML que achei um “s” a mais em uma palavra. Sim, apenas um “s”. Quando eu li da primeira vez, não percebi. Na segunda, também não. Enfim, uma hora eu resolvi ler letra por letra com o lápis e achei!
A sensação é complexa de se explicar. Se você já passou por algo semelhante (o que eu acho que sim), sabe do que estou falando. É alívio, raiva, alegria, incredulidade, tudo misturado! E, finalmente, o código rodou todo redondinho. Oh coisa linda!
Esse foi o resultado do segundo dia:
Terceiro dia:
Hoje foi o dia em que me apaixonei por um projeto:
Achei essa parte super fofa e tudo no projeto está ficando “no jeito”.
Neste terceiro dia, trabalhamos a ideia de modal para fazer a busca do usuário por pontos de coleta (no exemplo do Mayk) e de dança (no meu).
Criamos também a página de resposta à busca:
Resolvemos alguns bugs e o foco foi firme no CSS. Realmente, é muita coisa para assimilar. Ainda fico muito em “tentativa e erro”, mas as dicas do Mayk vão ajudando a colocar ordem na casa. Algumas coisas que fazia meio “no chute” começam a ficar mais claras e pensadas, o que torna todo processo bem mais rápido.
Acabei levando muito tempo para salvar os ícones e fazer adaptações para que ficassem do jeito que eu queria para a página.
Hoje, o dia foi puxado: segunda parte do formulário de cadastro (HTML, CSS e JS), modal de busca e página com a resposta da pesquisa realizada. UFA!
Minha maior dificuldade foi que, de alguma forma, minha página principal perdeu as configurações do CSS. “Do nada”, ficou com uma cor feia e sem as margens! Fui para cá e para lá diversas vezes e acabei usando o que o Mayk falou na parte da página de resultado para aplicar na principal. Eu sei que ficou confuso. Na hora, também foi confuso (risos).
Mas, horas depois, é uma alegria ver tudo funcionando tão direitinho.
Quarto dia:
Descobri que confio no Mayk Brito de olhos fechados! Hoje foi o dia em que refatoramos o códigos com template engine. Foi preciso muita confiança para sair “apagando” todo aquele código (tantas horas de trabalho) e substituindo tudo. Deu um gelado! Mas, o resultado é um código mais dinâmico e organizado. Gostei muito da ideia de criação de layouts.
Criamos o servidor e colocamos para funcionar. São comandos simples, mas que achei melhor anotar (eu tenho uma caderneta para essas coisas).
Foram quase duas horas de vídeo que resultaram em quatro horas de trabalho e estudo para mim. Passaram que eu nem senti. Realmente, é bastante informação e ainda bem que tudo vai se conectando e fazendo sentido.
Mas, eu devo confessar que a parte mais importante para mim foi dita no começo e me ajudou de uma forma que não vou conseguir explicar. Ele disse que, no começo, é normal ter a sensação de que “estou apenas copiando e colando”:
A aula não é feita para te ensinar, é feita para você entender!
O aprendizado, o “agora eu sei fazer isso sozinho” vai depender das suas horas de estudo e tentar fazer isso da aula outras vezes. O tempo e a prática te fazem entender tudo melhor.
Para quem é iniciante, essas palavras fazem todo sentido.
Quinto dia:
Esse dia chegou rápido e já trazendo saudade! O foco deste dia foi bem em banco de dados e eu adorei porque tenho muita curiosidade sobre o assunto. Usamos o SQLite, por sua facilidade para os mais iniciantes.
Aprendi como criar uma tabela, inserir, consultar e deletar dados. Muito bacana! Eu achava que seria algo super complexo, mas com poucas linhas de código (pelo menos no SQLite), você consegue fazer tudo. E o melhor é que os comandos são textos bem autoexplicativos. Exportamos o objeto que opera o banco de dados para ficar disponível em outra parte da aplicação.
A melhor parte de todos os tempos: trabalhar com dados dinâmicos e ver a página mudando “sozinha”. Olha, quando eu atualizei a página e ela mudou dinamicamente com os dados que estão no BD, não consegui ficar na cadeira e tive que comemorar! E quando adicionei dados ao banco através do formulário de cadastro? Pura festa!
Agradeço demais ao Mayk Brito e Rocketseat! A NLW foi incrível e me levou a outra galáxia. Já penso novas funcionalidades para o projeto e como levar isso adiante.
Fiquei bem feliz com o resultado! Aceito críticas, sugestões, comentários… :
