Next.js static blog using Notion as a Content Management System (CMS). Supports both Blog format Post as well as Page format for Resume. Deployed using Vercel.
π Writing posts using notion
- No need of commiting to Github for posting anything to your website.
- Posts made on Notion are automaticaly updated on your site.
π Use as a page as resume
- Useful for generating full page sites using Notion.
- Can be used for Resume, Portfolios etc.
π SEO friendly
- Dynamically generates OG IMAGEs (thumbnails!) for posts. (og-image-korean).
- Dynamically creates sitemap for posts.
π€ Customisable and Supports various plugin through CONFIG
- Your profile information can be updated through Config. (
site.config.js
) - Plugins support includes, Google Analytics, Search Console and also Commenting using Github Issues(Utterances) or Cusdis.
-
Star this repo.
-
Fork the repo to your Profile.
-
Duplicate this Notion template, and Share to Web.
-
Copy the Web Link and keep note of the Notion Page Id from the Link which will be in this format [username.notion.site/
NOTION_PAGE_ID
?v=VERSION_ID
]. -
Clone your forked repo and then customize
site.config.js
based on your preference. -
Deploy on Vercel, with the following environment variables.
NOTION_PAGE_ID
(Required): The Notion page Id got from the Share to Web URL. This is not the entire URL, but just the NOTION_PAGE_ID part as shown above.NEXT_PUBLIC_GOOGLE_MEASUREMENT_ID
: For Google analytics Plugin.NEXT_PUBLIC_GOOGLE_SITE_VERIFICATION
: For Google search console Plugin.NEXT_PUBLIC_NAVER_SITE_VERIFICATION
: For Naver search advisor Plugin.
Click to see guide
-
Prepare Notion, Vercel account.
-
β
Star
andFork
this repo.
![](https://private-user-images.githubusercontent.com/6457691/243072736-b0421776-2bfe-42bc-ae31-d90206fd5789.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3MjczNi1iMDQyMTc3Ni0yYmZlLTQyYmMtYWUzMS1kOTAyMDZmZDU3ODkucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9ODZkNDZmYjQ4MWJkYmYwYmZlMjZlMzI1ZGExNmEwOGNkZWE0ODBmNTE1MWRmMjg3ZGQ3NmU1ZTJhMTg1ZTM0NiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.OcNFZxfpzTgNDNqH8p1PC0Muzyq4RrYZXR7DztCc6ok)
![](https://private-user-images.githubusercontent.com/6457691/243072742-185a8e4c-4ae2-4a38-b6f4-dc2a06a45c28.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0Mi0xODVhOGU0Yy00YWUyLTRhMzgtYjZmNC1kYzJhMDZhNDVjMjgucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9MmI2YmY3MTM3NGRlZjJiN2NjNmRlNWIzNGY0NDdmNjc3ZDhkNmUwMjdlMDdkOTNjMjM1OWFkODhiMDVlOGNiNyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.8DOHfhtb9-oGumU6yvvtYvoL1YfxONHvL7wIyLIlZ8c)
- As you
click
the Notion template, you will see this notion page in your browser. ClickDuplicate
button(볡μ in image) in right top.
![](https://private-user-images.githubusercontent.com/6457691/243072743-a5375429-28f0-4bba-a355-0d391cad58db.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0My1hNTM3NTQyOS0yOGYwLTRiYmEtYTM1NS0wZDM5MWNhZDU4ZGIucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9Zjc1OTkxNGNmOGNmY2MwYmRlNWJiZmI4N2M5YjE5ZTM5YjhlZjk2OWUwNmYwMGQ0ZWI3MmIxZDE0MjMyMDk4YyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.AjaBpHGkbwDlcWj7efwU-lKBtkS9d444qJyDVfDINdk)
- And you will see
notion page in notion app
in your account.
![](https://private-user-images.githubusercontent.com/6457691/243072744-09af5533-43d9-48e5-95eb-dcac84c97c1f.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0NC0wOWFmNTUzMy00M2Q5LTQ4ZTUtOTVlYi1kY2FjODRjOTdjMWYucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YmZiY2Q0YzFjMjIzNmNiNzM1YzVmZjE2OTlmMGRlZTM1NWNiYzdkMTg2YWE1ZWRkZWNmYmI5ZTBkOTE0ZDY3MyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.zbWPqH6MhxoBRZzpZmrcSgwwur-fZwv-we9YA9sHa5Y)
- Click
Share
andPublish
in right top, and check web link. (Copy web link)
![](https://private-user-images.githubusercontent.com/6457691/243072746-886fe4a2-79ca-4dbc-b1e1-93984e7e3f44.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0Ni04ODZmZTRhMi03OWNhLTRkYmMtYjFlMS05Mzk4NGU3ZTNmNDQucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9ZDUzOGM2OWQ3NzUxMGU0MGRiOGMxYmM1NzRlZTdlYjA3N2JmYTViYjEyYWVkZGQwMGY1ZGRhMzcxNjcwZGI2NyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.5kVP85nXsP-Hlk44MOxvc2WmtqvlWd7GFqyAn_yY_5c)
Modify
site.config.js file in your forked repo.
π‘ NOTE. I changed 2 RED PART
![](https://private-user-images.githubusercontent.com/6457691/243072747-3d9c0da5-92bc-4372-8752-7bfc810b4986.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0Ny0zZDljMGRhNS05MmJjLTQzNzItODc1Mi03YmZjODEwYjQ5ODYucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YTczYTZiOWUzM2YxMDg5ODYxNDZlOWNiN2Y4NzJlM2Y5MWMzNzc0MmJiNjE3YTMzOGRiMDZiMDRiMzJhMzZkZSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.W_zBWqjb209WlcLNSgBmLICsWvpY1DrW2QlNNk4cBRI)
- Move and
login
to vercel.
![](https://private-user-images.githubusercontent.com/6457691/243072749-07742ad0-4766-43b0-9ebd-5311f9711bc2.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0OS0wNzc0MmFkMC00NzY2LTQzYjAtOWViZC01MzExZjk3MTFiYzIucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9ZmI1YTQyMWNiMzZmMTA3YTJhY2EyZmQ5N2I1MGZkYmFiZjQzOGFhM2VkYTAwY2E2YjgyYTNjYzYxMGU2MzVmZSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.r8_PlbZ6sbmXWDQW11O4ZdQ-lWTaeRab3ateTQPWFEs)
Build
new project using Add New...
![](https://private-user-images.githubusercontent.com/6457691/243072748-517d46be-c9bf-4181-aaa5-e9bd2fcdc822.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0OC01MTdkNDZiZS1jOWJmLTQxODEtYWFhNS1lOWJkMmZjZGM4MjIucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9Nzg3NWZiYzhkZDA3Y2E4NmY0Nzc3MTQ0NGNjNWI5OTEwZDY2NGYwYTM3OGYzOTZiNmI1YjhkYzc3ZDAzMjBlOSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.BSII292bZikKX0LG-DXjXgzS4DioF_x0gRQZVd3f8BI)
Import
your forked morethan-log repository
![](https://private-user-images.githubusercontent.com/6457691/243072749-07742ad0-4766-43b0-9ebd-5311f9711bc2.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc0OS0wNzc0MmFkMC00NzY2LTQzYjAtOWViZC01MzExZjk3MTFiYzIucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9ZmI1YTQyMWNiMzZmMTA3YTJhY2EyZmQ5N2I1MGZkYmFiZjQzOGFhM2VkYTAwY2E2YjgyYTNjYzYxMGU2MzVmZSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.r8_PlbZ6sbmXWDQW11O4ZdQ-lWTaeRab3ateTQPWFEs)
Add
Environment variabes to vercel project
![](https://private-user-images.githubusercontent.com/6457691/243072751-703b50a3-3a90-4915-ab73-1baca4c285f8.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc1MS03MDNiNTBhMy0zYTkwLTQ5MTUtYWI3My0xYmFjYTRjMjg1ZjgucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YmRkYjllODg2ODY3NzUwZDE5MmE5NmEwYmE1NTg0ZWI0OTBhNzI1MjljNDdlOWY4MWY0ZjA4YzBkZGU3ODVmOCZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.k1R4-_2tCWAdBYFSCn3BZtCtXZ-W9nf0NiTs3SloFQ0)
Wait
for the deployment to complete. After the deployment is successful, you should see an image like the one below.
![](https://private-user-images.githubusercontent.com/6457691/243072752-a7d72caa-4354-4f81-9577-c773faeed7c6.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc1Mi1hN2Q3MmNhYS00MzU0LTRmODEtOTU3Ny1jNzczZmFlZWQ3YzYucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YTBlMzQxYzI4YTU2NmM2MWFmYWJmZjg3N2RjYTc3Mzk0MzY1OWNmNmIyOWRmNDNhOTY2MjJiOWRiZGRkMDVkMCZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.4-jWfXsf8az26hLpgL1ou7crmfw2oW4L4EkTQYt9-ZI)
π₯³ Congratulations. Now check out your blog
![](https://private-user-images.githubusercontent.com/6457691/243072753-3876a273-a270-47ef-a2ad-663519d9e537.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxMjEzMzMsIm5iZiI6MTcyMjEyMTAzMywicGF0aCI6Ii82NDU3NjkxLzI0MzA3Mjc1My0zODc2YTI3My1hMjcwLTQ3ZWYtYTJhZC02NjM1MTlkOWU1MzcucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNyUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjdUMjI1NzEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9OWNjZDU4Y2QxZDhjMThkZmU0ODhlZDMwNTA0MWI2N2NlYjM0NTM3MjllYzdlZjI2YzM2ZTBhNDQ3MDI3OTdkYiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.-U50AbTL-PVwuYGc7anyt8vxmxIUva0p8BX3ZzTF7d8)
Check out the Contributing Guide.
morethan-log is an MIT-licensed open source project. It can grow thanks to the sponsors and support from the amazing backers.
The MIT License.