Skip to content
Lucas Caton

Migrei meu site para Next.js

Depois de usar WordPress, Enki e Jekyll, meu site finalmente est√° como eu quero e usando React!

Lucas Caton

Lucas Caton

@lucascaton
Criei esse site/blog em 2009 usando Wordpress. Depois migrei para Enki mas acabei voltando para o Wordpress. Parece que foi ontem que refiz tudo do zero, mas na realidade foi em 2017, quando comecei a usar Jekyll para gerar um site est√°tico pela primeira vez.

Por que mudar novamente?

Jekyll me serviu bem, mas desde o ano passado eu notei que precisava de algo ainda mais flex√≠vel e com melhor performance j√° que gerar o site (aka. processo de build) e tamb√©m renderizar p√°ginas em ambiente de desenvolvimento estava deixando a desejar. Aproveitei que estava estudando Next.js e decidi us√°-lo no site novo para ganhar experi√™ncia na pr√°tica. A migra√ß√£o foi bastante lenta, pois eu n√£o tinha pressa e queria experimentar combina√ß√Ķes de bibliotecas e solu√ß√Ķes diferentes, que vou detalhar mais na sess√£o "Stack" abaixo.

Processo

Em vez de reusar o mesmo repositório, criei um novinho em folha. Eis o primeiro commit, que aconteceu há mais de um ano:
commit 7fdcbe4
Author: Lucas Caton
Date:   Thu Jun 11 17:21:21 2020 +1000

    Initial commit from Create Next App
Depois de alguns meses, o site estava longe de estar finalizado, porém estava bom o suficiente. Como eu sempre sigo a idéia de que feito é melhor que perfeito, decidi colocar no ar, sem muito alarde. Só agora porém, meses depois, parei para escrever um post e contar essa história.

O quanto "pronto" eu esperei para colocar no ar?

Só nesse repositório novo, já foram 441 commits:
‚ĚĮ git shortlog -sn
   441  Lucas Caton
Mas ainda tem muitas coisas para arrumar. Você provavelmente vai encontrar algumas partes meio feias, inacabadas ou até mesmo inexistes no site novo (não tem mais uma busca, por exemplo). Aos poucos, eu farei melhorias incrementais para re-adicionar o que falta e/ou corrigir o que precisa.

Valeu a pena?

Tudo saiu melhor que o planejado e talvez eu escreva posts separados no futuro para contar os vários motivos. De forma resumida, a flexibilidade e performance que o Next.js e o React têm, mudaram o jogo para mim. Falando nisso, deixa eu contar quais bibliotecas e ferramentas exatamente que o site novo está usando:

Stack

Mudei do GitHub Pages para a Vercel

Migrei para a Vercel por 3 motivos:
  • Melhor integra√ß√£o com o Next.js
  • Deploys mais simples
  • Plano gratuito bastante generoso

O que eu NÃO estou usando

  • Biblioteca com componentes prontos, exemplo: Bootstrap, Bulma, etc.
  • Pr√©-processador CSS, exemplo: SASS, SCSS, Slim, nem nenhum outro. Apenas Tailwind e CSS puro.

Layout próprio

Eu criei a UI de todas as p√°ginas, menus, componentes, etc. Em todas as vers√Ķes anteriores, eu usava templates prontos, mas resolvi eu mesmo criar um dessa vez. Ainda estou atualizando/melhorando v√°rias partes que precisam de um pouco mais de amor :)
Screenshot do site novo criado em 2021

Feedback

Para concluir, eu adoraria saber o que voc√™ achou do site novo. Me conte nos coment√°rios abaixo! ūüėČ