Desenvolvimento web é o termo utilizado para descrever o desenvolvimento de sites, ou seja, é o processo que envolve toda a criação de uma aplicação web. O profissional que atua nessa área é chamado de desenvolvedor web (você já deve ter ouvido esse termo), e é importante que você saiba que essa é uma das 3 profissões da área de tecnologia que mais vai gerar empregos até o ano de 2025.

Front-end

O front-end de uma aplicação web corresponde à parte visual da aplicação, aquela com a qual o usuário interage. Em outras palavras, o desenvolvedor web front-end é um profissional responsável por desenvolver os códigos que vão garantir uma interface consistente e responsiva (que seja adapte bem a diferentes dispositivos e resoluções), além de uma boa usabilidade das páginas web.

Aqui vale um destaque importante: de um modo geral, o desenvolvedor front-end não vai ser o responsável pelo trabalho de desenvolver a interface, pensar nas cores, espaçamento, posicionamento dos elementos das páginas, dentre outros aspectos de design e experiência de usuário (UX). É legal que um desenvolvedor front-end tenha conhecimentos de UI/UX design, porém, isso pode ser considerado um diferencial para ele.

Diante disso, o que um desenvolvedor front-end precisa dominar é a habilidade de utilizar linguagens/tecnologias web para criar páginas web a partir de um protótipo da aplicação que foi criado por um UI/UX designer em softwares como Figma e Adobe XD.

As linguagens básicas utilizadas no desenvolvimento front-end são:

• HTML: do inglês, HiperText Markup Language, é uma linguagem de marcação responsável por construir todo o "esqueleto" da página. Em outras palavras, com ela somos capazes de inserir os elementos na página, como botões, parágrafos, cabeçalhos, formulários, etc.
• CSS: do inglês, Cascading Style Sheets, trata-se de uma linguagem de estilização utilizada para trazer uma melhor aparência para as páginas web, ou seja, por meio dela conseguimos garantir uma interface mais agradável ao usuário.
• JavaScript: uma linguagem de programação responsável por promover recursos que melhoram a interação do usuário com a aplicação. Ela permite o site seja mais dinâmico, respondendo a ações realizadas pelo usuário. Por exemplo: ao selecionar uma opção diferente em um campo de filtro, os produtos listados são atualizados automaticamente; essa é uma ação executada pelo JavaScript.

O front-end também é conhecido como o client-side da aplicação web, tendo em vista que essa parte da aplicação é executada do lado do cliente, ou seja, no navegador (browser) do usuário. Quando você entra em uma site, você está solicitando o código (HTML, CSS e JavaScript) daquele site, então o seu navegador pede isso para um servidor (um computador que está de prontidão para responder a esses chamados na Internet), ele devolve esses códigos para o navegador e este último renderiza esse código (transforma ele no site que você vê).

Se você é aquele tipo de pessoa que gosta da parte mais visual, gosta de utilizar programação para criar interfaces gráficas, é mais minucioso(a) com a interface e com a experiência que as pessoas vão ter ao utilizar um sistema, então, muito provavelmente o front-end é para você! 😉

Back-end

O back-end representa as “engrenagens” da aplicação web, a parte que o usuário não vê, mas que garante que tudo vai funcionar como esperado. Nesse lado da aplicação teremos toda a lógica e regras de negócios da aplicação.

Para ficar mais claro, façamos uma analogia com um carro. No carro existe um indicador do nível da gasolina, certo? Esse indicador pode ser considerado uma parte do front-end do carro, uma vez que é a interface com a qual o usuário interage (ele consegue ver). Mas como esse indicador mostra o valor correto? Ele depende totalmente do bom funcionamento da lógica computacional e circuitos elétricos/mecânicos do carro, que correspondem, na nossa analogia, ao back-end do carro; não conseguimos ver toda essa lógica e circuitos, mas eles estão lá para entregar ao front-end o que é necessário, garantindo a consistência da aplicação.

Sendo assim, o desenvolvedor back-end será responsável por criar os códigos que irão garantir ao front-end os dados que ele precisa para renderizar as informações, garantindo segurança dessas informações e otimização no tempo de entrega. Por esse motivo, é importante que o desenvolvedor back-end tenha conhecimentos em bancos de dados, uma vez que ele vai estar buscando, inserindo, removendo ou atualizando esses dados a partir de requisições que são feitas pelo front-end.

Vejamos abaixo alguns exemplos de como o back-end funciona, suas responsabilidades, e como ele se relaciona com o front-end:

• Imagine que um usuário entre em um site de produtos. Nesse caso, para mostrar os produtos, ele precisa das informações sobre esse produtos para exibi-las corretamente na página. Para isso, ele solicita ao back-end, que busca essas informações no banco de dados, as estrutura corretamente e entrega ao front-end.
• Suponhamos que você esteja tentando fazer o login em um sistema. Quando você digita seu e-mail e senha, isso é enviado ao back-end, que valida se você está realmente cadastrado e se sua senha está correta. Caso sua senha esteja incorreta, a mensagem de erro customizada que aparece na sua tela veio do back-end e recebeu uma aparência melhor do lado do front-end para ser exibida para você.
• Por fim, imagine que você queira se cadastrar em um sistema. De um modo geral, não vai ser possível utilizar um e-mail que já está sendo utilizado em outra conta, certo? Isso é validado pelo back-end, que implementa em código essa regra de negócio, garantindo que os dados do banco estarão consistentes (e que não aconteça nada sem sentido na aplicação).

Agora que já entendemos o que corresponde ao back-end de uma aplicação web, quais são as linguagens de programação utilizadas nesta área? No back-end podem ser utilizadas diferentes linguagens, como JavaScript (ele de novo), PHP, Java, Python, Ruby, C#, dentre outras.

Em geral, essas linguagens serão utilizadas dentro de um framework (uma tecnologia desenvolvida com base em uma linguagem e que já contém várias bibliotecas, acelerando o nosso desenvolvimento). Os principais frameworks utilizados no back-end são: .NET (C#), Spring (Java), Node.js (JavaScript), Laravel (PHP), Django e Flask (Python).

Se você é aquela pessoa que gosta de trabalhar mais com a lógica de funcionamento do que com a interface de sistemas, gosta de pensar em otimização e complexidade de algoritmos, segurança de informação e manipulação de bancos de dados, muito provavelmente o back-end é para você!

Mas o que seria Full-Stack?

Os profissionais que trabalham com os dois lados do desenvolvimento web são chamados de Desenvolvedores Full-Stack. Normalmente, essas pessoas vão gostar mais de um dos lados, mas eles serão capazes de trabalhar em ambos e, portanto, podem ficar responsáveis pelo desenvolvimento da aplicação como um todo. É comum que se leve um tempo maior de estudo e experiência para se chegar nesse nível.

Conclusão

Espero que você tenha conseguido entender bem as diferenças entre o front-end e o back-end de uma aplicação web, assim como as responsabilidades e tecnologias utilizadas em cada uma dessas áreas. A grande questão é... Qual área você prefere? Front-end? Back-end? Ou ambas? 🤔

Até a próxima! 😁