Skip to content
へろほろ edited this page May 21, 2022 · 26 revisions

code sandboxと連携してNextjsのテンプレからblogにする工程を記録

Nextjsテンプレ👉レイアウト再現

解説記事:ノーマルなcreate-next-appから本家のレイアウトを再現_Blog learn

No. branch description リンク PR
01 035iff pageNation https://github.com/herohoro/Blog_learn/pull/3 #3
02 p3b04x easy-notion仕様にディレクトリ分け_ここでは途中/次のPRで完成してる https://github.com/herohoro/Blog_learn/pull/2 #2
03 nods6y typescript化 https://github.com/herohoro/Blog_learn/pull/4 #4
04 xkt4in contentを色分け_CSSで再現 https://github.com/herohoro/Blog_learn/pull/6 #6
05 e9r66s 全レイアウトの色分け+easy-notion仕様の見た目 https://github.com/herohoro/Blog_learn/pull/7 #7
06 e8mfr5 component化 footerとheader https://github.com/herohoro/Blog_learn/pull/8 #8

NotionAPIを使ってデータを取り込む・表示する

解説記事:

No. branch description リンク PR
07 rseo19 API routing _入力フォーム https://github.com/herohoro/Blog_learn/pull/9 #9
08 rw064k Data fetching _収納したディレクトリからテキストデータを表示_lib https://github.com/herohoro/Blog_learn/pull/10 #10
09 9cp6j7 NotionAPIからDBのタイトル・テキスト・日付列を表示させる_他_lib/環境変数module/getStaticProps/props https://github.com/herohoro/Blog_learn/pull/11 #11
10 oek04h slugを使って画面遷移_getStaticPath https://github.com/herohoro/Blog_learn/pull/12 #12
11 oek04h 修正_画面遷移のエラーを解消 https://github.com/herohoro/Blog_learn/pull/13 #13
12 zz22j8 DB列のタイトル・日付を記事ページに表示させる https://github.com/herohoro/Blog_learn/pull/15 #15
13 825ojw NotionDBのpage内テキストを表示させる https://github.com/herohoro/Blog_learn/pull/16 #16
14 未定 OgImage列の画像をサムネとして記事一覧に表示させる

詳細はherohoroブログ_blog learnタグより