saitamau-maximum / blog Goto Github PK

next-tweetでいいかな

:::tweet[20]

って書けば

https://twitter.com/_/status/20

が埋め込まれるイメージ

dep: #33

• markdownlint
• pritter
• eslint
• stylelint

をpre-commitでかけ、落ちたらcommit block

解決方法

src/app/layout.tsxのmetadataにmetadataBaseを設定する

https://nextjs.org/docs/app/api-reference/functions/generate-metadata#metadatabase

そしてbuildするときにgithub action上からprocess.env.URLを設定してやる

env:
  URL: https://blog.maximum.vc

をdeploy.ymlのrootに書くだけ

StickyHeaderのロゴとタイトルの間が広すぎるので狭めたい
最大でも1024px以上離れないようにして欲しい

(blog記事にしていいかも)

• #9
• Branch Protection も決める
• #10
• 第3回入門、Marmaid 崩れてる？ → #7
• githubio をどうにかする
• #23

静的exportなのでnext imageが機能しておらず...

ブログ記事ページの一番下に「前の章」「次の章」機能を追加したい（アドカレや講習会等で使えそうかなと）

• frontmatterにprev (optional, string, slug名)
• frontmatterにnext (optional, string, slug名)
• prev,nextのUIを作成

レンダリングエンジンのrehype-mermaidjsはサーバー側でchromiumを呼び出してprerenderingするためにハイパフォーマンスな表示ができるのだが、これが表示崩れるってことはおそらくgithub actionに日本語fontがはいってないとかかな？

Next.jsだけどSSGなのでできるはず

cc: @a01sa01to

• adventsフォルダをrootに作成
• csvかjsonでアドカレをファイルとして設定保存
• もしアドカレのブログが埋まればリンク表示
• トップページに最新のアドカレを表示

ブログ記事をビルドするタイミングでImage GenをしてPublicディレクトリに生成した画像を突っ込む
画像に文字を埋め込む方法は https://blanktar.jp/blog/2020/05/nodejs-write-text-on-image 参照

https://github.com/actions/deploy-pages

PR Preview できそう...？

追加したいもの

• pritter
  • space 2
  • trailing comma
  • print width 80
• eslint
  • unused import
  • sort import
• stylelint