Building My Personal Website with AI gen Next.js Codebase and Notion API
Frontend
Backend
Welcome to my first blog post! I'm excited to share that this website is powered by an interesting tech stack: Next.js for the frontend and Notion as a CMS (Content Management System).
How It Works
The setup is quite elegant: I write all my content directly in Notion (like this post you're reading), and through the Notion API, it gets automatically published to my Next.js app hosted on Cloudflare pages and workers. This gives me the best of both worlds:
- Easy content management through Notion's familiar interface
- Fast, SEO-friendly rendering with Next.js
- Version control and content organization built into Notion
Technical Implementation
The integration works by:
- Fetching content from Notion's API
- Converting Notion blocks to React components
- API calls with Cloudflare workers using Edge Runtime
- Rendering in frontend NextJs with Cloudflare pages
I'll be sharing more technical details about this setup in future posts. Stay tuned!