2021 09:29

PanoDeChao · 2021-08-16T11:02:00-03:00

Uma dúvida comum que quem está começando a programar costuma ter é entender o que é front-end e o que é back-end. Quando começamos a programar geralmente pegamos alguma linguagem de programação para aprender lógica e para criar os primeiros programinhas. Muitas vezes nos meus chats aqui no site eu abordo a criação de programas simples que possam ser úteis para resolver tarefas sacais do dia a dia. Mas programação não se resume a desenvolver pequenos programas para automatizar tarefas repetitivas. Pensando nas possibilidades de aplicação da tecnologia, uma das áreas mais conhecidas é a área de desenvolvimento web, além da área de desenvolvimento mobile que cada vez mais ganha protagonismo. Quando falamos de desenvolvimento web, podemos dividir um produto em dois lados principais que é o client side e o server side. E dá pra traçar um paralelo entre esses dois termos com os termos front-end e back-end, sendo o client side o lado onde fica o front-end e o server side com o lado no qual fica o back-end. O front-end, como o próprio termo já diz, é aquilo que fica "na nossa frente". É o design que vemos quando usamos um sistema web ou um aplicativo de celular. É aquela interface com a qual interagimos ao postar sardinhice na bastter.com, é aquela lista de restaurantes que temos acesso ao buscar um almoço no ifood, e por aí vai. Falando em desenvolvimento web principalmente, existem 3 ferramentas principais para o desenvolvimento do front-end que são HTML, CSS e JavaScript, sendo, dessas 3, somente a JavaScript considerada uma linguagem de programação. HTML é uma linguagem de marcação e CSS é a cascata de estilos de um site. Podemos resumir a função de cada uma dessas ferramentas com a imagem acima. HTML é o esqueleto de um site. JavaScript é aquilo que traz interatividade a um site, tal como nosso sistema esquelético e neurológico nos permite nos movimentar. CSS é aquilo que embeleza um site, é como nossas características externas como seres otomanos. Mas para desenhar um bom front-end não basta saber essas 3 ferramentas. Muitas vezes o desenvolvimento é dividido entre quem domina essas 3 ferramentas e um designer de fato, aquela pessoa que irá desenhar como o site deverá ser e a pessoa responsável por programar irá usar HTML, CSS e JavaScript para conseguir chegar àquele resultado esperado feito pelo designer. Já pensando pro lado do design, para elaborar o projeto é desejável o conhecimento de ferramentas de design como Figma, Photoshop, Sketch e por aí vai. Agora falando do back-end, geralmente é no back-end onde o grosso do projeto está. É desse lado que fica tudo aquilo que não vemos. É onde fica a estrutura responsável por receber inputs do usuário no front-end e realizar os processamentos necessários para obedecer às regras do negócio. No caso da bastter.com, é o código responsável por fazer nosso login, conferindo se a senha digitada bate com a senha (ou o hash da senha, pra ser mais técnico, mas isso é assunto pra depois) com a informação armazenada no banco de dados, permitindo ou bloqueando nosso login. É o que nos permite postar sardinhice no site e salvar as sardinhices no banco de dados, fazendo com que possamos voltar ao site em seguida e ver a sardinhice lá postada, é o código que comunica o pedido no ifood para o restaurante e salva esse pedido no banco de dados, fazendo com que seja possível verificar um mês depois que no dia tal fizemos tal pedido no restaurante X, e por aí vai. É no back-end que iremos verificar como iremos cumprir as regras do negócio em forma de código, usando linguagens diversas como Python, PHP, C#, Java, JavaScript, Go, etc, e como esse código vai interagir com o front-end e com o banco de dados, ferramenta também estritamente necessária nesse mundo de tecnologia. Um resumão do fluxo poderia ser feito com essa imagem. Por meio de ferramentas de client side como web browsers e sistemas mobile podemos acessar aplicativos e sites, interagir com eles e nossas interações são processadas pelo back-end, que caso necessário faz requisições a um banco de dados, que retorna dados para o back-end continuar o processamento e elaborar a resposta para o client side.