Editorial

Jamstack: o que é e como funciona

Presente em diversos micro serviços, nesse artigo você vai entender melhor o que é o Jamstack e como ele está melhorando a distribuição de conteúdos pela internet, desejamos uma boa leitura.

O que é o Jamstack?

Esse termo foi criado em 2015 por Mathias Billman, co-fundador da Netlify, um serviço que permite a criação, hospedagem de um site ou aplicativo. O Jamstack pode ser entendido como um conjunto ou empilhamento das tecnologias (Javascript, APIs e Markup) que vão permitir a criação e funcionamento de um site estático de maneira simples, consumindo poucos recursos de sua hospedagem. Com sites ou aplicativos criados com o Jamstack, você pode fazer a hospedagem no Github ou Cloudflare.

Diferenças entre site estático vs dinâmico

Sites estáticos são aqueles que vão exibir o mesmo conteúdo para todos os usuários, esses sites na sua maioria são escritos em HTML, os desenvolvedores tendem a ter maior facilidade na criação desse tipo de site.

Sites dinâmicos podem exibir conteúdos diferentes e proporcionar uma experiência personalizada para cada usuário, além do HTML são utilizados recursos de programação avançada e banco de dados.

Pilares do Jamstack

O Jamstack tem nas suas bases o Javascript, APIs e markup, podendo funcionar também com outras linguagens de programação como o Ruby, Python ou Go através do webassembly.

A linguagem criada em 1995 por Brendan Eich, foi inicialmente batizada com o nome de Mocha, depois recebeu o nome de LiveScript e por fim com o grande sucesso da linguagem Java em 1995 resolveu mudar o seu nome para JavaScript.

Ela é uma das linguagens de programação de alto nível mais famosas do mundo, podendo ser usada no desenvolvimento web ou de programas. Tem atuação principal no front-end, podendo ser usada em conjunto com HTML e CSS, também pode ser usada no desenvolvimento de aplicações e jogos.

Outro pilar importante são as APIs, o termo é um acrônimo de “application programming interface” ou em tradução livre “interface de programação de aplicativos”. Com ela é possível fazer chamadas entre serviços, permitindo que um sistema possa interagir com outros sistemas. É possível utilizar qualquer linguagem de programação para criar uma API. Estão presentes em diversos serviços utilizados atualmente como em pagamentos, serviços de streaming e aplicativos.


As APIs vão servir principalmente como comunicadores entre os serviços do Back-end (onde a aplicação de fato existe) e o Front-end (a interface do usuário, a popular “telinha”). Nos sites construídos com Jamstack após o processo de compilação, nenhuma chamada adicional de API é necessária.

A comunicação nesse caso é feita por chamadas de APIs via HTTP, podendo utilizar os métodos GET, POST e HEAD. De uma maneira mais simples, uma chamada API é como solicitar uma informação ao servidor e nos casos de sites com o Jamstack, a resposta é o conteúdo da página.

Os Endpoints são as extremidades da conexão de uma API, por exemplo, uma URL de um servidor, os Endpoints se dividem em 3 Tipos:

  • A de address sendo o local de hospedagem do serviço;
  • B de binding que fala como o serviço pode ser acessado;
  • C de contract, mostrando o que pode estar visível no serviço.

Markup:

Por fim, o Markup se refere às linguagens de marcação, diferentemente das linguagens de programação, as “marcações” tem a função de exibir informações em uma página da web. HTML, CSS e Markdown são 2 grandes exemplos de linguagens de marcação, no canal do Diolinux no YouTube, temos um vídeo dedicado sobre html.

Como funciona o Jamstack?

Em um site comum, cada visita de um usuário gera uma requisição ao servidor que, por sua vez, faz consultas ao banco de dados no back-end, ou seja, a cada consulta o servidor tem que fazer a coleta e processamento das informações e depois entregá-las ao usuário. Já no Jamstack, os conteúdos já estão pré-gerados e após a consulta do usuário, o Jamstack vai apenas exibir o resultado da consulta em uma página HTML existente.

No Jamstack, os conteúdos são escritos em Markdown, com a renderização sendo feita totalmente na nuvem. O Jamstack é hospedado no Github, facilitando a sua clonagem e o fato de não precisar lidar com a dificuldade de instalar dependências complexas.

O Versionamento no Github facilita o fluxo de trabalho para os produtores de conteúdo, podendo acompanhar cada alteração feita durante as atualizações de conteúdo do site.
A CDN (content delivery network), é responsável pela entrega do conteúdo, a sua rede se destaca por ter diversos servidores distribuídos geograficamente, que deixam a entrega do conteúdo na web muito mais rápida.

Sistemas baseados no Jamstack

O Jamstack está presente em diversos serviços, como, geradores de sites estáticos como o Hugo, Jekyll e Pelican. Jamstack pode ser utilizado na criação de e-commerce, tendo maior desempenho e consequentemente melhorando as taxas de conversão. Com o Jamstack as possibilidades são gigantes, desde criar um simples site de portfólio até aplicações para uso no dia a dia.

Pontos fortes do Jamstack

O Jamstack permite a pré-renderização do front-end, ou seja, a interface/página carrega de maneira fluida e rápida para o usuário. Essa é uma boa opção para Landing Pages ou Blogs de Conteúdo, fornecendo as informações rapidamente para o usuário.

Graças a pré-renderização das páginas estáticas, vários problemas de vulnerabilidade são evitados, evitando a necessidade de uso de infraestrutura complexa de hospedagem, outro ponto também é a entrega das páginas serem feitas em somente leitura, reduzindo algumas das vulnerabilidades de ataques.

Desta forma não é necessária uma conexão direta ao banco de dados, diminuindo a possibilidade de ataques que possam danificar ou destruir as informações.

Pelo fato de permitir a pré-renderização, os sites não precisam de hospedagem em servidores dinâmicos, permitindo também o funcionamento em todos os dispositivos digitais. O cache pode ser armazenado na rede de distribuição do conteúdo. Sites com Jamstack podem suportar todo e qualquer fluxo de usuários.

Por ter uma melhor otimização de velocidade com as páginas estáticas, os sites com Jamstack possuem um melhor posicionamento no Google, tendo assim uma melhor eficiência SEO.

Serviços como o WordPress acabam exigindo níveis maiores de tráfego e processamento, pelo fato do Jamstack permitir a pré-renderização, os servidores de sites tem baixos níveis de consumo de recursos diferentemente de servidores dinâmicos. No canal do Diolinux no YouTube, temos um vídeo todo dedicado aos tipos de hospedagens.

A qualquer momento que for necessário a migração para um outra hospedagem, basta copiar os arquivos para a nova hospedagem e tudo já deve estar funcionando como antes.Simplificação no sistema de hospedagem, maior segurança e confiabilidade, processamento baixo do servidor, isso porque a entrega do conteúdo já é pré-renderizada, não havendo a dependência de frameworks quase desconhecidos ou de tecnologias proprietárias. Além da manutenção sem muitas complicações, por conta da sua simplicidade na hospedagem.

Mudanças no layout dos sites feitos com o Jamstack podem ser feitas sem muita complicação.

Pontos fracos do Jamstack

Como o seu conteúdo é pré-renderizado, deve ser feita outra compilação em casos em que esse conteúdo seja atualizado.

Para usuários acostumados a terem um editor visual de publicações similar aos de serviços como WordPress, ferramentas como o Prose.io servem como uma solução para os autores e produtores de conteúdos.

Escrito em Javascript o Snipcart serve como um carrinho de compras e permite implementações por parte dos desenvolvedores, outras opções viáveis seriam o botão de comprar do Shopify ou o Foxycart.

Lidar com estilizações em CSS, pode não ser uma tarefa fácil para o usuário acostumado a personalizar templates, a personalização do layout da página nesse caso precisa ser feita escrita em código.

Em casos de falha na disponibilidade da hospedagem, as chamadas de APIs podem falhar, ou seja, toda a aplicação não funcionará até que a hospedagem seja restabelecida.

Se você tiver alguma dúvida sobre tecnologia, ou quiser compartilhar conhecimento com a comunidade, o Diolinux Plus é o espaço ideal para isso. Venha fazer parte da nossa comunidade!

Até a próxima!

Diolinux Ofertas - Aproveite os melhores descontos em diversos produtos!