Hello world!
Hello everyone, this is my blogpost "Hello world!"
It's written in Notion and pre-rendered on this page using Next.js getInitialProps. It also uses Incremental Static Generation with the validate option so the content updates when the source is edited.
🪄 How does it work?
Now I'm just writing placeholder content to try out the different blocks available. How about a link, bold text, strikethrough text, italic text and code? Colored text?
🎉 Source code
Get the source code at my github repo: https://github.com/samuelkraft/notion-blog-nextjs
🤔 What about a fancy table block?
❌ Unsupported block (child_database)The notion API only supports a couple of basic text-like blocks as specified in their documentation
Supported blocks:
Heading 1
Heading 2
Heading 3
Paragraph
What is this?
It's the children of a toggle!
A simple quote block
export const getDatabase = async (databaseId) => {
const response = await notion.databases.query({
database_id: databaseId,
});
return response.results;
};
Sub-page
![Notion-hosted image](https://prod-files-secure.s3.us-west-2.amazonaws.com/050e013b-3fee-4ab1-ba4e-89f3cd4c837c/d61aedd6-da5f-473d-a08a-da664b6c1456/isaac-martin-Apkr4nfK1mU-unsplash.jpg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIAT73L2G45HZZMZUHI%2F20240621%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20240621T170604Z&X-Amz-Expires=3600&X-Amz-Signature=9c0dc4824f3e2c2b2ce7c59ad692798e64a57a839c35b4c0a508898c0170a739&X-Amz-SignedHeaders=host&x-id=GetObject)
Customizing
To edit a block change the renderBlock function in [id].js
✌️
← Voltar