Gatsby.jsとTypeScriptでミニブログを作った
Scalaをそこそこやって型いいじゃん！とすこしづつ思いはじめてきたのでTypeScriptとReactで遊ぶがてらGatsby.jsでブログを書いてみた。
なんのOGPもなくて寂しい。 ソースコードはこれ github.com
TypeScript
とりあえずTypeScript deep diveでundefind使えと書いてあったのでundefind使ったりよちよち歩きでやっている。とはいえよちよちでもIDEはしっかりと補完してくれるしESLintはしっかり指摘してくれるので型の恩恵にはあずかれてる気がする。
React
公式のチュートリアルをみながら色々やったのだけど、Hookというのが直感的だし記述量も少ないしで楽しかった。コンポーネントディドマウントとかよりだいぶわかりやすくなった気がする。
今回のブログだとトップページのLOLのランクステータスをfetchしてるところでHookを使っている。 このブログのコードを社のフロントの人にみせたらfetchしてる間もなにか表示した方がいいという金言をもらったので is Loading..をfetch中に表示するようにした。
バックエンドだと非同期ジョブとかDBのロックとかいかにも非同期非同期してるところしか非同期処理を意識しないので、フロントでhttpレスポンスが返ってくるのを待っている間とかの処理を考えるのは脳に新鮮な刺激で楽しい。
クライアントにとってのGraphQL
Gatsbyは静的データをGraphQLで扱うことができる。 とってくるクエリごとに名前をつけて型を作れるため、サンプルレスポンスといちいちにらめっこしたりする必要がないのが体験がいい。 nullableはできるだけ避けたいとか、空文字はjs界だとfalseだったりとかも面白かった。 業務では逆に僕がGraphQLサーバーを書く側なのだけれど、Gatsby.jsの経験を通してよりよいスキーマを定義できればいいな。
ブログの内容の予定
本当にチラ裏みたいなことを書いていくと思う。まだまだブログとしても寂しいしソースコードも記事もちょこちょこいじっていくぞ。