Meu post anterior explicou por que estou de saco cheio de React e por que decidi migrar meu site para Nue.js. Neste post, documentarei os passos que tomei para migrar meu site de Next.js para Nue.js.
Migrando os posts
Como os posts são a parte mais importante do meu site, decidi migrá-los primeiro.
Criei um novo projeto Nue.js com nue create blog, e toda a estrutura já estava lá. Só precisei fazer alguns ajustes:
- Decidi criar uma pasta para cada post, com um arquivo
index.mde as imagens (se houvesse) dentro dela. - Mudei os posts do site antigo para essas pastas e renomeei os arquivos adequadamente.
- Adicionei um campo de data ao cabeçalho de metadados de cada arquivo Markdown.
- Tive de fazer alguns pequenos ajustes nos estilos dos posts.
- Otimizei as imagens, que não eram otimizadas no meu site antigo.
- Corrigi alguns erros de digitação nos posts (muito feio, muito feio).
Nesta oportunidade não mudei nenhum estilo. Então meu blog se parece bastante com o site do Nue.js, que suponho serem seus estilos padrão.
Fora isso, a configuração padrão do template Nue.js já cobre o básico para ter um blog funcionando.
Conheci o criador
Durante esse tempo, entrei no canal Slack do Nue.js e conversei com o criador do Nue.js, Tero Piirainen. Ele é um cara incrível e educado, com uma visão extraordinária.
Eu estava tendo dificuldades com um componente para formatar datas nos meus posts. E descobrimos que a documentação do Nuedom estava errada. Descobrimos isso juntos, e Tero corrigiu a documentação. Simples assim!
Recomendo muito entrar no canal do Slack e fazer contato. A comunidade é amigável e prestativa.
O primeiro commit
Fiz o primeiro commit com a estrutura básica que veio com o template e os arquivos Markdown dos meus posts.
O único arquivo de configuração é o site.yaml. Sem biome, sem next, sem prettier, sem tailwind, sem outras configurações. Também decidi ser enxuto e usar parte da formatação fornecida pelo próprio editor (Zed, no meu caso). Outra opção é usar a extensão Editor Config para VS Code ou qualquer outro editor e ter um arquivo de configuração na raiz do projeto. Optei por não usá-la.
Minha prioridade principal nessa migração é evitar cair na armadilha de Node.js e node_modules. Quero manter minhas dependências ao mínimo e evitar inchaço desnecessário.
Já acabou? Meu Deus!
Bem, foi rápido.
Literalmente criei alguns arquivos CSS, adicionei um pouco de markup ao index.html, personalizei um pouco o estilo, adicionei meu perfil e favicon e pronto!
Não tenho muito mais a dizer, na verdade. Certamente tive de fazer uma desintoxicação de Tailwind e voltar a escrever CSS puro, o que foi revigorante. Eu estava enferrujado. Tailwind nos deixa preguiçosos.
A mesma funcionalidade que meu site tinha está pronta, com menos de 10 arquivos, se não considerar os posts. Tudo escrito praticamente em um padrão, com conhecimento puro de JavaScript, CSS e HTML. Isso é ótimo!
O mais importante é que não há node_modules, dependências estranhas e fora do padrão. Apenas Nue.js e sua estrutura central baseada em padrões.
Servidor versus páginas dinâmicas
Esta é uma das coisas que mais me confundiu.
Nue.js renderiza documentos HTML no servidor se detectar que não há conteúdo dinâmico neles. Um conteúdo dinâmico é qualquer coisa que depende do comportamento do navegador para funcionar, como o clique de um botão ou o envio de um formulário.
Você também pode dizer ao Nue.js como tratar seu HTML:
<!doctype html>é um arquivo de servidor.<!doctype dhtml>é um componente dinâmico.<!doctype libé uma biblioteca de componentes e módulos de layout.
Se tentar usar uma API do lado do cliente, como localStorage, em um HTML de servidor, verá um erro no console. Portanto, tente ter atenção onde usar determinadas APIs.
A documentação do Nue.js sobre tipos de arquivos HTML entra em detalhes sobre esse assunto.
Deploy
O site está migrado, e agora é hora de escolher uma hospedagem para servi-lo.
Perguntei ao próprio Tero se tinha alguma recomendação de hospedagem, e ele indicou Cloudflare. Como meu domínio e DNS estão lá, decidi seguir sua recomendação.
De fato, o Cloudflare Pages torna tudo tão ridiculamente simples que, para testar, eu apenas compilava a aplicação Nue.js localmente, criava um arquivo zip com os assets e fazia upload. E pronto. O site estava online. Isso, claro, considerando que o site é estático. Não tentei fazer deploy como uma aplicação com servidor.
Depois disso, configurarei uma conexão automática com o Github para fazer deploy a partir do branch main.
Conclusão
Estou bastante surpreso com o quão fácil isso foi. Nue.js nos traz de volta aos padrões e faz isso de uma forma tão amigável e familiar que é quase chocante.
Sem node_modules, bibliotecas fora do padrão, formatadores e linters, sem complexidade. É simples, padrão, suporte de navegador no seu melhor.
Certamente expandirei meu blog com outras funcionalidades. Será interessante implementá-las com Nue.js. Também farei o meu melhor para ser um apoiador e colaborador ativo do Nue.js, porque acredito de verdade em sua missão e propósito.
Mantenham-se hidratados, fiquem seguros.
