Desde a metade de 2021 a ideia era criar site simples sobre meu trabalho e as tecnologias que gosto.
Como fazer? Por onde começar?
Eram questões que sempre me pegavam. Antes desse período eu tinha um site feito com Gatsby. No entanto era super simples e como era antes da pandemia eu não tinha muito como manter por conta de tempo. Além de simples, era feio.
O site que vocês visitam hoje não é lá essa obra arte, mas a ideia dessa vez era diferente: combinar um "semi portfólio" com conteúdo que quero produzir.
Algo que nunca tinha feito antes, e sim, é algo que quero começar a fazer mais para passar algum tipo de conhecimento e valor.
Quais eram minhas ideias para começar:
- Hospedagem viável;
- Tirar algum conhecimento de valor durante o desenvolvimento;
- Mexer com tecnologias que eu gosto;
Alguns outros pontos apareceram mais para frente.
Escolhi React de cara para começar. Algo que gosto muito de mexer faz tempo com algumas de opções de frameworks para escolher.
A primeira escolha de cara foi utilizar Next.js. Para o blog o fluxo seria bem básico: iria fazer os posts utilizando páginas MDX com next-mdx-remote e iria gerando elas a cada build.
Eu terminei o desenvolvimento, terminei o primeiro post. No entanto nunca cheguei a divulgar. No fim, um framework que eu estava super de olho foi anunciado que iria virar open source, o Remix.
Leia sobre o seed funding do Remix.
Pouco tempo depois de ser anunciado open source o pacote foi disponibilizado no npm. Ainda não era a versão de release oficial, mas já foi suficiente para eu ficar fascinado!
Remix é um framework totalmente focado em SSR[1], fundamentos web e UX moderna. Com uma API super simples e enxuta a curva de aprendizado é bem pequena (levando em consideração conhecimento prévio com estratégias de SSR/SSG[2]/ISR[3]).
A estratégia tinha que mudar um pouco. No Next.js eu gerava os posts estaticamente enquanto a aplicação fazia build com os arquivos locais do meu repositório. Como o Remix serve tudo via SSR, gerar os posts estaticamente não seria mais possível.
Parando para pensar, gerar os posts durante a build, acarretaria um problema mais na frente: quantos mais posts, mais tempo iria demorar para terminar de fazer o build. E também sempre que eu precisasse corrigir um erro de digitação, minimo que fosse, eu teria que realizar um build só pra isso.
Comecei a construir uma solução onde eu tinha uma rota na aplicação Remix que recebia o conteúdo do arquivo MDX e armazenava em um Redis.
Terminando de desenvolver, escolhi hospedar na Vercel. Infelizmente me deparei com um problema: o pacote responsável pelo MDX, o mdx-bundler, utiliza uma dependência chamada esbuild. Ao realizar o build na Vercel, o pacote apresentava um erro sem um fix aparente.
Eu queria muito utilizar a hospedagem da Vercel pela facilidade de caching e integração. O que me fez pensar novamente. Porquê gerir um banco de dados, lidar com toda a informação se o que eu quero mesmo é lidar com simplicidade? Foi daí que resolvi partir para uma solução utilizando um CMS Headless.
Collected Notes é um CMS que eu consigo escrever meus posts utilizando markdown mas que ele já me entrega basicamente tudo pronto desde título, headline até o conteúdo já em HTML para renderizar. A implementação daí foi super simples.
Foi overengineering? Talvez, mas quis mesmo utilizar como aprendizado. Aprendi muito sobre Remix, caching, várias coisas sobre fundamentos web, entre várias outras coisas relacionadas a renderização de alguns tipos de conteúdo.
Estou muito feliz com o resultado. Pro futuro quero melhorar o design do site e postar MUITO sobre Remix.
Minha conclusão é: não existe jeito definitivo de fazer algo, existe o que faz sentido para você em determinado momento. E tecnologia não é algo escrito em pedra, é algo que vai mudando, assim como eu espero ir mudando esse site.