How I Use Notion as a CMS (with Next JS)

  Рет қаралды 6,066

Kodaps Academy

Kodaps Academy

8 ай бұрын

Relevant resources :
The Notion template: affiliate.notion.so/my-notion...
My Next JS code (Work in progress !): github.com/Kodaps/gradient-as...
The Notion parse NPM module: www.npmjs.com/package/@kodaps...
The Notion Parse code: github.com/Kodaps/notion-parse
-------
I use Markdown to store the static content for my NextJS websites. There are many reasons why: it’s free, it’s open, it’s portable, it’s editable, and there is no buyer lock-in.
However, on my personal blog, I now have about 75 blog articles in both French and English. And it is becoming difficult to get that content correctly organised.
I’ve explained previously how I ensure that the data stored in the FrontMatter follows the right shape using an SDK called ContentLayer.
But is there a way to better organise it?
I want something trivial to set up. I want to be able to edit content on my phone when I’m commuting to work. I’ve tried different solutions, but I’ve settled on using Notion to track all my content.
If you don’t know Notion, it’s a free tool for organising your life. And it allows you to easily set up tables with custom fields. And that’s great for my content because each type of content has different fields. For example, I have a table for blog posts, one for pages, and one for newsletter issues (incidentally, I’ve provided a link in the description if you want to sign up).
The reason why Notion, Markdown and ContentLayer are a perfect fit for my use cases and my situation is because all three allow you to define your data schema in the content itself.
So, what happens when I want to update content? I run a script that downloads data from Notion and saves it as Markdown. I’ll explain how in a second.
So, how do we go about it? Well, allow me to walk you through the steps.
----
Want to go into further depth? Head to kodaps.dev/

Пікірлер: 23
@naylord5
@naylord5 8 ай бұрын
Brilliant idea! It would be really helpful if you can create a tutorial on how to create a portfolio and control the projects, links, etc. with Notion as a database. Thank you in advance!
@nemesis4029
@nemesis4029 8 ай бұрын
Awesome video man.. the quality is absolutely amazing.. can't wait to see you grow into a big channel
@KodapsAcademy
@KodapsAcademy 8 ай бұрын
Thank you very much :)
@victortriathlete
@victortriathlete 5 ай бұрын
That's ingenious! Never thought of using Notion as a CMS before, but with the strategy you're presenting it would be totally doable. Thanks for your work!
@AIByBard
@AIByBard 8 ай бұрын
found this interesting and helpful. Thanks! you earned yourself a new sub!
@KodapsAcademy
@KodapsAcademy 8 ай бұрын
Thanks, and welcome :)
@CoolIntellect
@CoolIntellect 3 ай бұрын
Man you are so amazing, I love you....! please don't stop you are doing a good job there! Thanks for all the amazing stuff...!
@KodapsAcademy
@KodapsAcademy 3 ай бұрын
Glad you like the content :)
@studyquant7649
@studyquant7649 2 ай бұрын
awesome solution, hope someone can teach, willing to pay
@kimbapslayer1995
@kimbapslayer1995 11 күн бұрын
The moment I learn you bottled necked a part of the dev process into your own npm package is I back out.
@KodapsAcademy
@KodapsAcademy 11 күн бұрын
No one is forcing you to use it, and you can fork it - or code the interaction with the API yourself.
@SnowdenFu-jh6bx
@SnowdenFu-jh6bx 3 ай бұрын
but actually we dont want store md and images in project folder to make it super large, how do we resolve this?
@joshbleijenberg4000
@joshbleijenberg4000 6 ай бұрын
Exactly where I am looking for. Would me amazing to see a full tutorial on how to build the blog and how to manage the content with notion and contentlayer!
@KodapsAcademy
@KodapsAcademy 6 ай бұрын
This is not quite for a blog but the rest is there : kzfaq.info/get/bejne/ftJnm7aHt7Gvnas.html
@joshbleijenberg4000
@joshbleijenberg4000 3 ай бұрын
@@KodapsAcademy I do have some problems with parsing webp images from notion to contentlayer with the kodaps/notion-parse library. Can you add support for webp images?
@wilonweb
@wilonweb 6 ай бұрын
Is not for the french public ? or i don't see this video on your french chanel ? Do you try other CMS with NextJS ?
@KodapsAcademy
@KodapsAcademy 6 ай бұрын
Not really a CMS but I tried using Ulysees for all my markdown content, because it's great as a writing tool. For the french public, the english one did not work so well so I did not bother putting it up mais je peux si ça vous intéresse :)
@wilonweb
@wilonweb 6 ай бұрын
@pierre-louisclouet8168
@pierre-louisclouet8168 Ай бұрын
très belle présentation mais j'ai essayé de cloner le repository et de l'installer sans succès. Nombreux messages d'erreur sur la dependency.
@KodapsAcademy
@KodapsAcademy Ай бұрын
Je viens de retester en re clonant de zero, sans souci. Vous avez quelle version de node installée localement, et vous utilisez quelle package manager ? (je viens de tester avec Node 18 et pnpm)
@pierre-louisclouet8168
@pierre-louisclouet8168 Ай бұрын
@@KodapsAcademymerci pour votre réponse. J’ai normalement la dernière version LTS de node. Je suis obligé de m’absenter quelques jours. Je testerai à nouveau à mon retour. Votre solution m’intéresse beaucoup. Je vous tiendrai au courant
@tubynep9005
@tubynep9005 2 ай бұрын
since you dont own the notion api, maybe it might break someday
@KodapsAcademy
@KodapsAcademy 2 ай бұрын
True. But then that's why 1/ I coded the NPM moduie, it allows me to adapt and 2/ why I then download the content locally as Markdown files :)
Using Notion as a CMS for Complex Websites
9:09
Sean C Davis
Рет қаралды 8 М.
Why So Many Developers Choose NestJS?
7:35
Tech Vision
Рет қаралды 4,4 М.
Clowns abuse children#Short #Officer Rabbit #angel
00:51
兔子警官
Рет қаралды 78 МЛН
Heartwarming Unity at School Event #shorts
00:19
Fabiosa Stories
Рет қаралды 22 МЛН
Unlimited AI Agents running locally with Ollama & AnythingLLM
15:21
Tim Carambat
Рет қаралды 101 М.
NextJS:  ContentLayer Makes Markdown GLOW Up!
6:45
Kodaps Academy
Рет қаралды 4,2 М.
Next.js MDX is pretty awesome
4:49
Web Dev Cody
Рет қаралды 10 М.
You Don't Need a CMS - Use This Instead
28:55
Colby Fayock
Рет қаралды 17 М.
Why does Zig pay more?
6:44
Kodaps Academy
Рет қаралды 9 М.
3 Reasons Anytype is BETTER than Notion
6:12
Demetri Panici - Productivity Coach
Рет қаралды 31 М.
Use Wordpress as a Headless CMS for Next JS
6:14
Digital CEO
Рет қаралды 38 М.
10 common mistakes with the Next.js App Router
20:37
Vercel
Рет қаралды 196 М.
Full NextJS Project Tutorial: Portfolio Website
34:22
Kodaps Academy
Рет қаралды 2,4 М.
Drizzle vs Prisma: Which ORM is right for YOU?
5:59
Kodaps Academy
Рет қаралды 3,8 М.
Todos os modelos de smartphone
0:20
Spider Slack
Рет қаралды 63 МЛН
Самые крутые школьные гаджеты
0:49
Как распознать поддельный iPhone
0:44
PEREKUPILO
Рет қаралды 2,2 МЛН
$1 vs $100,000 Slow Motion Camera!
0:44
Hafu Go
Рет қаралды 28 МЛН