Skip to main content

Front-end, back-end, software, inteligência artificial, automatização… tudo isso parece – e é – muito confuso para quem está chegando agora e não conhece muito sobre cada uma das stacks da programação.

A carreira de programação é, atualmente, uma realidade para vários e um sonho para muitos. A possibilidade de trabalhar de casa, de colaborar com empresas estrangeiras e receber em dólar, às vezes, parece até bom demais para ser verdade.

Entre aqueles que estão empolgados e interessados em ingressar na área de tecnologia, alguns ainda não sabem muito bem o que é cada área da programação.

Por isso, vamos esclarecer bastante sobre o front-end: uma área tão querida por alguns e detestada por outros, mas que é, sem dúvidas, fundamental para o bom andamento de toda a internet.

Vamos lá!

O que é o front end?

A programação front end trata do desenvolvimento de toda a aparência externa de uma aplicação, seja ela web ou não. Portanto, isso implica em transformar o desenho feito pelo designer em código útil para a produção da aplicação.

Com isso, o desenvolvedor front end é o responsável por tornar a aplicação agradável ao usuário, fazer as animações e transições, criar rotas na aplicação, etc.

No entanto, pense que é um desenvolvimento voltado apenas para o design e para as qualidades externas do código. Além disso, o desenvolvedor front end precisa, também, criar lógicas complexas para garantir o andamento da aplicação.

Por exemplo, pense em uma calculadora: essa é uma aplicação que funciona inteiramente pelo front-end. O seu site tem de guardar as informações que o usuário inseriu, fazer os cálculos e imprimir a saída de dados corretamente.

Outro exemplo: imagine o site de um grande e-commerce, em que você precisa calcular quanto será a soma de todos os valores dos produtos que o seu cliente escolheu. Sem dúvidas, será uma lógica bastante delicada.

Outro nome que o front end receber é client-side, devido ao fato de que ele é o sistema que atua próximo ao usuário. Ou seja, é por ele que o seu cliente interage com o que você projetou e desenvolveu.

Qual a diferença entre front end e back end?

Como falamos antes, já que o front end é o client-side de sua aplicação, então o back end é o que atua “por debaixo dos panos”. É ele quem coordena tudo o que não é visto pelo usuário, recebendo e processando requisições e organizando o banco de dados.

Sendo assim, podemos estabelecer o seguinte pensamento: é como se o front-end fosse o corpo e a face da sua aplicação, enquanto que o back-end seria o cérebro e parte do sistema nervoso.

Isso porque é o corpo quem envia para o cérebro as novas informações e também quem entende as informações vindas do seu cérebro, enquanto que é este quem processa tudo o que ocorre.

Como o front end é feito?

De modo geral, a maior parte dos websites atuais é feita por JavaScript, CSS e HTML. 

Dessas, é preciso destacar que apenas JavaScript é uma linguagem de programação! As demais são apenas descrições da aparência do site, o que não é programação em si.

Para explicar isso, vamos imaginar que o seu código web seja uma única sentença. Como toda boa frase, ela é composta por substantivos, verbos e adjetivos. 

Neste caso, os substantivos seriam o HTML, que expõem do que seu texto se trata; o CSS seria os adjetivos. Eles servem para tornar a frase mais agradável, mais atrativa, ou, dependendo, expôr emoções ou chocar.

Já o JavaScript são os verbos. Ou seja, são eles quem fazem a sentença andar, progredir e desenvolver sua lógica. São eles que relacionam os substantivos e adjetivos e quem organiza todo o sucesso da sentença.

Para ficar mais claro, vamos ver cada um de maneira um pouco com um pouco de detalhes.

HTML

HTML (Hypertext Markup Language) é a linguagem usada para marcar o hipertexto. Hipertexto é, basicamente, um texto escrito que é capaz de se relacionar com outros textos.

Isso fica claro se pensarmos que, a partir de uma página web, é possível acessar outra no mesmo domínio. Ou seja, por debaixo dos panos, todas as páginas web são HTMLs bem decorados, estilizados e orientados a cumprir um objetivo específico.

Exemplo de HTML
Exemplo de HTML

Com isso, chegamos ao ponto principal: o HTML é uma forma de indicar marcações a um documento. Imagine que você tem um arquivo Word e que, você adicione algumas marcações para que alguém que leia e entenda onde deixar o texto negrito, sublinhado ou itálico.

Além disso, você pode dar indicações para seu usuário do que é o cabeçalho, o corpo e o rodapé da sua página, de modo que ele sempre saiba se orientar, e também tenha notações precisas para onde começa e onde termina o parágrafo, ou até marcação de para que parte do documento você tem que ir se clicar em algum texto específico.

Isso é o HTML. Por isso ele não é uma linguagem de programação: ele apenas organiza um documento com tags e mostra o que é cada pedaço de texto.

CSS

CSS (Cascading Style Sheet) é, como dito, os adjetivos do seu documento. É ele quem estiliza tudo, dá cor, forma, tamanho, largura, altura etc. 

Para tanto, ele se utiliza das tags que o HTML determina e as estiliza de acordo com comandos determinados pelo usuário. Com isso, é ele quem, efetivamente, faz aquilo que eu citei no texto anterior, de dizer ao “próximo usuário” onde adicionar negritos, sublinhados, itálicos, etc.

Exemplo de CSS

Além disso, o CSS é responsável por fazer animações na sua página, como aquelas quando algum botão brilha ao passar o mouse em cima ou ao selecionar alguma opção, ou fazer alguma opção da tela “flutuar” por cima de outra, ou até adaptar um site para uso em telas pequenas ou grandes.

Com isso, nota-se que o CSS tem um uso básico bastante simples, mas um uso avançado bastante complexo. Sua escalabilidade não pode ser subestimada, e ele consegue ser bem complicado de se entender.

JavaScript

Por fim, chegamos ao JavaScript, que é todo o cérebro operacional da máquina. É ele quem processa aquilo que o usuário fez e clicou, além de ser capaz de fazer processamentos lógicos computacionais, enviar e receber requisições para APIs externas, salvar dados na memória do computador do usuário etc. 

Além disso, ele é capaz de alterar diretamente o HTML da aplicação (chamada, nesse caso, de DOM – Document Object Model, o que é assunto para outro artigo), adicionando ou retirando propriedades que irão alterar até a aparência da aplicação.

Em um nível mais avançado de um desenvolvimento web, por exemplo, o HTML e o CSS puros são deixados de lado e passa-se a utilizar apenas o JavaScript com DOM virtualizado (ou seja, sem utilizar um documento .html), e com o CSS sendo determinado dentro do documento JS. É bastante complicado, mas você conseguirá entender mais à frente.

JavaScript, por ser uma linguagem tão abrangente, como mostramos em nosso artigo anterior, permite a criação de várias formas de programar e chegar a um mesmo resultado: um bom site funcional e atrativo. Por isso que é uma linguagem tão popular e que domina tanto o mercado.

É possível dominar o back e o front end?

Sim! Quem sabe utilizar as duas stacks do desenvolvimento de websites é chamado de desenvolvedor fullstack. Na verdade, não é tão difícil de conseguir essa proeza. Para quem conhece o front, fica mais fácil aprender a utilizar o back-end, e vice-versa.

O mercado para desenvolvedores fullstack está bastante aquecido, e eles são constantemente procurados por empresas nacionais e internacionais pela sua capacidade de cumprir com qualquer demandas de back e front end, além poder suprir desfalques nas equipes.

No entanto, apesar de ser capacitado a utilizar ambas as stacks a nível profissional, obviamente cada desenvolvedor tem a sua preferida. Sempre temos uma aptidão natural que nos leva a querer mais algum dos dois lados, principalmente por eles serem tão diferentes entre si. Para descobrir qual o seu, basta testar os dois!

Como se tornar um Desenvolvedor Full Stack?

Para realizar os sonhos de tantos jovens atuais, que sonham em se tornar desenvolvedores e mudar de vida para sempre, a Driven abriu uma escola de Formação Intensiva em Desenvolvimento Full Stack. 

É uma trilha completa de 9 meses que te levará do zero a uma carreira em tecnologia! E o melhor: você só começa a pagar quando estiver trabalhando e recebendo pelo menos R$3.000,00.

Para saber mais sobre nossa formação e receber um aviso assim que abrirmos as inscrições para a próxima turma, clique aqui.