The latest articles on DEV Community by Paulo Reis (@preis_lab). https://dev.to/preis_lab https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F396642%2F93a593d1-884a-44b9-be5d-dac89f96d2d9.jpg https://dev.to/preis_lab en Paulo Reis Wed, 24 Jun 2020 14:44:20 +0000 https://dev.to/preis_lab/esqueca-reactjs-angularjs-ou-vuejs-na-verdade-voce-precisa-aprender-a-resolver-problemas-322g https://dev.to/preis_lab/esqueca-reactjs-angularjs-ou-vuejs-na-verdade-voce-precisa-aprender-a-resolver-problemas-322g <h1> Esqueça ReactJS, AngularJS ou VueJS. Na verdade você precisa aprender a resolver problemas </h1> <h2> Contextualização </h2> <p>Esses dias, cá estava eu zapeando o LinkedIn e vi muitas vagas de empresas nas quais pediam domínio em mais de 1 Framework Front-end, logo pensei “Será que essa empresa usa Microfrontends?”, “Será que estão migrando de tecnologia?”, porém eram muitas empresas, é impossível que tantas empresas queriam migrar de uma tecnologia que nem foi 100% adotada para outra semelhante. Cheguei a conclusão que não eles não queriam quem resolvesse problemas, mas quem dissesse que entendia muito, um “Guru” da tecnologia (ou alguém que se venda como tal).</p> <p>Junto dessa pandemia diversas pessoas perderam o emprego, outras mal tiveram a possibilidade de entrar no mercado, e hoje mais ainda que antes quem tem um currículo carregado de ferramentas diferentes está sendo mais bem visto do que quem é especialista em algo.</p> <blockquote> <p>- Então basta eu aprender todos os frameworks famosos, certo?!</p> <p>- NÃO!</p> </blockquote> <h2> ReactJS x AngularJS x VueJS, a guerra dos Frameworks </h2> <p>No geral, algumas pessoas me perguntam o motivo dessas tecnologias serem tão fragmentadas, na verdade nem é tanto, cada uma surge para resolver o problema que alguma outra deixou passar ou melhorar algo, e o mundo e muito (mas muito maior mesmo) do que apenas esse 3.</p> <blockquote> <p>- Mas não seria mais fácil todos focarem em uma só?</p> </blockquote> <p>Talvez, mas é sempre bom termos dois lados não acha?* A pluralidade do mundo é o que o torna mais belo.*</p> <blockquote> <p>- Então, qual eu devo focar?</p> </blockquote> <p>Ao me perguntar isso, eu tenho a resposta de bate e pronto, “No QUE você acha que deveria focar?”, eu sei que você passou 1 mês inteiro estudando Angular e quando chegou em uma entrevista falaram que precisavam de React, logo você foi estudar, pagou curso e ao chegar em outra entrevista disseram que usavam Angular, e aí? Vai passar mais 1 mês estudando isso?</p> <p>Na verdade o que você deve estudar, o que deve focar é em resolver um problema, mas como irá resolver um problema se você mal sabe se ele existe? Por que você está aprendendo a manusear um martelo se nem sabia que ele pode ser mais útil para remover um prego do que afunda-lo na parede?</p> <h2> Componentização </h2> <p>Lembra o dia que você resolveu estudar um outro Framework e apanhou mais que o Chaves apanhava pro seu madruga? Isso aconteceu porque você não entendeu o conceito daquilo, você não entendeu o que aquilo veio resolver, você está começando a usar a ferramenta antes de entender o contexto que aquilo se encaixa, se eu te der um martelo e pedir para assentar um piso pode dar muito errado se você não souber onde aquela ferramenta se encaixa no processo.</p> <blockquote> <p>Se mudar a cor da grama o burro passa fome</p> </blockquote> <p>Tenho certeza que você estudou HTML, CSS e conceitos básicos de JS antes de inciar os estudos nesses caras (se você não fez isso pare imediatamente e dê 3 passos para trás). Agora vou te dar uma dica de como descobrir o que vieram resolver.</p> <h2> Desafio </h2> <p>Agora vamos colocar a mão em código, mas caso não queira brincar um pouco com o que você pretende fazer pelo resto da vida, tenho péssimas notícias para você.</p> <ul> <li><p><strong>Passo 1</strong>: Entre no <a href="https://www.free-css.com/free-css-templates/page255/bizpage">https://www.free-css.com/free-css-templates</a>, baixe um tema bonitão e rode ele no seu computador e dê uma olhada no código dele. <br> Eu escolhi esse <a href="https://www.free-css.com/free-css-templates/page255/bizpage">https://www.free-css.com/free-css-templates/page255/bizpage</a></p></li> <li><p><strong>Passo 2</strong>: Invista de 1 à 2 horas nessa página colocando algumas fotos suas, descrição, coisas que gosta de fazer, seus hobby.</p></li> <li><p><strong>Passo 3</strong>: Se você escolheu um template semelhante ao meu, pegue o *carousel *e troque ele de posição com o *portfolio. *Marque o tempo que você levou para finalizar essa tarefa.</p></li> <li><p><strong>Passo 4</strong>: Legal, agora você pega os botões “ALL”, “ APP”, “CARD” e “WEB” e deixe eles com as bordas iguais o “CALL TO ACTION” e “Get Started”. Marque o tempo que você levou para finalizar essa tarefa.</p></li> <li><p><strong>Passo 5</strong>: Agora suba esse site no <a href="https://www.netlify.com">https://www.netlify.com</a> como portfólio, arrume um cliente e customize para ele, vai ganhar pelo menos 500 merreis para lojinha do bairro que você vender.</p></li> </ul> <p>Agora as coisas já começaram a demorar mais né? Não estou julgando, mas provavelmente seu código começou a ficar minimamente “estranho”, além de ficar tendo que subir, e descer o código a todo momento, esse foi um exercício bem simples.</p> <p>Imagine se você tivesse apenas 1 tipo de botão, e quando quisesse mudar ele em todo sistema você alteraria apenas 1 lugar, se quisesse alterar a posição dos blocos você apenas moveria 1 linha para baixo, ao invés desse tanto.</p> <p>Legal né? Isso é apenas 1 das N coisas que esses Frameworks vieram para resolver, então aí está o primeiro passo que você deve dar, passar a estudar o que aquilo vem resolver e depois de entender os conceitos e os problemas você irá “surfar” fácil entre um framework e outro, quando for em uma entrevista e você já dominar os conceitos independentemente da tecnologia adotada pela empresa você estará apto a absorvê-la em um piscar de olhos.</p> <p>Até a próxima!</p> javascript react vue angular