O que é front end e back end: entenda esses termos significam

Avatar

Redação

2 avaliações

22 de maio de 2020

front-end e back-end são termos populares quando se trata de desenvolvimento e programação.

Provavelmente você ouviu os termos front-end e back-end relacionados ao desenvolvimento de sites e aplicações web. Esses termos são usados constantemente no universo do desenvolvimento web. Logo, saber o que é front-end e back-end é fundamental para quem quer aprender mais sobre a criação de sites.

front-end e back-end

Para os iniciantes, talvez não seja tão simples assim entender a diferença entre essas duas modalidades de desenvolvimento. Por isso, criamos este artigo. Aqui, você vai tirar suas dúvidas sobre desenvolvimento front e back-end, além de entender melhor o funcionamento de um site. Confira!

O que é front-end e back-end?

Para entender o que é front-end e back-end, é necessário conhecer sobre a arquitetura cliente-servidor. Nesse tipo de arquitetura, existem dois atores: um cliente, que se refere as tecnologias processadas no computador do usuário, e o servidor, que se refere ao que é processado no servidor.

Com isso, temos tecnologias processadas em cada um dos lados:

  • Client-side - são as linguagens que o navegador interpreta, aplicações que rodam no lado do usuário, sem a necessidade do processamento no servidor — HTML, CSS e JavaScript.
  • Server-side - são as linguagens que rodam no servidor — PHP, Java, Ruby etc. O desenvolvedor cria um código que o servidor processa e envia uma resposta para o navegador.

As duas partes trabalham juntas para trazer a melhor usabilidade, funcionalidade e desempenho para um site.

front-end e back-end

Para facilitar, vamos ver o que acontece ao abrir um navegador e acessar um site. Quando digitamos o endereço de um site no navegador e apertamos a tecla Enter, começa um processo no qual é enviada uma requisição ao servidor onde a página está hospedada (back-end).

Cada interação com uma das funções de um site que requer uma consulta no servidor web, como uma pesquisa, por exemplo, uma nova requisição é enviada ao servidor. Nesse tipo de requisição, há acesso ao banco de dados ou processamento dos arquivos do servidor.

Por fim, os algoritmos processam as informações e é enviada uma resposta com os resultados da pesquisa. Com isso, uma resposta contendo uma cópia dos arquivos que formam a página é enviada para o computador. Esses arquivos são interpretados pelo navegador (front-end) e a página é exibida na tela.

O que é front-end e para que serve?

O desenvolvedor front-end é o profissional responsável pela criação da interface da aplicação web, ou seja, ele desenvolve a tela da página com a qual o usuário interage. Todos os elementos que formam a identidade visual de um site são criados no front-end.

front-end

Cabe a esse desenvolvedor, além do conhecimento das linguagens específicas, a aquisição de conhecimentos relacionados à experiência do usuário. As principais linguagens utilizadas para a criação da interface de uma aplicação web são:

  • HTML - linguagem de marcação responsável pela estruturação da página. Ela é o alicerce da aplicação, indicando todos os elementos presentes nela, cabeçalho, menu, barra lateral, rodapé, imagens, etc.
  • CSS - linguagem de marcação de estilo, responsável pelo visual da página, cor, fontes, organização das seções, efeitos de transição, entre outras.
  • JavaScript - linguagem de programação responsável por dar melhorar a usabilidade, dinamismo e interatividade do usuário com a página.

CSS e JavaScript são linguagens tão versáteis que, por meio delas, foram criados bibliotecas e frameworks específicos e sofisticados — ao ponto de virarem objetos de estudo e especializações.

As bibliotecas e os frameworks são utilizados como base para a criação de programas extremamente complexos. Podemos citar entre as principais Angular, Vue JS e Bootstrap.

O que é back-end e para que serve?

O profissional back-end é responsável pelas engrenagens de uma aplicação web. É ele quem cria o código para que haja a execução das funções do site. O usuário não tem acesso a esse código, pois ele roda no servidor onde a aplicação está hospedada e, no momento da requisição, a resposta é enviada em uma linguagem que pode ser interpretada pelo navegador.

back-end

Entre as linguagens de programação mais populares no back-end, estão:

  • PHP - a linguagem de programação mais popular para web, disponível na maioria das hospedagens.
  • Python - uma linguagem extremamente popular para desenvolvimento em várias áreas e análise de dados.
  • Ruby - outra linguagem amplamente utilizada para desenvolvimento de aplicações para a web.

Fora essas, é necessário levar outras tecnologias, como os sistemas de banco de dados, por exemplo. Entre os mais utilizados, estão o MySQL, MariaDB, MongoDB e PostgreSQL.

Back-end na prática

Vamos utilizar como exemplo um site de e-commerce, que exige muito do desenvolvedor de back-end para funcionar — grande parte das funções desse tipo de site dependem de algum tipo de processamento no servidor.

O que é front-end e back-end na prática

Um usuário busca um smartphone utilizando os filtros de cor e escolhe o preto. Ele opta pela exibição de uma lista com preços em ordem crescente.

Essa requisição é enviada ao servidor que acessa o banco de dados da empresa.

O algoritmo processa as informações e envia como resposta uma lista contendo todos os aparelhos que tenham as características desejadas pelo usuário.

A resposta enviada pelo servidor é interpretada pelo navegador. Quando o usuário escolhe o seu smartphone e clica em comprar, uma nova requisição é enviada e outro processamento acontece, sendo criado um carrinho de compras na interface, onde o cliente pode adicionar ou remover itens — tudo isso processado no servidor (back-end) e depois exibido na tela (front-end).

O desenvolvimento back-end pode ser feito em várias linguagens de programação, como PHP, Java, Phyton, Ruby e C#. É importante também que o profissional tenha bons conhecimentos de banco de dados, por exemplo MySQL, SQL Server, PostgreSQL etc.

Separando front-end e back-end

Nos primórdios da internet, quando as páginas não eram tão sofisticadas e as linguagens menos complexas, o desenvolvedor web que criava o site, na maioria das vezes, era responsável tanto pelo front quanto o back-end. No começo, era comum escolher uma linguagem de back-end, como PHP e utilizar as linguagens front-end padrões da web, como HTML e CSS.

front-end e back-end - Separando os conceitos

No entanto, com a evolução tecnológica, aumento da capacidade de processamento, da qualidade e velocidade das conexões de internet, os sites passaram de páginas simples a softwares robustos e completos. Essa evolução criou uma demanda cada vez mais exigente, por interfaces bem projetadas e intuitivas, e com altíssimo desempenho.

Com isso, as tecnologias de front-end e back-end passaram a ter uma profundidade muito maior. Por exemplo, conhecer somente o PHP não seria suficiente, era necessário também ser proficiente com os frameworks PHP, saber como otimizá-los e torná-los altamente escaláveis.

Portanto, numa era em que cada milissegundo é importante, se tornar um especialista no front-end ou back-end passou a ser um grande desafio.

front-end e back-end - Desempenho

Os sites, páginas da web e aplicativos precisam oferece uma boa experiência para o usuário. Além disso, é preciso ter um forte apelo visual sem sacrificar a velocidade do site e experiência de navegação.

Como resultado, as oportunidades de trabalho relacionadas ao desenvolvimento front-end passaram a privilegiar profissionais qualificados e especializados.

Por outro lado, como os sites se tornaram aplicativos web, com códigos refinados e funções mais robustas, aumentou também a demanda por profissionais que dedicados à parte funcional dos sites, ou seja, os desenvolvedores back-end. A seguir, explicaremos detalhadamente essa divisão front-end e back-end do desenvolvimento web. Continue lendo!

Diferença entre o desenvolvimento front-end e back-end

Diferença entre o desenvolvimento back-end e front-end

Durante muito tempo houve um debate em relação à diferença de complexidade em se trabalhar com back-end e front-end. Alguns profissionais acreditavam que trabalhar com HTML, CSS e JavaScript era menos complexo do que desenvolver códigos em linguagens back-end.

Esse tipo de raciocínio é infundado, visto que as novas versões do HTML e CSS e o crescimento do JavaScript possibilitam criações ilimitadas, permitindo aos profissionais mais preparados a criação de interfaces extremamente sofisticadas e dinâmicas.

Front-end Back-end
Tipo Se refere ao lado cliente (client-side) da aplicação Se refere ao lado servidor (server-side) da aplicação
Usuário É a parte do site que os usuários vêem e interagem Consiste em tudo que acontece por trás das cenas
Partes Normalmente inclui tudo que é relacionado ao visual do site Normalmente inclui um servidor web e banco de dados
Visibilidade Forma a base que usuários podem tocar e experienciar É o cérebro do site e nunca fica visível ao usuário
Linguagens As linguagens essenciais incluem: HTML, CSS e JavaScript Linguagens como: PHP, Python, Ruby e Java

Além disso, para desenvolver o front-end, o profissional precisa obter conhecimentos em experiência do usuário (UX), buscando ao máximo atingir os anseios do público-alvo da aplicação web.

O que é um desenvolvedor front-end, back-end e full-stack?

O que é desenvolvedor full stack

Nós já vimos o que é front-end, back-end e como essas partes trabalham em conjunto na criação de um site ou aplicação web. Para ambas as partes do desenvolvimento de sites, pode haver um desenvolvedor especializado. Nesses casos, o desenvolvimento da aplicação é divida entre dois tipos desenvolvedores:

  • Desenvolvedor front-end - responsável pela experiência de uso da aplicação.
  • Desenvolvedor back-end - responsável pela pelo desempenho e parte lógica por trás da aplicação.

Abaixo, você pode visualizar a tabela destacando as características de cada um desses tipos de desenvolvedor.

Desenvolvedor front-end Desenvolvedor back-end
Objetivo Tornar o site atraente e oferecer uma boa experiência ao usuário ornar o site dinâmico com uma arquitetura robusta de alto desempenho
Qualidades Criatividade, visão artística, detalhista, empatia Capacidade lógica e analítica, resolução de problemas
Ferramentas HTML, CSS3, JavaScript, jQuery, Angular, Bootstrap, SASS/LESS PHP, C#, Python, Ruby, Node.js, MySQL, MongoDB

Mas além do desenvolvedor front-end e back-end, ainda há mais um tipo de desenvolvedor – o desenvolvedor full-stack.

Esse é um desenvolvedor que atua tanto com front-end como back-end. Esse tipo de profissional é bem valorizado, devido ao desafio de conhecer bem ambas as partes do desenvolvimento. Esse desenvolvedor precisa conhecer todo o processo de desenvolvimento de um site e entregar a mesma qualidade front-end e back-end.

Front-end ou back-end: qual caminho seguir?

Agora você já sabe o que é front-end e back-end, e conhece a diferença entre desenvolvedores front-end e back-end. Para resumir, podemos pensar que o desenvolvedor front-end é aquele que foca na interface com o usuário, enquanto o back-end trabalha na parte funcional da aplicação, na parte do lado servidor.

Sabendo disso, fica mais fácil decidir qual caminho seguir. Se você prefere a parte de usabilidade e experiência do usuário, a parte de front-end é mais interessante. Porém, se o seu objetivo é tornar a aplicação funcional com o melhor desempenho possível, back-end seria a opção adequada.

E se você tem interesse em ambas as partes, nada lhe impede de aprender tanto front-end quanto back-end e se tornar um desenvolvedor full-stack.

Está procurando uma hospedagem para colocar aprender ou colocar seus aprendizados em desenvolvimento? Confira a lista com as melhores hospedagens de sites e escolha a melhor para você!


Deixe um comentário

* seu e-mail não será exibido

Comentários dos usuários

Nilo Koscheck imagem
Nilo Koscheck

22 de fevereiro de 2020

Gostei bem didático. Parabéns

Gostei bem didático. Parabéns

Tiago Simoes imagem
Tiago Simoes

30 de janeiro de 2020

Parabéns pelo contéudo. Super simples, claro e direto.

Parabéns pelo contéudo. Super simples, claro e direto.