This Notion React Website

This Notion React Website

Status 1
notion image
I customized and deployed this website that you're looking at on the top of open source Notion to React libraries. Notion makes it so easy to host a personal website. I love Notion as a CMS because it's always open, has great formatting and building blocks. I can embed all kinds of content - tweets, YouTube videos, Loom recordings. And with just a few clicks, I can deploy a new page to my site. No manual intervention required.
I used to power my personal site with a platform called Potion since 2020. It was built on the same open-source Notion library I discovered on GitHub. So I cloned the library, cloned the project, and started tinkering to create my own website.
Now I have even more control over the types of content and functionality I can add. Updating SEO titles and meta descriptions is a breeze. I've enabled Next.js's image optimization to load photos faster.
Some of the things I've learnt along the way.
  • How to clone/fork an open source library, customize it, and deploy it on Vercel
  • Done a lot of CSS customizations for it to look the way I wanted it to
  • Building locally using npm run dev
  • Debugging issues with npm/yarn conflict on Vercel
  • For the first time I deployed Redis caching, it reduces the number of API hits and makes it faster
  • I deployed it to Vercel's superfast network for fast loading
It's got great loading speed as shown by this lighthouse score.
notion image
I think everyone should have a personal website. No guidelines to follow, no standard platforms with the same look and feel. It's your own little corner of the internet where you can do whatever you want.