oopy.io, super.so 대체제를 찾아서 (feat. Notion X)

정원희님께서 투고하신 개발자 이력서 작성하기 (feat. 이력서 공개) 글을 보고 '나도 이력서 만들어야 하는데..' 생각만 하고 잊고 지내다가 1년이 지나서야 다시 생각나서 이력서를 작성했다.

노션으로 이력서를 작성하고 난 뒤 웹 페이지로 공유해서 브라우저로 열었더니 아뿔싸 세상에 공유한 페이지에서는 다크 모드를 지원하지 않는다. '뭔가 환경설정이 있겠지..'하고 구글링해보니 그런 거 없단다.

그래서 더 찾아보니 노션 웹 페이지를 다크 모드로 변경하려면 oopy.io나 super.so를 사용하면 되는데, 이 서비스들이 유료다. oopy.io는 월 5,900원, super.so는 월 12달러.

블로그라던가 회사에서 운영하는 페이지처럼 월 방문자 수가 높거나 그만한 수익이 발생하는 페이지라면 충분히 투자할만한 금액이긴 한데, 어차피 이력서이기도 하고 페이지 방문이 그렇게 잦을 것 같진 않아서 다른 방법을 찾기로 했다.

그러다가 노션 페이지를 렌더링해주는 React 라이브러리를 발견했다.

이 라이브러리 개발자는 친절하게도 React를 전혀 몰라도 사용할 수 있는 Starter Kit도 제공하는데, 사용 방법이 무척 쉽다. 얼마나 쉽냐면, React 코드를 한 줄도 건드리지 않고 단 하나의 설정 파일(site.config.js)만 수정하면 된다.

아쉬운 부분이라면 모바일 환경에서 좌우 여백이 너무 좁고, 북마크 블록의 썸네일이 보이지 않아서 입맛에 맞게 수정을 좀 해야 했다.

이게 다 다크 모드때문에 시작된 ... 누군가에게 도움이 되길 바라며,

P.S. 원래는 비개발자도 쉽게 따라 할 수 있도록 최대한 상세하게 GitHub랑 Vercel 회원가입 화면까지 캡처하면서 글을 쓰고 있었는데 favicon 변경하는 게 어려울 수 있겠다싶어서 중도 포기. (...)