せっかく Notion ブログにしたのでスマホから。
先週頃からずっと行きたかった。そう、焼肉きんぐ。
今回行ったのは焼肉きんぐ駒沢公園店。うちの近所である。
iPhone11Pro で撮った画像が無駄に重くて読み込み遅すぎるので注意。
いざ、きんぐへ！
スムーズ社総出で突撃。服装もこの揃い様である。
到着した瞬間肉を連打 🥩
焼肉きんぐはタブレットで注文するのでストレス無く連打が可能。
うまい、うますぎるぅ！！
肉、かなり大きい。来るのも速い。
きんぐ、このサイズの肉メニューがかなり多い。おそらくカットするオペレーション削減で素早く届くのだろう。
肉を自分で焼かずに口を開けてガン待ちスタイルの自分にとっては焼きながら切るコスト関係ないのでかなりありがたい。
この存在感である。煙もあまり無くかなり快適。
書く事無くなってきた。
これは楽しそうな社長。肉切ってくれた 🥓
食べ放題も終盤。かなりお腹一杯になったところで社長ラーメンとうどんをダブルで注文。
圧巻のスピードで麺が消えていく。さすがである。
デザートタイムになりチーズケーキとアイス注文。チーズケーキはコーヒーで流し込んでしまい撮る前に消えてしまった。
これはアイス。
総括：うまかった。個人的には G 角の上位互換。
これお店の看板。魚も食べにきたくなる美味さ！みたいな話らしい。これめちゃ好き。
てかこの店舗、向かいに叙々苑あるんだよね。面白い。
せっかく美味しそうな写真（？）がいっぱい撮れたのに ogp がワイズブラッドばっかじゃ味気ないので ogp 画像を Notion 側から設定できるようにする（唐突）
今の ogp こんな感じ。美しい。けどこれで焼肉の話題はちょっと…
Notion Blog を魔改造
まあとりあえず Notion でカラムを増やす。この調子で増やしてたらクソ CMS になりそう。
もらう側のコードもいじっていきましょう。焼肉食べた後なので全然頭動かん…
まずは型定義追加
// types/blog.ts
// 略
export type Post = {
id: string
Authors: string[]
Slug: string
Published: 'Yes' | 'No'
Date: number
Page: string
preview: unknown[][]
content: PostContent[]
hasTweet: boolean
Ogp: string // <- 追加！！！
}
export type Posts = Post[]
getStaticProps 関数で ogp 画像の url を取得して流し込む。
// pages/[slug].tsx
export const getStaticProps: GetStaticProps<StaticProps> = async ({
params: { slug },
preview
}) => {
// 略
return {
props: {
post, // <- さっき追加したPostの型が効いている
preview: preview || false
},
unstable_revalidate: 10
}
}
const RenderPost: NextPage<StaticProps> = (props) => {
return (
<>
<Head title={props.post?.Page} ogImage={props.post?.Ogp} />
<Layout>
<Post
post={props.post}
preview={props.preview}
redirect={props.redirect}
/>
</Layout>
</>
)
}
export default RenderPost
NextHead をまとめるコンポーネントを使っているので props として受け取り、undefined の場合は美しいワイズブラッドを表示し、string がしっかり入ってきた場合はそれを ogp 画像として表示する。
// components/Head.tsx
// 略
<meta
property="og:image"
content={props.ogImage || `${BASE_URL}/images/tr.jpg`}
/>
画像入れてみる
ブログの中から使いたい画像を full で開いて url をコピーして embed link でペースト
ツイッターで確認。
しっかり入っているので完成！
食べ物とコードが入り乱れる意味不なブログになってしまったがこれもまた個性。
スマホからと言いつつパソコン開いてコード書いてしまった…
次のテーマは画像圧縮かな！！
以上。