Dicas e recursos para o freeCodecamp Beta
Recentemente terminei o freeCodecamp beta, vou reunir nesse post algumas dicas sobre a plataforma e alguns recursos que me foram úteis. A stack não mudou com o beta, então mesmo que você esteja fazendo a versão tradicional esse post ainda pode ser relevante.
O que é o freeCodecamp?
O freeCodecamp é uma ONG americana que provê um meio grátis e de altíssima qualidade pra qualquer um que queira aprender a programar e/ou entrar no mercado de trabalho. Um curso tradicional (seja ele online como Edx ou presencial como uma faculdade) geralmente requer que você tenha uma presença mínima nas aulas, faça exercícios, provas, entre outras características básicas de qualquer instituição de ensino. O que me atraiu ao freeCodecamp é que eles funcionam de uma forma muito mais livre, você pode estudar da forma que quiser, quando quiser, e a única coisa que você deve fazer pra ter os certificados é completar os projetos. Não há um tempo mínimo arbitrário ou algum método de ensino obrigatório, você só precisa conseguir entregar o código funcionando. Para uma introdução mais completa ao freeCodecamp, você pode ler esse post do William Oliveira sobre o curso e a plataforma.
Ano passado foi anunciado que o freeCodecamp estava em beta, então atualmente há duas versões, mas a única coisa que você precisa se preocupar como aluno(a) são os projetos, leia um pouco sobre os projetos tradicionais e sobre os projetos da versão beta e escolha a que mais te interessar.
Antes de começar
Apesar de ser uma excelente plataforma, se você ainda não está muito confiante nos conceitos básicos de programação talvez o freeCodecamp vá te confundir mais do que ajudar, uma das reclamações mais frequentes nos fóruns são de estudantes que não sabem pra onde ir, a dificuldade dos projetos aumenta exponencialmente mas nem sempre há um preparo adequado por parte da plataforma, então é bem fácil se frustrar se você não está acostumado(a) com programação como uma disciplina. Vale notar que aprendizado é algo extremamente complexo e particular de cada um, talvez o freeCodecamp caiba como uma luva pra você e não te dê problema algum, só é possível descobrir isso tentando.
Se você quer ter uma base de programação (e até mesmo desenvolvimento web) um dos melhores cursos que já fiz na vida é o CS50, é um curso grátis de Harvard (com legendas em PT-BR) que cobre tudo que qualquer iniciante pode querer da vida e mais um pouco. Sério, é muito bom. É bem longo mas não é tedioso, recomendo com a força de mil sóis. Você pode também procurar por outras alternativas, o importante é você ter a consciência de que se você se sentir perdido(a) e sobrecarregado(a), isso é uma falha do freeCodecamp e não sua, você só precisa de uma base de conhecimento adequada, seja ela qual for.
Responsive web design
A partir daqui todo o conteúdo do post parte do pressuposto que os testes do freeCodecamp Beta (que são basicamente uma prova que você pode incorporar ao seu projeto e ir cumprindo os requerimentos conforme trabalha) estão sendo ignorados. Eles podem ser adicionados e preenchidos a qualquer momento posterior, eu recomendo que você não faça os testes, ao menos pela primeira vez em que faz seus projetos. Eles são extremamente restritivos do ponto de vista técnico e criativo, e o processo de erro e experimentação é extremamente importante pro aprendizado. Faça o projeto como se não houvesse amanhã, foque em fazer um bom trabalho e depois ajuste os testes, não leva mais do que 5 minutos e você vai ter uma experiência muito mais rica caso não se limite pelos requerimentos. Para uma justificativa mais extensa você pode ler minha resenha completa, onde falo mais sobre isso.
Neste certificado você vai basicamente usar CSS e HTML para criar páginas Web, há um grande foco em criar páginas responsivas e Javascript não é um requerimento nesse ponto. São projetos curtos e sem muitas surpresas, a única coisa que eu recomendo fazer nesse certificado é se preocupar com aquele conhecimento que você tinha mas não tinha, sabe? Seletores de CSS, tags HTML5, teoria das cores e todas essas coisas que sempre são deixadas pra depois. Como esses projetos são simples, é uma ótima oportunidade pra cobrir essas questões.
Recursos úteis para estes projetos:
- CSSReference
- HTMLReference
- Ferramenta pra paleta de cores
- HTML e CSS avançado
- HTML & CSS tutorial
- Entendendo box-size
- Centralizando elementos em CSS
- Tutorial interativo pra Flexbox
- Teoria das cores para programadores
- Teoria das cores básica
- Interpretador de Regex online
Javascript data structures and algorithms
Enquanto não há nada que eu removeria desse currículo, há muito que poderia ser adicionado. Diferente das outras áreas, não há nenhum projeto de médio ou até mesmo pequeno porte sendo exigido de você, todos os exercícios são só exercícios, como na escola.
Outro grande problema é que o nome do currículo vende a ideia de que você aprenderá “estruturas de dados e algoritmos”, quando na verdade isso não é exigido pelo curso. Acaba sendo um curso pra treinar javascript, o problema é que os projetos de React já fazem um trabalho muito melhor em te tornar proficiente em JS, eles naturalmente exigem mais de você de uma forma significativa pela natureza do React, enquanto os exercícios daqui muitas vezes pedem pra você não usar métodos ES6, senão a resolução se torna muito fácil. De todas as áreas do Freecodecamp, essa foi a única que me passou a sensação de obrigação e não de aprendizado.
Atualmente essa é a área mais fraca do freeCodecamp, caso queira aprender sobre algoritmos e estrutura de dados, recomendo o curso How to code do EDX, ele é um curso de arquitetura de software que acaba ensinando estrutura de dados e algoritmos também. Se quiser se aprofundar em algoritmos, o livro mais intuitivo que encontrei foi o Algorithm design manual, infelizmente é pago, mas livros de algoritmo geralmente são escritos de uma forma bem difícil de entender e costumam exigir um certo domínio de matemática, esse livro além de ser super acessível ele conscientemente não exige matemática.
Front end libraries
Aqui é onde a primeira grande dificuldade aparece. React é uma ótima biblioteca pra aprendizado porque exige que você saiba bastante sobre javascript, principalmente sobre como o escopo funciona e como você pode manipular esse escopo. Muitas vezes a dificuldade em aprender React vem de uma necessidade de se aprofundar em javascript, então caso esteja se sentindo muito perdido(a), talvez seja uma boa pausar o freeCodecamp e procurar recursos especializados em javascript. Aqui também é também uma ótima oportunidade para treinar ES6, já que quase tudo em React é convencionado para ES6.
Eu fiz os projetos em React + Redux (o curso não exige que você use Redux, mas recomendo experimentar), e posso dizer sem sombra de dúvidas que a documentação do Redux foi feita por lúcifer reincarnado, se você não conseguir entender aquilo, relaxa. Depois de aprender Redux a sensação que eu tive foi de que se eu tivesse simplesmente tentado fazer engenharia reversa teria sido mais simples que seguir as instruções da documentação.
É uma opinião subjetiva (não de que lúcifer manualmente escreveu a documentação de Redux, isso eu tenho certeza, mas de que ela é uma má fonte de aprendizado), então recomendo que você ao menos tente ler um pouco da documentação deles, talvez funcione pra você, pra mim foi pior que falar grego.
Esse ponto do freeCodecamp também é uma ótima oportunidade pra passar a montar os projetos no seu computador e deixar de usar o Codepen, nos recursos abaixo indico alguns tutorials de webpack que podem ser úteis caso decida fazer projetos locais. É inteiramente possível fazer os projetos no Codepen, mas recomendo que tente montar no seu próprio computador, essa experiência é essencial profissionalmente e ter os arquivos no seu computador te permite usar o GitHub (o que também é essencial profissionalmente).
Recursos úteis para estes projetos:
- Diversas APIs
- Referência ES6
- Explicação intuitiva sobre Redux
- Redux tutorial
- Excelente tutorial passo-a-passo de React
- Webpack para iniciantes
- Excelente série de vídeos passo-a-passo sobre Webpack
- Quando usar webpack e porquê?
Data visualization
D3.js é complexo de aprender em um nível equivalente ao Redux, ambas documentações não são muito amigáveis (apesar de que a do D3 é bem mais sã), porém D3 é só uma questão de você entender como o fluxo de desenvolvimento funciona. É difícil explicar, mas abra 2 ou 3 projetos em D3.js, eles seguem um padrão muito específico, é porque tudo em d3 segue esse padrão (ao menos tudo que eu fiz). Ao entender como o D3 funciona você meio que só precisa repetir esse padrão de acordo com os dados recebidos e a forma de renderização. Parece complexo com todas essas palavras bonitas, mas é como aprender Bhaskara, depois que você aprende é só aplicar o conhecimento.
Não tenho muitos recursos memoráveis pra D3.js, a maioria das explicações que encontrei online foram extremamente confusas e o que eu fiz foi basicamente ir lendo de fonte diferente em fonte diferente até as coisas começarem a fazer sentido. O livro do Scott Murray (Livro grátis, link abaixo) foi bem esclarecedor, mas ainda assim só por eu já ter visto o mesmo conceito mil vezes por mil fontes diferentes. D3 usa uma forma pouco convencional de fazer as coisas, então eu acho que é natural ser difícil tanto de explicar como entender, mas se você tiver perdido(a), saiba que é normal mesmo!
Recursos úteis para estes projetos:
APIs and Microservices
Aqui começam os projetos de back end, esses primeiros 5 projetos são extremamente simples e parecidos, se você fizer 1 é bem provável que consiga terminar os outros 4 em pouquíssimo tempo, o que é bem desapontador. Vale notar que a maioria dos projetos aqui não faz uso de Mongo, você simplesmente recebe um request, processa e retorna. Não há armazenamento.
Como é aqui onde o freeCodecamp te introduz ao Mongo (por textos auxiliares) eu fiz a suposição de que Mongo seria necessário em todos projetos e perdi bastante tempo nessa suposição. Caso se encontre em situação parecida, só pare pra pensar se o seu projeto realmente precisa armazenar algo no servidor.
Nos recursos eu menciono o mLab, vale notar que ele só se torna necessário em plataformas como Heroku e Glitch, que apesar de oferecerem uma plataforma pro seu código, eles não oferecem serviço de banco de dados. Se você vai fazer o projeto no seu computador, não precisa se preocupar com mLab e ferramentas similares.
Recursos úteis para estes projetos:
- Serviço pra hostear mongodb grátis até 500MB
- Tutorial básico de Node + EJS + Mongo
- mongoose: Referencing schema in properties or arrays
- Entendendo Async
- Livro curto sobre Node
Information security and quality assurance
Esses projetos são em sua maioria o que o certificado anterior deveria ter sido. Diversas aplicações CRUD, diversas APIs RESTful e basicamente um certificado pra treinar Mongo. Não tem muita surpresa aqui, as medidas de segurança infelizmente se resumem a importar e configurar o helmet.js, de resto é só um treinamento de Node e Mongo com projetos um pouco mais longos que o do certificado anterior. Não me entenda mal, é um ótimo treinamento pra Node e APIs RESTful, só acaba pecando em conceitos de segurança da informação.
Algo importante desses projetos é que eles frequentemente te levam ao Callback hell, se você estiver em uma situação onde você precisa fazer uma consulta ao banco, usar essa resposta pra fazer outra consulta, e ficar nesse círculo que torna o código ilegível, é só usar alguma biblioteca pra te ajudar com isso. Eu usei Async/waterfall, mas há diversos outros métodos pra resolver essa situação (inclusive sem biblioteca externa alguma), o importante é notar que existe e evitar que aconteça.
Recursos úteis para estes projetos:
- O que é RESTful?
- Biblioteca pra lidar com Async requests
- Visualização rápida do que é callback hell
- Evitando callback hell em node.js
Conclusão
Apesar de alguns aspectos negativos, freeCodecamp é uma excelente plataforma e é até um pouco inacreditável que seja grátis, a qualidade do material (e até mesmo da comunidade) que você tem acesso é incrível, poucos cursos pagos podem te oferecer um portfólio tão extenso e exigente ao seu término. Apesar da versão Beta ter algumas coisas um pouco confusas e as vezes até mesmo quebradas, ainda me parece objetivamente superior a tradicional, já que há uma melhor divisão do que cada certificado te ensina, você como aluno(a) pode focar em aprender uma tecnologia de cada vez, sem se sobrecarregar com diversos conceitos ao mesmo tempo. Além disso, os textos auxiliares são muito bem escritos.
