<aside> 😀 这里写文章的前言: 一个简单的开头,简述这篇文章讨论的问题、目标、人物、背景是什么?并简述你给出的答案。

可以说说你的故事:阻碍、努力、结果成果,意外与转折。

</aside>

Hello everyone, this is my blogpost "Another blogpost"!

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. ✌️ nice icon

bookmark

React Refs with TypeScript

Radix Icons

🪄 How does it work?

  1. Write blogpost in Notion
    1. abc
    2. edf
  2. Use Notions public API
  3. Profit!

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?

block-testcases

<aside> 💡 callout

content

</aside>

<aside> <img src="/icons/alien-pixel_yellow.svg" alt="/icons/alien-pixel_yellow.svg" width="40px" /> callout with icon

</aside>

<aside> <img src="https://cdn1.iconfinder.com/data/icons/city-flat-2/512/bus_transport_transportation_travel_vehicle_public-1024.png" alt="https://cdn1.iconfinder.com/data/icons/city-flat-2/512/bus_transport_transportation_travel_vehicle_public-1024.png" width="40px" /> bus

</aside>

<aside> <img src="https://prod-files-secure.s3.us-west-2.amazonaws.com/0bb5601d-5b11-49c2-a0fd-29f4c2b522b6/b4bd0f85-9cf1-4cb3-856d-d6325d57a049/twitter-2935414_1280.png" alt="https://prod-files-secure.s3.us-west-2.amazonaws.com/0bb5601d-5b11-49c2-a0fd-29f4c2b522b6/b4bd0f85-9cf1-4cb3-856d-d6325d57a049/twitter-2935414_1280.png" width="40px" /> twitter

</aside>

🎉 Source code

Get the source code at my github repo: https://github.com/samuelkraft/notion-blog-nextjs