2021-01-13

天気

今朝（昨夜？）は雪が降ったらしいけど、今日は天気がよかった。朝の日光の入り具合が最高だった。

自販機

久しぶりに自販機でミルクティーを買った。温かい飲みものが美味しい季節だ。

React.memo

仕事ではじめて、React.memoのありがたみを感じる機会に出くわした。データが多いページにフォームがくっついていて、フォームのテキスト入力のたびに表示部分のrenderが走ってしまっていた。React.memoの利用はかんたんで、ただ以下のようにコンポーネントを引数に呼べば良い。

React.memo(BlogPost)

ただ、このときBlogPostにコールバックなんかを渡していると、renderが走ってしまったりする。

type Props = {
  callback: () => void;
}
const BlogPost = (props: Props) => {
  return (
    <PostTitle />
    <PostDetail callback={props.callback} />
  )
}

そんなときは、useCallbackを使うとよいっぽい。

type Props = {
  callback: () => void;
}
const BlogPost = (props: Props) => {
　　const callback = React.useCallback(() => { props.callback() }, [props.callback])
  return (
    <PostTitle />
    <PostDetail callback={callback} />
  )
}

ブログの構成

このブログの構成をどうしようか考えている。いまはバックエンドにGitHubを利用しているけど、これだといまいちなので、RailsでAPIサーバーを作ろうと思う。Next.jsのビルド時とrevalidateのときのリクエストなら、Herokuの無料枠でいけるんじゃないか、全然調べてないけども。

BFF(Next.js)とバックエンド(Rails)が分かれていれば、あとで別のWAFで書き換えたいみたいな興味本位の作り直しもできる気がしている。各プロジェクトを小さくして、自分の暇な時間で作り直しができる規模に保っていきたい。