Zeroseuns
Jamstack

Desenvolvimento de Blog com Jamstack

Lucas
16 dezembro, 2020
Desenvolvimento de Blog com Jamstack

A criação de um blog com JAMStack permite sites mais rápidos, maior segurança e um custo muito menor em matéria de hospedagem. Não sem motivo, cada vez mais se busca por informações sobre ele.

O que é JAMStack?

Antes de entrar no mérito da criação de um blog com JAMStack, a melhor forma de indicar o que é JAMStack é pelo seu nome. O termo “Stack” indica que se trata de um conjunto de linguagens. Neste caso, refere-se ao grupo constituído de Javascript, APIs e Markup (JAM).

Blog com JAMStack
Apesar de ser fácil, um blog com JAMStack pode ser muito melhor com conhecimento técnico.

Por meio de uma plataforma, websites e aplicativos podem ser publicados e visitados sem necessitar de um servidor. Portanto, um blog com JAMStack pode ser servido diretamente de uma CDN para o utilizador, o que resulta em menor tempo de carregamento e uma experiência muito mais fluída.

Quais são os requisitos?

  • É preciso um conhecimento razoável de Javascript para trabalhar com o seu site ou blog com JAMStack.
  • O guia de boas práticas dita que uma página criada com um CMS ou qualquer tecnologia de renderização não se enquadra nesse Stack. Por isso, tem-se no caso do JAMStack o WordPress Headless.
  • Também não se fala em JAMStack quando há alguma tecnologia similar ao Node ou Ruby em backend.

Por que criar um site ou blog com JAMStack?

Melhor Performance. Todos os benefícios do uso de uma CDN, com a remoção da carga e do tempo perdido com o carregamento das páginas.

Maior Segurança. Com o uso de aplicações em separado para dados sensíveis como os de login, uma possível invasão terá acesso somente aos códigos das páginas estáticas e nada mais.

Maior Facilidade de Uso. Não há necessidade de configurar servidores.

Escalabilidade. Como é comum com o uso de CDN, é fácil migrar de plano e fazer um upgrade caso seja necessário.

Como criar um blog com JAMStack?

O desenvolvimento de um blog com JAMStack pode ser dividido em pouquíssimos passos. O tempo que se leva para tê-lo pronto, no entanto, depende do processo decidido pelo utilizador.

Primeira etapa do desenvolvimento

Para desenvolver o seu blog com JAMStack, pode-se optar por uma das seguintes alternativas:

  1. Codificação manual: no caso de páginas bastante simples, codificar HTML manualmente pode ser uma opção.
  2. Geradores de sites estáticos: é a opção de muitos blogs com JAMStack. Algumas ferramentas úteis que podem ser citadas são Gatsby, Nuxt, Next.js, Hugo e Jekyll.
  3. JAMStack Framework: bibliotecas de Javascript como React, Vue.js e Preact podem auxiliar na criação de uma interface de usuário.

Implementação: os passos seguintes

Desenvolvido o blog com JAMStack, é hora de tê-lo hospedado e facilmente acessível em todo o mundo. Há diversas alternativas disponíveis online, inclusive gratuitas, como:

  • CloudFlare
  • Netlify
  • Github Pages
  • Stackbit

Existe CMS para JAMStack?

Aos que indagam sobre o uso do WordPress com JAMStack, existem plataformas CMS no mercado (Headless CMS) que administram o conteúdo backend a ser publicado. Alguns exemplos são:

  • Netlify CMS
  • Ghost
  • Strapi
  • GraphCMS
  • Contentful
  • Kontent
  • Headless WordPress

Posso usar WordPress com JAMStack?

Sim, pode-se usar o WordPress com JAMStack no seu formato Headless, ou seja, sem tema. Isso é feito por meio de uma API REST. Por isso, o uso de recursos para carregar o site baseado em WordPress é bem menor.

Então, o utilizador tem a opção de manter o painel do CMS WordPress com o qual está acostumado, e ainda assim desenvolver o seu blog com JAMStack.

Exemplo de criação de blog com JAMStack no Netlify CMS

As imagens abaixo indicam, somente como exemplo, a criação de um blog com JAMStack com a utilização do Netlify CMS.

Blog com JAMStack e Netlify
Página inicial do Netlify CMS para um desenvolvimento mais organizado do seu projeto.

Ao abrir o site do Netlify CMS, pode-se clicar em “Get Started” para abrir a página onde se escolhe o serviço de criação de site estático que utiliza.

Blog com JAMStack e Gatsby
Esses são alguns exemplos de serviços de criação de página estática.

Ao clicar no botão “Deploy to Netlify”, será preciso logar com a sua conta GitHub ou Gitlab, onde ficarão hospedados os repositórios. Basta entrar com o seu login e criar um nome para o repositório.

Blog com JAMStack e GitHub
Conecte-se com uma conta GitHub, onde será criada uma nova pasta.

Caso tenha interesse em mudar a URL, vá em “Site Settings”, “Site Details” e, por fim, em “Change Site Name”. Então, poderá começar a explorar o CMS da Netlify.

Claro que, no caso dos programadores, é possível criar os seus próprios arquivos .md para publicar diretamente via push.

Blog com JAMStack e Postagens
Screenshot da interface para criação de um blog com postagens simples.

Conclusão

A criação de um site ou blog com JAMStack permite a publicação de páginas fluidas e de um ambiente seguro para os seus dados. No entanto, bons resultados exigem alguma habilidade como programador. Portanto, algumas pessoas poderão necessitar de auxílio.

Ficou claro também que, com o uso de APIs e da hospedagem em CDN, as páginas estáticas estão longe de deixarem a desejar em conteúdo. As páginas podem ser interativas, além de conter fotos e vídeos como todo blog ou site de qualidade.

Antigamente, os visitantes da sua página solicitava os dados para ter acesso à interface, o que gerava um processo longo e demorado. Hoje, recebe-se todo o código em Markup já processado. Esse ganho de rapidez se traduz também no ganho de engajamento.

Agora, vá montar o seu blog, cative visitantes e veja como criar conta no Adsense para monetizá-lo.