I use Notion daily and I’ve been always thinking of how to use it more often for different use cases. Releasing the Notion API was a game changer and simple notepad became a professional tool for developers, but also easy to use database for no-coders.
There’s no easier tool for writing articles than your notepad. Notion is mine and I would like to use it for everything, but also as a content management system for my website. Instead of using overkills like WordPress or building another custom portfolio page, I decided to go with the simplest available solution. The only important part of the website is the content anyway!
Content like text, image, video or 3D is more than design, typography or colours… Content is the
king queen! It’s not the design, icons, typography or colours. All of these components are present just to improve usability and provide an easier way to get the right information.
The easiest solution is using paid services, but the hacker inside me wouldn’t allow me to not try a custom open source code. It’s not that complex, but you have to have some minor knowledge about Node.js and git.
SASS - Monthly subscription
- https://super.so/ - 12$
- https://www.simple.ink/ - 12$
- https://popsy.co/ - 8$
- Github - Minimal Notion Blog - 0$
- Your domain - 10$ / year
- Vercel hosting - free
Visit this git repo and fork it
Edit the Notion page ID and all your usernames that are used in the footer’s link. You can do it directly in Github so you don’t need to run your local Node.js server if you don’t know what to do.
Make sure your notion page is shared on the web.
Create an account in Vercel by using Github and import your notion repository. The build will run automatically and you’ll get the link to your new website in 1-2mins.
You have to set up your CNAME and A DNS records in your domain settings, but Vercel will help you with that.
G-53XJKCMZDHtag with your one.
It’s personal preference, but I changed the dark theme to a light one in
var preferDarkQuery = '(prefers-color-scheme: dark)’ 👇 var preferDarkQuery = '(prefers-color-scheme: light)’
If you want to modify some styles, change CSS properties in
Star the GitHub repos and show some love to hackers that allowed us to run the Notion on our custom domains 🙂 Plus, let me know if this article was useful and if you needed more information.