O que significa ser um desenvolvedor front-end em 2020 (e além)

Você já pensou sobre o que a parte front -end do desenvolvedor front-end realmente significa? Certa vez, perguntei a Eric Meyer (que cria sites há quase tanto tempo quanto existem sites) se ele sabia o que o termo significava nos primeiros dias, e ele disse que sim. Portanto, não é um título ou posição totalmente novo, mas certamente mudou de escopo ao longo dos anos.

​​"Front-end" significa essencialmente navegador da web. Eu me considero um desenvolvedor front-end e, honestamente, não odiaria se você me chamasse de desenvolvedor de navegador da web. Mas, isso provavelmente não vai pegar (e meio que parece que você constrói navegadores da web). Como desenvolvedor front-end, você trabalha muito de perto com navegadores da Web e escreve o código que roda neles, especificamente HTML, CSS, JavaScript e um punhado de outras linguagens que os navegadores da Web falam (por exemplo, formatos de mídia como SVG). Ou, talvez ainda mais comumente explicado, código que, em última análise, é processado nas linguagens que os navegadores entendem. Esse é o seu território como desenvolvedor front-end!

Os navegadores não existem sozinhos, eles são executados em uma ampla variedade de dispositivos. Aprendemos isso na era do design responsivo. E o mais importante: os usuários usam esses navegadores nesses dispositivos. Ninguém está mais próximo do usuário do que os desenvolvedores front-end. Assim, os desenvolvedores front-end escrevem código para pessoas que usam navegadores que rodam em uma ampla variedade de dispositivos.

Apenas lidar com esse enorme cenário de usuários, dispositivos e navegadores é um trabalho em si! Eu acho que não é todo dia que você pensa filosoficamente sobre seu cargo, e tudo bem; estamos apenas refletindo um pouco aqui com seu velho vovô Chris.

Se você acabou de se formar em um bootcamp de codificação e sua experiência na construção de sites é um pouco limitada e nova, você pode ser perdoado se pensar no desenvolvimento de front-end como “o material do React” e no desenvolvimento de back-end como “o Node coisas” ou “as coisas do Python”, como são os sabores mais quentes hoje em dia. Você também não está errado. React é geralmente usado como um framework front-end (é literalmente JavaScript que roda em navegadores). Node e Python são exemplos de linguagens que realmente não são executadas em navegadores da web; eles são construídos para rodar em servidores web (uhh, computadores).

Permaneça neste campo por um tempo, e você verá essas bibliotecas, linguagens, processos de construção e até mesmo filosofias inteiras sobre a melhor forma de construir sites vêm e vão como uma maré lenta.

Você pode testemunhar algum veterano acenando com o punho de vez em quando, gritando que devemos aprender com os erros do passado. Você também pode testemunhar alguns jovens particularmente barulhentos acenando com os punhos igualmente altos, pronunciando o passado como um contexto irrelevante e não mais um ponto de discussão útil.

Ambos estão certos, provavelmente. Contanto que ninguém esteja sendo desagradável, tudo faz parte do fluxo.

As coisas mudam. Acho que é verdade que muitos sites de hoje são mais complexos do que os sites do passado. Principalmente os grandes. As redes sociais e os media players. Os sites de reservas de viagens. As vitrines de comércio eletrônico. As ferramentas de engenharia. Esses sites começaram grandes e só ficaram maiores. Eles são economias em si mesmos com equipes enormes apoiando-os. Essa complexidade é uma causa de mudança na tecnologia da web e uma causa de atrito entre as novas e velhas escolas (se podemos pintar isso de forma simples).

Muitas pessoas que trabalham em tecnologia trabalham, essencialmente, para um grande site. E assim ouvimos essas pessoas com mais frequência. Essas pessoas constroem ferramentas. Eles escrevem posts em blogs, vão a podcasts, fazem palestras. Eles ajudam a mudar a própria tecnologia, para atender às suas necessidades.

O tempo todo, o “front-end” ainda é apenas o navegador. As linguagens dos navegadores, HTML, CSS e JavaScript ainda são as principais tecnologias em jogo. Essas linguagens evoluem, assim como os próprios navegadores, mas mais lentamente. Eles fazem exatamente o oposto do slogan favorito do Vale do Silício: mova-se rápido e quebre as coisas . Eles se movem lentamente e raramente quebram alguma coisa.

Ser um desenvolvedor front-end ainda é se importar com os usuários que usam esses navegadores nesses dispositivos. A experiência deles é o nosso trabalho. O ferramental apenas nos ajuda a fazer isso, espero.

Então, o que você está fazendo como desenvolvedor front-end?

• ​​Você está executando o design de forma que fique bem em qualquer tela
• Você está aplicando semântica ao conteúdo
• Você está construindo a interface do usuário de forma abstrata para poder reutilizar partes e estilos de forma eficiente
• Você está considerando a acessibilidade do que é renderizado no navegador
• ​​Você está preocupado com o desempenho do site, o que significa que você está lidando com o tamanho e quantos recursos estão sendo usados ​​pelo navegador.

Essas coisas sempre foram verdadeiras, e sempre serão, pois são fundamentalmente preocupações no nível do navegador e é isso que é front-end.

O que está mudando é que o navegador é capaz de trabalhar cada vez mais. Há todos os tipos de razões para isso, como APIs de navegador ficando mais capazes, bibliotecas ficando mais sofisticadas e computadores ficando melhores, em geral. Descarregar o trabalho do servidor para o navegador fez cada vez mais sentido ao longo dos anos (aplicativos de página única!). Embora seja interessante ver o pêndulo voltar (sites pré-renderizados!) e encontrar um meio termo (JAMstack!).

O desenvolvimento front-end nos dias de hoje também pode incluir:

• ​​Arquitetando todo o site, desde o menor componente até páginas inteiras até o nível da URL
• ​​Buscando seus próprios dados de APIs e manipulando os dados conforme necessário para exibição
• Lidar com o estado do site por conta própria
• ​​Mudando/alterando dados por meio da interação e entrada do usuário e persistindo esses dados no estado e de volta aos servidores por meio de APIs

​​Essas são todas as coisas que podem ser feitas no navegador agora, para os olhos arregalados desse antigo desenvolvedor. Isso é um monte de responsabilidade quando você considera que está no topo de todas as coisas que você já tem que fazer.

Embora esse monte de empregos tende a crescer ao longo dos anos, a luz orientadora que temos como desenvolvedores front-end não mudou muito. Nossa principal responsabilidade ainda é cuidar dos usuários que usam navegadores da Web em dispositivos. Então temos que buscar alguns dados. Isso é legal, estamos fazendo isso para construir uma página rápida, semântica e acessível para atender às necessidades de nossos usuários. Então, precisamos construir um sistema de design. Isso é legal, estamos fazendo isso para construir uma interface compreensível para nossos usuários, capaz de evoluir sem criar uma bagunça inconsistente. Então temos que aprender alguma nova tecnologia desconhecida. Bem, é nosso trabalho manter um olhar atento e garantir que a novidade esteja lá para melhorar nosso site para os usuários.

Boa sorte!

O que vem a seguir: Por que Chris Coyier escolhe o Local e o Flywheel para alimentar seus sites

Saiba como Chris usa o Local e o Flywheel para levar seus sites ao próximo nível. Veja quais são seus recursos favoritos, como ele confia no Flywheel para migrar seus sites (de graça!) e muito mais! Clique aqui para saber mais.