Como criar um blog com o Notion através do Next.js
O Notion é uma ferramenta poderosa para organização, colaboração e criação de conteúdo. Com sua capacidade de integração com o Next.js, é possível criar um blog elegante e funcional de forma simples e eficiente.
Passo 1: Configuração do Next.js
Para começar, é necessário ter o Next.js instalado. Caso não possua, siga as instruções disponíveis na documentação oficial do Next.js para a instalação.
Passo 2: Integração com o Notion
Após a configuração do Next.js, o próximo passo é a integração com o Notion. Para isso, é necessário utilizar a API do Notion para acessar e utilizar os conteúdos da sua conta.
Passo 3: Criação do blog
Com a integração realizada, é possível criar o blog utilizando os conteúdos do Notion. Você pode definir templates e estilos personalizados para o seu blog, além de utilizar as funcionalidades do Next.js para otimização de performance e SEO.
Passo 4: Publicação e configuração de domínio
Após a criação do blog, é hora de publicá-lo e configurar um domínio personalizado. Utilize as ferramentas disponíveis no Next.js para publicação e escolha um domínio que represente o seu blog da melhor forma possível.
Conclusão
Com a integração do Notion com o Next.js, criar e manter um blog torna-se uma tarefa simples e eficiente. A versatilidade do Notion aliada à potência do Next.js possibilita a criação de blogs completos e personalizados, sem a necessidade de lidar com complexas infraestruturas de backend. Experimente essa solução e compartilhe sua experiência!
Cara, era exatamente algo assim que eu procurava! Muito obrigado pelo conteúdo! Tô há dias testando frameworks js pra desenvolver um blogzinho, foi svelte, vite, nuxt, o próprio next, mas apanhei pra colocar no github-pages o next, aí fui testando outros… vou fazer um nesse formato aí que achei muito bom pra gerenciar as publicações depois via Notion.
Gratidão!
Coisa linda. Esses dias mesmo eu tava pensando "e se eu pudesse fazer páginas do notion virarem posts de blog?". Muito bom! Obrigado.
Dica: para fazer um "divider" no notion é só digitar — (três traços) e dar enter ; )
E uma dúvida: será que tem como fazer SEO na página do blog, com esse método?
Após 5 meses eu percebi que houve uma mudança na API do Notion impossibilitantando carregar os posts.
Estouroooo estava procurando algo assim! valeu! +1
Krak que dahora, não fiz teste mas sabe se a API do notion da para colocar uma thumbnail TB?
Ótimo vídeo… parabéns
Muito legal essa solução em!! mais um inscrito, e a unica coisa que nao consegui foi colocar as imagens elas sempre vem "quebradas"
CAra eu tentei, esse projeto esta no next 11, e o mias atual é o 13. e esta gerando um monte de erro
mas e quando expirar esse TOKEN do notion ? não vai parar de funcionar ?
Ótimo vídeo! Aqui só não carregou o autor do post e eu não sei o motivo. Fiz exatamente como pediu e até o nome. Saberia algum movito pra isso ocorrer?
Nesse momento , mesmo fazendo o build pela própria vercel nesse mesmo repositório, apresenta vários erros e não chega a fazer o deploy, : Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:71:19)
at Object.createHash (node:crypto:133:10)
at BulkUpdateDecorator.hashFactory (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:138971:18)
at BulkUpdateDecorator.update (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:138872:50)
at /vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:59321:9
at processTicksAndRejections (node:internal/process/task_queues:82:21)
at runNextTicks (node:internal/process/task_queues:64:3)
at process.processImmediate (node:internal/timers:442:9) {
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'
Top de mais meu bom, muito obrigado pelo conhecimento, e já inscrito no canal o/
Nasc alguma dica de com renderizar código HTML diretamente do Notion?
Conteúdo top Nasc!! Você é fera.
muito show, será que tem para VueJS
Bem completo o vídeo. Queria saber sobre o token do notion, vc ja teve algum problema desse token ser trocado? Tenho um blog usando esse projeto e tive esse problema. depois de uns meses do projeto rodando, do nada os postes pararam de aparecer e tive que trocar o token no .env
Excelente!!
Muito massa, adorei o uso e a praticidade com que você fez usando o notion
top! Valeu pelo vídeo
Muito bom, parabéns pelo conteúdo!! 👏👏