Here: this website

This website is an experiment using Notion as a CMS. This allows me to have a much better editing experience, which should encourage me to write more content and keep the content more up to date.

The process for updating content is easy as editing in Notion and triggering a rebuild/redeploy (at least in theory).

The site is built using Astro, which statically generates the site and helps me minimize the amount of JavaScript that’s sent to the client. Fun fact: everything on this website should work without JavaScript.

You can find the source code to this site on GitHub. Feel free to file issues if you find a bug.


Below (the divider) is what I used to test the Notion parser that I “wrote” (copied a lot of code from existing solutions) to convert Notion blocks to Markdown, which is then rendered using Astro’s built-in support for Markdown (underneath the hood, it uses remark-rehype).

Milestones

Some tasks that I’m proud of completing while building this website:



Tasks

 done


Ideas



heading 1

heading 2

heading 3


rich text testing bold text italic text underline text strikethrough text all four styles


rainbow text

red pink purple blue green but override to be red yellow orange brown gray

default


colored link text but this is also colored text


colorful list text:


interesting edge case:

what if the entire paragraph is italicized what if the entire paragraph is bolded

might mess with line breaks

and also,

what if the entire paragraph is italicized but with a link inside

ok but what about if there’s a less than symbol: <3? or greater than: >3?


paragraph text

  1. organized list
  2. another item
    1. nested item

quote

  1. hello world
  2. hello world 2

inline code block this is like code thingy

function parse() {
	return "hello world";
}

some summary some details about something

who knows



E = mc^2


<span class="!bg-gray-200">hello
hello
hello</span>

tables

without column or row headers

column acolumn bempty stuff
hihello
byegoodbye

with column and row headers

simple tableab
1a1b1
2a2b2

testing links in the paragraph. (this stuff in the parentheses) should link to robinhood.com (as should this link).

todo list



multiple images and files below

Arc browser badge for Andrew with subtitle ‘Vague Big Shot’ Watercolor painting by Hayao Miyazaki PDF file containing EQ settings for the Sennheiser HD599 headphones

This browser doesn’t support embedded PDFs.

http://google.com

https://soundcloud.com/herbbeatz/moving?in=kungpaogao/sets/corncorncorn

https://www.google.com/maps/place/Breakneck+Hill+Conservation+Land,+Southborough,+MA+01772/@42.2724994,-71.5345255,14z/data=!4m5!3m4!1s0x89e38a6ff7c803af:0x88e2e02613bc306f!8m2!3d42.2853249!4d-71.5145283