Quer entender melhor a diferença entre front-end e back-end? Ou saber como nossos colaboradores na dti constroem sua trajetória na área? Fique até o final do artigo!

Quer entender melhor a diferença entre front-end e back-end? Ou saber como nossos colaboradores na dti constroem sua trajetória na área? Fique até o final do artigo!
<div id="toc_container" role="navigation" aria-label="Table of Contents" data-nosnippet class="toc_white no_bullets toc_numbered toc_title_center">Sumário<ul class="toc_list"><li><a href="#Front-end-e-Back-end-Contextualizacao-e-Introducao">1. Front-end e Back-end: Contextualização e Introdução</a><ul><li><a href="#Stack">1.1. Stack</a></li></ul></li><li><a href="#Qual-a-diferenca-de-Front-end-e-Back-end">2. Qual a diferença de Front-end e Back-end?</a></li><li><a href="#Trajetorias-em-Front-end-e-Back-end">3. Trajetórias em Front-end e Back-end</a><ul><li><a href="#Outros-tipos-de-atuacao-dentro-e-fora-da-dti">3.1. Outros tipos de atuação dentro e fora da dti</a></li><li><a href="#Minha-carreira-na-dti">3.2. Minha carreira na dti</a></li><li><a href="#Trajetoria-e-aprendizado">3.3. Trajetória e aprendizado</a></li></ul></li></ul></div>
<h2>Front-end e Back-end: Contextualização e Introdução</h2>
Assistimos em um determinado momento da história da computação a passagem do desenvolvimento de aplicações nativas ao sistema operacional, para o desenvolvimento de aplicações Web, que seriam totalmente controladas pelo usuário através do próprio navegador (em eras antigas o Internet Explorer, atualmente o Chrome), um único software que permitiria o acesso a um vasto número de aplicações.
As consequências deste breve resumo de uma fase da história da computação que compreende os anos 90/2000 podem ser vistas até hoje, na alta complexidade em que as aplicações Web são produzidas e entregues, seja pelos próprios setores de tecnologia das empresas como pelas fábricas de software no mundo todo. Toda esta complexidade levou os profissionais de TI a serem obrigados a absorverem uma alta carga de conhecimento para suportar toda a stack destas aplicações. Se você ainda não ouviu essa buzzword, neste momento você deve estar se perguntando o que é uma stack.
<h3>Stack</h3>
Stack numa tradução literal significa pilha, e pode se referir a diversos conceitos dentro da computação, desde estruturas de dados até o desenvolvimento de redes de computadores. Mas a definição que estamos interessados é a de Solution Stack, ou numa tradução livre, pilha de solução. Em cada elemento desta pilha, existe um subsistema que compreende, quando agrupados nessa stack, o sistema como um todo.
Para que fique mais claro, vejamos um exemplo prático. Suponha que você precise desenvolver uma aplicação Web para a sua empresa, que, por exemplo, controle o estoque do armazém da companhia. Como estamos falando de um contexto em que há armazenamento de dados (os dados do estoque) provavelmente além da aplicação em si, precisaremos de um banco de dados.
Um diagrama inicial da sua aplicação seria algo do tipo:
<img decoding="async" class="size-full wp-image-17983 aligncenter" src="https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/stack-1.png" alt="" width="168" height="262" />
Se quisermos trazer o exemplo para um contexto mais moderno de desenvolvimento podemos quebrar o bloco Aplicação Web em mais subsistemas (lembre-se da definição da Solution Stack). Pois bem, agora adicionamos também que há um desacoplamento entre a parte que cuida da interface do usuário, ou seja a parte visual da aplicação e aquela em que há o tratamento das regras de negócio e acesso aos dados da aplicação. Depois desta quebra e já usando alguns nomes do mercado de exemplo para os novos subsistemas, sua aplicação provavelmente ficará assim:
<img fetchpriority="high" decoding="async" class="aligncenter wp-image-17984 size-medium" src="https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/stack2-175x300.png" alt="Front-end e Back-end" width="175" height="300" srcset="https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/stack2-175x300.png 175w, https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/stack2.png 217w" sizes="(max-width: 175px) 100vw, 175px" />
<h2>Qual a diferença de Front-end e Back-end?</h2>
Temos a partir do diagrama acima uma stack, que compõe-se de 3 subsistemas: a parte que cuida da interface de usuário podemos chamar de front-end, a parte que cuida do tratamento das regras de negócio e acesso aos dados podemos chamar de back-end e o banco de dados não precisamos renomear. Pronto! O diagrama expressa uma típica stack de desenvolvimento moderno e você agora sabe, mesmo que não aprofundado, o que significa algumas palavrinhas que circulam por aí sobre este contexto.
Se você quiser saber em mais alto nível a diferença dessas camadas e entender conceitualmente o que é front-end e quais os conhecimentos necessários para se especializar nessa parte da stack, da uma olhada nesse <a href="https://dtidigital.com.br/blog/front-end/">outro artigo</a> aqui do nosso blog ;).
Agora que entendemos de uma forma mais prática como é a divisão de uma stack de desenvolvimento. Vamos ver um case real de como eu direcionei a minha carreira para uma das partes desta pilha, a de front-end.
<h2>Trajetórias em Front-end e Back-end</h2>
<h3>Outros tipos de atuação dentro e fora da dti</h3>
Entrei para o mercado em 2018 como desenvolvedor full-stack. Logo que fui absorvendo as primeiras demandas de front-end já comecei a me encantar com a área e querer entender cada vez mais sobre como as pessoas poderiam interagir com as aplicações que eu desenvolvia. Trabalhei até 2019 com alguns frameworks e libs como Dojo JS, Angular JS e React JS.
Nessa época também começou meu envolvimento com os profissionais de UX/UI que atendiam a antiga empresa. Percebia ali como esses profissionais pensavam em toda a experiência dos produtos e como aquilo iria impactar o meu dia a dia de desenvolvimento. Cada elemento, cada detalhe faziam a diferença para todo o fluxo, o que me fez ganhar muito respeito por estes profissionais.
<iframe title="A História do Front-End para Iniciantes em Programação | Série &quot;Começando aos 40&quot;" width="1200" height="675" src="https://www.youtube.com/embed/VKmPGmFY7H4?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<h3>Minha carreira na dti</h3>
Ainda em 2019 eu entrei para a dti com o foco total no framework Angular. Agora tendo o desafio de ter que aprender essa ferramenta nova além de encabeçar no time toda a parte de interface, sempre em contato com os profissionais de UX/UI. Nessa época eu fazia questão de estar sempre a frente das demandas que exigiam front. Isto visando um aprendizado mais focado e que me levasse a me especializar nessa área.
E como aqui na dti temos como pilar o compartilhamento de conhecimento. Ao mesmo tempo que aprendia, repassava muita coisa para a empresa. Numa maneira de reforçar o meu conhecimento e corrigir as falhas com as opiniões das pessoas mais experientes. Ademais, esse pilar abriu inúmeras portas para mim dentro da empresa e fora, levando a minha voz para a comunidade também, através dos Techshots.
Das várias atuações que um desenvolvedor web pode ter (algumas delas você pode visualizar <a href="https://dtidigital.com.br/blog/front-end/">nesse artigo</a>), aceitei o desafio de assumir a posição de Desenvolvedor Líder aqui da dti. Então além das responsabilidades de encabeçar a operação dos projetos, ainda tenho que me preocupar com a qualidade das entregas. E, é claro, com <a href="https://www.cms.dtidigital.com.br/blog/front-end/">acompanhamento da carreira dos membros do time</a>. Um baita desafio que trouxe muitos aprendizados extra-desenvolvimento!
<a href="https://open.spotify.com/episode/0BRh6CD4EkjMyG1fV6iK2F"><img decoding="async" class="alignnone wp-image-17485 size-large" src="https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/CTA-entrechaves-1024x255.png" alt="Episódio LGPD " width="1024" height="255" srcset="https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/CTA-entrechaves-1024x255.png 1024w, https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/CTA-entrechaves-300x75.png 300w, https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/CTA-entrechaves-768x191.png 768w, https://www.cms.dtidigital.com.br/wp-content/uploads/2021/08/CTA-entrechaves.png 1205w" sizes="(max-width: 1024px) 100vw, 1024px" /></a>
<h3>Trajetória e aprendizado</h3>
Ao longo da minha trajetória aqui na dti já pude ter contato com inúmeras ferramentas de desenvolvimento front-end. Tanto dentro do time como na nossa Guilda de Front-End e Back-end. Já tive a oportunidade de aprender sobre outros frameworks, também. Por exemplo: lidar com interfaces que são publicadas na nuvem, testar o front-end de maneira adequada, lidar com design systems, dentre outros desafios que me motivam a cada dia. Inclusive, participei do <a href="https://open.spotify.com/episode/2PqXhdkBE7rg16nhr2RyQ7?si=d1a247addf7d4688">Entre Chaves sobre esse tema</a>, o podcast técnico da dti.
Tem interesse nas áreas de tecnologia e quer integrar um time que entende de agilismo na prática e sabe o valor da diversidade? Acesse nossa<a href="https://www.cms.dtidigital.com.br/venha-ser-dti/"> página de carreiras</a> e venha ser dti!

Front-end e Back-end na prática: Trajetórias de desenvolvimento

Desbloqueie o futuro do seu negócio

Mais conteúdos como esse

Travessa Dona Zilda, 125, sala 203, São Gonçalo – Pelotas, RS. CEP: 96075-166

14841 Dallas Parkway, 8th Floor Addison, TX 75254

R. Levindo Lopes, 357, 5º e 12º Andar – Savassi, Belo Horizonte MG, 30112-010