20 tópicos que todo desenvolvedor Front-end deveria saber

O desenvolvedor front-end está em alta no mercado, mas para se dar bem na área [e preciso estar sempre atualizado. Confira 20 Tópicos que você DEVE (...)

Autor: Otávio Augusto

Não existe fórmula secreta para o sucesso, porém, olhando para os padrões de cases de carreiras bem sucedidas, podemos verificar várias similaridades e pequenas ações que levaram àquele acontecimento.
Isso não é diferente na vida de desenvolvedores. A escolha das linguagens, frameworks, ferramentas e etc, podem ser cruciais no desenvolvimento ou retrocesso profissional do desenvolvedor.
Pensando nisso, resolvi criar uma lista de 20 tópicos que todo bom desenvolvedor Front-end deve dominar, utilizar ou saber, para possa crescer profissionalmente e se diferenciar em meio a tantos outros.
Vamos lá? 🙂

>> Leitura recomendada:
Linha do tempo do Front-end

1. HTML5

A principal linguagem de marcação para desenvolvimento web, o HTML5, vai muito além de <div>s. Tendo um leque de tags, o HTML5 dá à página diversas funcionalidades nativas, como por exemplo, a de manipulação de conteúdos gráficos e multimídia, através das tags:
 
<video>, <audio>, <canvas>
 
Ou de estruturação de conteúdo, com as tags:
 
<main>, <section>, <article>, <header>, <footer>, <aside>, <nav>,<figure>
 
O desenvolvedor Front-end deve saber e utilizar essas tags no momento propício, pois o seu uso impacta diretamente no SEO (Search Engine Optimization), acessibilidade e legibilidade da sua aplicação.
>> Leitura recomendada:
Guia do HTML 5.

2. CSS3

Somente com HTML a missão de se reproduzir os protótipos do design para uma aplicação real seria praticamente impossível ou insustentável. Saber CSS3 é essencial para se criar aplicações responsivas, além de separar a responsabilidade do desenvolvimento do layout para uma linguagem específica para isso.
Todo desenvolvedor Front-end deve saber manipular Flexbox, Grid System, pequenas animações com Keyframes, e também uso de classes e paradigmas de organização de código como BEM.
 
>>Leitura recomendada:
Guia do CSS3.

3. JavaScript (ES6)

Atualmente o Javascript é uma das linguagens mais utilizadas no mundo, e no Front-end ela reina absoluta. Com versões do Ecmascript cada vez mais poderosas e funcionais, é de suma importância a masterização da linguagem por qualquer desenvolvedor Front-end.
Aprender conceitos básicos como condições e loops é indispensável. Ter conhecimentos de imutabilidade, programação funcional, closures, parâmetros defaults, template literals, utilização de let e const, funções de manipulação de array, destructuring, funções assíncronas, entre outros também.
 
>> Leitura recomendada:
Guia do JavaScript.
 

4. Framework e Libraries

Já sabemos que ter um conhecimento sólido de JavaScript é essencial e indispensável para qualquer um que queira se tornar um bom desenvolvedor Front-end. No entanto “somente” isso ainda não é o suficiente.
O desenvolvedor Front-end que quer entrar com tudo no mercado deve aprender e masterizar ao menos um framework ou library de mercado. Como por exemplo os mais famosos e utilizados nos dias de hoje: React, Angular ou Vue.
PS: Não irei discorrer sobre qual framework deve ou não ser utilizado, pois isso geraria um artigo. Porém, saiba que é ao menos um framework você deve saber.
É óbvio que existem algumas divergências em relação à qual framework ou library abre mais portas no mercado de trabalho. Até que você se decida, aqui vai algumas das Vagas para Desenvolvedores na plataforma da GeekHunter:
> Vagas React
> Vagas Angular 2
> Vagas Angular 7
> Vagas Vue.js
> Vagas Javascript
Se você curtir alguma, basta criar um perfil e começar a receber propostas nas tecnologias de sua escolha. 
>>Leitura recomendada:
React vs Vue vs Angular: qual escolher?

5. Versionamento

Todo bom desenvolvedor, independente de ser Front-end ou não, deve saber utilizar ferramentas de versionamento de código, assim como os seus conceitos. Hoje, o melhor e mais famoso software feito de tal forma é o Git.

6. UX/UI (User Experience/User Interface)

Seu produto pode possuir todas as funcionalidades funcionando perfeitamente, sem erros ou geração de bugs, porém, caso ele gere uma má experiência ao usuário no momento de sua utilização ele pode estar fadado ao fracasso.
O desenvolvedor Front-end deve saber criar aplicações que sejam fluidas, que possuam interfaces gráficas amigáveis ao usuário e que em sua totalidade respeitem as heurísticas de Nielsen.

7. Debug

Ao se deparar com a criação de uma nova funcionalidade ou correção de um bug, ter conhecimento sobre o ambiente de desenvolvimento, pode salvar horas de trabalho ao desenvolvedor.
Logo, um bom desenvolvedor Front-end, deve e precisa estar antenado sobre as funcionalidades de debug que o seu navegador padrão possui.
Por exemplo, o Google Chrome possui o DevTools, onde o desenvolvedor pode verificar os elementos e tags utilizados em sua aplicação, o seu tempo de renderização, informações em cache, aplicar e verificar mudanças de CSS, visualizar respostas das chamadas HTTP e muito mais.
 
>>Aprenda mais em:
Chrome DevTools

8. Acessibilidade

Independente do problema que uma aplicação venha a solucionar, a aplicação deve possuir funcionalidades acessíveis aos mais diversos usuários, assim como usuários PCD (Pessoas com Deficiência).
É de suma importância que o desenvolvedor Front-end possua os conhecimentos teóricos e habilidades técnicas para aplicar tais conceitos em suas aplicações e funcionalidades.
 
>> Leitura recomendada:
Acessibilidade no Web Design

9. SEO (Search Engine Optimization)

De nada adianta desenvolver um super produto e o mesmo não é achado pelas mais famosas ferramentas de busca, certo?
Ter conhecimentos básicos de Search Engine Optimization, são essenciais para um desenvolvedor Front-end. Aplicando tais conhecimentos, a aplicação poderá ser localizada mais facilmente e o crescimento orgânico irá ocorrer de maneira exponencial.
>>Leitura recomendada:
6 maneiras que os Desenvolvedores podem aprender SEO

10. Responsividade e Cross Browser

Atualmente existem diversas formas de se acessar a mesma aplicação web, por meio de diferentes aparelhos, como computadores desktop, tablets ou dispositivos móveis.
Logo, a aplicação necessita ser responsiva a diferentes tamanhos de telas. Além de diferentes aparelhos, a mesma aplicação pode ser acessada por diferentes navegadores web.

Portanto, toda e qualquer aplicação web deve ser testada em diferentes navegadores durante o processo de desenvolvimento.

O desenvolvedor Front-end precisa ter em mente esses conceitos, assim como utilizá-los. Nenhum usuário quer ter uma péssima experiência ao trocar de aparelho, certo?
 
>>Aprenda mais em:
Introdução ao Web Design responsivo
 

>>Leitura recomendada:
Cross Browser Testing

11. Testes

Todo desenvolvedor que conheço que começou a utilizar testes dentro do seu processo de desenvolvimento fala que não quer “largar mão” de utilizar testes nunca mais. As incontáveis horas de trabalho salvas pelo simples fato de se utilizar testes, são imensuráveis.
O poder de se modificar uma parte da aplicação e de se dar conta que algo errado aconteceu no mesmo momento, e outra parte da aplicação parou de funcionar, é imensa.
Ter noções de aplicação de testes com Jest, Enzyme, Chai, e outros. É essencial para um bom desenvolvedor Front-end. Existem empresas que só contratam desenvolvedores que sabem utilizar alguma ferramenta de testes.
 
>>Aprenda mais em:
Testing Tools

12. Code Readability

A arte de codificar não é meramente e puramente feita para que um computador possa executar o código, creio que exista vários aspectos humanos no processo e, caso seja deixada de lado, diversos problemas acabam nascendo.
O custo de se ter uma base de código ilegível é altíssima.
Imagine a seguinte situação: uma equipe ou um programador específico sai do seu time, aquela joia rara que sabia “de ponta à ponta” como o projeto funcionava.
Porém, ao se contratar uma equipe nova ou uma pessoa especifica, os mesmos não conseguem entender absolutamente nada do que se trata o projeto, fazendo com que se cogite a ideia de se desenvolver do zero uma aplicação nova, ao ter que olhar um código tão mal feito.
Pois bem, esse é o poder que um código mal escrito pode gerar dentro de uma equipe. Um bom desenvolvedor Front-end, além de escrever código para solucionar um problema, ele deve escrever código que possa ser entendido pelos seus colegas de trabalho e futuras pessoas que poderão utilizá-lo.
 
>> Leitura recomendada:
Livro — Código Limpo

13. Refactoring

Várias vezes já li e escutei coisas do tipo:
Código funcionando não deve ser tocado.
E creio que esse caminho não deve ser seguido às cegas. Todo código pode ser melhorado e, portanto, pode ser refatorado.
Se não fosse por isso, empresas como Google e Facebook não gastariam milhares de dólares todos os anos, refatorando e troca de base de código, pois viram que seus códigos poderiam ser melhores.
Um bom desenvolvedor Front-end deve saber e verificar o momento no qual uma refatoração deve acontecer.
 
>>Leitura recomendada:
Blog Refactoring

14. Aprimore suas Soft Skills

Independente da profissão ou do trabalho a ser feito, aprimorar soft skills deve ser tratado como um “must do it”. Comunicação, motivação, liderança, trabalho em equipe, inteligência emocional, negociação e outros. São itens que podem ser aprendidos e “masterizados” também.
Um desenvolvedor Front-end que não consegue se comunicar com o seu colega de Design, ou que não sabe negociar com o seu gestor sobre a implantação de uma funcionalidade, terá problemas no decorrer da sua carreira.
 
>>Leitura recomendada:
Livro — Soft Skills: The Software Developer’s Life Manual

15. Comunidades de desenvolvimento e Open Source

Fique próximo das comunidades de desenvolvimento, independente da linguagem sempre há um grupo de pessoas se reunindo para falar sobre os melhores padrões, boas práticas, tecnologias e funcionalidades novas a acerca do ambiente de desenvolvimento de uma linguagem ou framework.
Logo, há conhecimento sendo gerado e compartilhado por diversas pessoas. Então além de se aprender algo novo, você pode tirar dúvidas, criar amizades e fazer networking ao se aproximar dessas comunidades.
E em relação à Open Source: é outro tópico que poderia ser feito um artigo somente para ele, mas podemos ver o poder dele por meio de diversos produtos magníficos feitos com a ajuda mútua de diferentes desenvolvedores ao redor do mundo.
Utilizando plataformas como o Github, aplicações, bibliotecas, frameworks e outros, são mantidas dia após dia, com PRs (Pull requests) e criações de Issues.
Um bom desenvolvedor Front-end, precisa fugir da sua bolha e ficar próximo tanto das comunidades, quanto do open source. Fazendo com que ele fique aberto a novos conhecimentos e práticas.
 
>>Comunidade recomendada:
Slack do React Brasil

16. Aprenda e utilize Metodologias Ágeis

Atualmente, qualquer empresa que não utilize um paradigma ágil em seu processo, pode está destinada a desenvolver algo que nunca vai ser utilizado, algo que não atenda as demandas do usuário ou que contenha inúmeros erros técnicos.
Entender as boas práticas que o XP (eXtreme Programming) trás para um time de desenvolvimento, ou a revolução que o Scrum implementa no processo em cascata, é essencial para o desenvolvedor Front-end.
 
>>Leitura recomendada:
Manifesto Ágil

17. Escreva sobre o que aprendeu

Compartilhe os seus acertos, mas não se esqueça dos seus erros.
Um bom desenvolvedor Front-end, está sempre ligado nas tendências e mudanças no ambiente, portanto está a todo momento consumindo conteúdos para se manter informado.
Porém, com tanta informação sendo processada, vários insights são gerados que podem ser úteis para outros. Ou seja, escreva! Compartilhe essa informação com os seus colegas e comunidade.

18. Saiba como o Back-end funciona

Ter os conhecimentos técnicos necessários para realizar o seu trabalho dentro do Front-end, são essenciais, Ok, já sabemos disso. Mas imagine a seguinte situação: Você precisa confirmar alguns dados no banco de dados antes de começar a implementar uma nova funcionalidade, ou fazer uma pequena refatoração na API para dar continuamento ao desenvolvimento da sua funcionalidade.
Em todas essas situações, conhecimentos no “Back-end” seriam necessários, e você desenvolvedor Front-end iria simplesmente parar o seu colega do Back-end para focar nisso? A resposta correta é “não”.
Saber realizar pequenas chamadas ao banco, entender como back-end funciona, seu fluxo de dados ou fazer deploy de uma aplicação. São conhecimentos extremamente válidos e úteis.
 
>> Leitura recomendada:
Um front-end deveria aprender back-end?

 
>> Leitura recomendada:
Como começar em Back-end do 0?

19. Lifelong Learning

Esse é outro tópico que, independente de ser Front-end ou Back-end, ele é uma verdade absoluta para ambas as áreas.
Tecnologia da informação é um dos ramos de conhecimento humano que mais evoluiu nos últimos 50 anos. Logo, entender que o você aprendeu hoje, daqui a pouquíssimo tempo pode ser deixado pra trás e dará lugar a uma nova tecnologia.
Um bom desenvolvedor precisa entender que ele terá que aprender a aprender, e de maneira rápida durante a sua carreira, ou será deixado para trás com tecnologias legadas.
 
>> Leitura recomendada:
Life Long Learning

20.Faça um portfólio ou blog

Como o Front-end é algo bastante acessível ao usuário final, ter uma página na internet contendo tudo aquilo que você já fez ou sabe, não é um grande desafio.
Portanto, crie uma página na web com tudo o que aprendeu e apresente seus projetos, ideias, tecnologias, diga o que tem aprendido no decorrer da sua carreira. É através dessa página que você poderá contar ao mundo o que tem feito e o que ainda quer fazer, além de ser uma ótima maneira de mostrar todo seu talento.
Como falei no início do artigo, não existe fórmula secreta para o sucesso e isso pode ser refletido a essa lista. Existem desenvolvedores incríveis que não fazem ou não masterizam um ou mais tópicos dessa lista, mas mesmo assim são excepcionais em sua profissão.
Otávio Augusto é Desenvolvedor Front-end na GeekHunter.

Deixe o seu comentário!

Não perca nenhum post!