O problema do React para quem iniciante

[TL;DR]: React por ser uma biblioteca permite que novos desenvolvedores desenvolvam hbitos ruins e terceirizem solues que seriam evitados caso utilizassem outras frameworks que definissem padres no desenvolvimento.

Disclaimer: Entrei recentemente na rea de desenvolvimento ento ainda estou aprendendo muita coisa e a opinio expressa no tem o intuito de condenar ou julgar, mas refletir e melhorar.

Nesses ltimos anos vem surgindo uma onda de pessoas interessadas em entrar na rea de programao muito por conta de um marketing abusivo j conhecido, mas tambm pela grande disponibilidade de tutoriais e cursos gratuitos ou com valores acessveis que estimulam o aprendizado. E quem decide ir para o desenvolvimento web, mais especificamente na rea frontend, recebem indicaes para iniciar com React por trs motivos:

1. fcil aprender j que necessita de um conhecimento bsico em Javascript
2. Tem uma grande comunidade, ento caso o aluno tenha algum problema geralmente encontra-se uma resposta fcil
3. Por ser uma biblioteca, a estrutura do cdigo simples e fcil compreenso

E nesse terceiro ponto que quero pegar pois toda essa facilidade no comeo faz com que o aluno deixe de aprender assuntos essenciais que ao lidar com projetos reais comeam a criar cdigos sujos ou com uma organizao mal estruturada.

Eu mesmo iniciei em React e mesmo concluindo vrios cursos e bootcamps e no primeiro projeto com desafios reais decorri com vrios problemas referentes a Design de sistema(System design) [no confundir com Sistema de design(Design system)] como nomenclaturas e estruturao e que nunca foi ensinado ou discutido sobre esses tpicos. No final do desenvolvimento por conta dessas questes me fez pensar que frontend no era para mim e explorei o outras reas no backend.

A imagem abaixo uma pequena ilustrao de como um projeto feito apenas em React (sem Next), nele esto inclusas chamadas de API, interfaces (tambm chamado de props), objetos em JSON alm de vrios componentes, porm difcil saber o escopo (para onde que aplicado) destes componentes, e mesmo levando em considerao que um projeto pequeno ser difcil dar manuteno e escalar, caso algum decida contribuir no cdigo tambm no ser intuitivo compreender

Meses depois surgiu a oportunidade de aprender Angular e minha impresso foi que o fato de ser uma framework e ter que seguir regras fez com que fosse necessrio compreender mais afundo algumas questes como:

• Gerenciamento de rotas
• Entender WebPack
• Separao de arquivos para cada funcionalidade (e no um arquivo que: mostra um texto, controla o estilo, lida com comunicao com o servidor, tudo isso junto)

A imagem abaixo seria de um projeto em Angular e calma! S quero destacar a questo de como esto organizadas as pastas e o projeto em si. Temos a pasta onde encontra-se todos os componentes, o app/, e dentro temos a pasta modules que responsvel por agrupar componentes essenciais (core), componentes utilizados em vrias partes (shared) e um mdulo para cada pgina, que seria a home(site.com/home) e timer(site.com/timer)
Assim se vejo que tem um erro no roteamento do Timer, sei exatamente onde que se encontra. Se eu quiser adicionar um outro mdulo como por exemplo o Contato(site.com/contact), basta criar uma nova pasta e no afetar em nada o restante do site, ento a chance do chamado efeito colateral quase 0

E sinto que caso eu ficasse apenas no React iria demorar para aprender e entender esses conceitos, claro que muito disso seria resolvido com o NextJS, j que a framework define regras e segue padres por conta da sua estrutura de diretrios e pginas tornando o projeto at mais fcil de ser escalvel, contudo, estaria apenas terceirizando essas decises j que quem lida com tudo isso no final das contas a prpria framework e deixando ao desenvolvedor somente criar componentes sem entender o que est por trs disso tudo. O que no seja algo necessariamente ruim j que permite ao desenvolvedor passar mais tempo programando, ainda assim problemas de otimizao podem surgir se mal explorado.

E por conta dessa cultura imediatista que veio a surgir, novos devs procuram obter conhecimento de maneira rpida passando por cima de conceitos bsicos, e por conta da simplicidade do React criao hbitos considerados ruins, no porque querem, mas sim por conta de orientao e estmulos (ou falta deles) a apenas criar mas no entender.

Assim acredito que uma melhor alternativa seria aps aprender Javascript manusear o DOM e entender como manipular os elementos da pgina e sua estilizao, para depois ento aprofundar esses conhecimentos testando e explorando frameworks e se possvel estudar junto conceitos que so necessrios para o mercado como: SOLID, Unit Test, TDD, System Design e tantos outros.

Lembrando que no em relao de se obter expertise sobre todos os assuntos mas ter uma noo geral e explorar aos poucos e revisar os conceitos j aprendidos, buscando aprender mais conforme for surgindo a necessidade e curiosidade.

-- Fontes:

• Filipe Deschamps - O que Clean Code
• Tecnospeed - O que Escalabilidade de software
• Geeks for Geeks - Getting started with System Design
• Jonatan Zylbersztejn - Sistemas de design e design de sistemas qual a diferena?