Uma divisão clássica entre quem trabalha com desenvolvimento web é entre Front-end e Back-end. De maneira simplista, a distinção entre eles pode ser explicada assim:

Front-end é aquilo que você vê e com o que você interage, ou seja, é a interface gráfica.
Back-end é o contrarregra por trás dessa interface, que trabalha do lado do servidor.

Agora, entrando em detalhes…

Quando falamos em “interface gráfica” estamos nos referindo à parte visual de um software ou aplicação que disponibiliza para o usuário uma forma de enviar comandos (clicar em links de um menu, digitar um termo de busca etc.) que serão traduzidos em código para fazer o software executar alguma ação. Ou seja, é tudo o que você, como usuário, vê e/ou interage com.

Vale recuperar a divisão da internet em client side e server side. Na internet, acontecem requisições e respostas às requisições. De um lado, os chamados clientes, que fazem as requisições. São os navegadores, por exemplo. De outro lado, os servidores, que servem as informações. Quando você digita uma URL no seu navegador e “dá enter”, ele faz uma requisição para o servidor que guarda os arquivos daquele site. O servidor, por sua vez, devolve esses arquivos, que nada mais são do que um amontoado de códigos, que é interpretado e exibido graficamente (renderizado) pelo seu navegador.

Na web, o front-end trabalha no lado do cliente (client side), no navegador. Os links, as imagens, os botões e até mesmo este texto que você está lendo são o resultado da mistura de códigos escritos em duas linguagens: o HTML e o CSS. Sem nos alongar muito no assunto, o HTML (Hyper Text Markup Language) define o que é o que dentro de uma página e ajuda o navegador saber como exibir os conteúdos. O CSS (Cascade Style Sheet) é utilizado para especificar estilos visuais (margem, tipografia, cores etc.) para cada elemento ou grupo de elementos definidos com o HTML. Para saber mais sobre HTML, leia “HTML, o esqueleto da internet”.
Geralmente, essas duas linguagens têm um aliado para tornar os sites mais interativos: o JavaScript. Essa outra linguagem de programação permite que criemos carrosséis de imagens, janelas pop-up, filtros de conteúdo e até animações. Costumamos dizer que o HTML é o esqueleto e o CSS é o que deixa as coisas “bonitas”, dando estilo a elas. O JavaScript, por sua vez, traz vida para esse corpo.

Back-end, o contrarregra
Lembra que o back-end é como se fosse o contrarregra por trás da interface gráfica? Pois bem. Enquanto o front-end cuida do visual e da interação entre o usuário e a interface, o back-end está agindo nos bastidores, buscando em um servidor as informações, dados e arquivos que serão exibidos no navegador.
Por exemplo, em um site mais complexo, como uma rede social, não basta ter o visual das páginas sem as informações que devem aparecer em cada uma. Essas informações estão armazenadas em um banco de dados que precisa ser consultado e manipulado para que as coisas funcionem bem. É aí que chegamos no tal back-end…

Simplificando as coisas, podemos dizer que uma página é capaz de funcionar sem o back-end, mas ela é mais limitada, o que não é necessariamente ruim. Sites institucionais, por exemplo, não precisam dessa complexidade, e atendem bem o objetivo a que se destinam.

O back-end também é conhecido como server side (ou lado do servidor) e é composto, normalmente, de três partes: um servidor, uma aplicação e um banco de dados.

• Servidor: é a máquina que armazena fisicamente os arquivos e os “serve”, isto é, os envia ou salva novos dados, conforme requisições.
• Aplicação: é o programa propriamente dito, uma sequência de códigos escritos pela desenvolvedora para executar a função para que foi desenhado.
• Banco de dados: é onde os dados estruturados são armazenados e facilmente encontrados e alterados. Dados de cadastro, por exemplo, ficam em bancos de dados. O mais famoso deles é o MySQL.

Por exemplo, quando procuramos um produto em um site de compras, estamos usando o navegador para fazer uma requisição de dados ao servidor. Digamos que eu tenha digitado “livro python” e selecionado o filtro “menor que R$50”. Isso vai gerar um pedido ao servidor para que mande uma lista de produtos que atendam a essas características. O pedido é interpretado pela aplicação que está rodando no servidor, que devolve a informação encontrada, que, por sua vez, será renderizada pelo navegador e apresentada para o usuário. Também é possível que a requisição não seja para buscar um dado, mas para guardar, como acontece quando fazemos um cadastro.

Como foi dito no post O que, afinal de contas, é programar?, existem várias linguagens de programação que podemos empregar para conversar com os computadores. Algumas das linguagens mais populares, como Python, Ruby ou PHP, podem ser utilizadas para escrever essas aplicações que estabelecem a comunicação do navegador com o servidor, do servidor com o banco de dados, e como as informações que buscamos ou inserimos em uma página na web serão manipuladas e armazenadas nesse banco de dados.

Front-end versus Back-end
Um tópico de discussão entre desenvolvedores é a complexidade que envolve cada ponta da linha que define todos esses níveis de comunicação: usuário-navegador, navegador-servidor, servidor-banco de dados.

Para alguns, desenvolver códigos em HTML, CSS e JavaScript para o front-end é mais fácil que elaborar códigos para o back-end, usando outras linguagens como Python, Ruby, PHP ou ainda C#, Swift, etc.
Na verdade, essa ideia é infundada. Hoje em dia, o HTML, que já chegou à quinta versão (o HTML 5), e o CSS, que está na terceira (CSS 3), possibilitam a criação de conteúdo muito mais complexo do que antigamente. Além disso, manipular essas linguagens para criar páginas com maior apelo visual não é uma tarefa tão descomplicada como pode parecer.

A utilização do JavaScript tem evoluído muito. Hoje, ele é utilizado também por desenvolvedores back-
end em ferramentas como o Node.js e em banco de dados como o MongoDB.
Além disso, para trabalhar como desenvolvedor front-end, são cada vez mais exigidos conhecimentos em User Experience (UX), ou Experiência do Usuário, que é a área que se ocupa em trazer uma boa experiência para o usuário a pessoa, de maneira que elae tenha sentimentos positivos em relação ao produto ou serviço.

E o desenvolvimento back-end não fica pra trás quanto ao rigor da demanda por melhores aplicações. Existem muitos frameworks em constante atualização para fazer com que as linguagens server side trabalhem com melhor performance, ou seja, sejam mais rápidas e eficientes.
O melhor dos dois mundos

Em vez de discutir, não seria melhor se cada lado aprendesse como o outro funciona para todos trabalharem melhor, juntos?
Pois é, aí entram os desenvolvedores full-stack. Normalmente, são desenvolvedores back-end que buscam entender e se capacitar para poder criar páginas HTML e plugins em JavaScript ou desenvolvedores front-end que trabalham com administradores de conteúdo como o WordPress ou Joomla e procuram aprofundar seus conhecimentos nas linguagens com as quais essas ferramentas foram criadas.

O importante, no final das contas, é estar segura daquilo que se quer saber e manter o foco. Em um mundo ideal, nós seríamos capazes de programar em todas as linguagens possíveis, mas, na realidade, é melhor saber fazer bem aquilo que nos propusemos do que ser uma programadora que faz tudo “mais ou menos”.