#えむけーろぐ

間違った事を書いていたらやさしく教えてください

新型コロナワクチン接種 1回目の記録(ファイザー)

2021年7月28日水曜日、新型コロナウイルス感染症のワクチン接種 1回目を済ませてきた。ファイザー社製のワクチンで、医療機関による個別接種のキャンセル枠を確保しての接種だった。

数日前

市内の医療期間にて、不定期でキャンセル枠の開放を行っていることを知る。何故か枠の開放をTwitterでお知らせしてくれている人がいるので、その人をフォローしツイート通知を入れる。何度かチャレンジするも、予約画面にアクセスするともう捌けてしまっている、ということを2回ほど経験する。

その他にも色々と予約するルートはあるらしいが、「どうせ家で仕事してるだけだしそこまで必死に打ちたいわけでもないな」とスルー気味。

当日

朝、キャンセル枠開放ツイートの通知を受信。PCを立ち上げ予約画面にアクセスしたところ、その日の夜に合計30枠ほどの空きがあるのを確認した。無事に予約完了。3週間後の同曜日同時刻に2回目の予約もされていた。

予約が取れたあと、すぐに以下のものを注文した。ヨドバシドットコムは午前中に注文すれば当日に届くので便利。冷えピタと頭痛薬(ロキソニンSプレミアム)は常備してあった。

当日夜。退勤後にクリニックへ直行。前後の待ち時間含め45分程度で接種完了。15分の待機期間中特に問題はなかった。

夜、23時半頃に少しの頭痛。体温は平熱36.4度に対し36.8度と、普段の夜と変わらず。ワクチンを打った左腕が痛む。腕が上がらないほどでは無いが、左を下にして寝ると痛い、というレベル。

ロキソニンを飲んで就寝。

翌日

翌朝。腕の痛みが接種当日よりも強いがそれでも腕が上がらないほどではない。気合で上がるレベル。熱は36.3度と平熱。頭痛などなし。

昼過ぎ、仕事中に少しの頭痛。体温は37.2度と微熱。ロキソニンを飲み冷えピタを貼りながら業務を続ける。

退勤直前(18時過ぎ頃)、37.1度とまだ少し熱があるが頭痛は治まっている。

就寝前、23時頃には36.3度に下がる。腕は圧力が加わると痛いというくらい。

翌々日(今日)

今日の朝。体調は問題ない。熱は36.8度と朝にしては高い。腕は気合を入れなくても上がるが接種部位を押すと痛い。

その後14時、23時と熱が36.8度のままだが、それ以外の異常は無い。

このあと就寝予定だが、今日は左を下にして寝ても良さそうだ。

1回目 まとめ

体質なのか、ファイザー製だからなのか、副反応は周りで見聞きするほどのものではなかった。ただ2回目はヤバいらしいので、覚悟はしておいた方が良さそう。

2021年7月末時点で、職域接種を実施出来る企業に勤務していたり、優先接種の対象者だったりしない人がワクチンを接種するには、ある程度の情報収集力と時間が必要そうだ。

たまたま僕は当日朝に退勤後で十分間に合うような場所・時間帯での予約が出来たが、そうでない人の方が圧倒的に多いだろう。

そんな状況下で、「若者の行動が鍵だ」とか、「若者はなぜワクチンを打たないのか」とか言われても困る。そもそも通常のルート(自治体主導での接種)ではまだまだ若者は打てないのだから。

Twitterを見ていると、「ワクチン接種の遅れを反ワクチン運動や若者が打ちたがらないからではないということを発信し続けないと、政府やマスコミによってそういうことにされてしまう」という意見を見てなるほどなと思ったので、そういうコメントだけ残しておく。

梅酒2021

備忘録。

材料

無印良品 福井県産 紅映梅(梅のみ)1kg

www.muji.com

合同酒精 ホワイトリカー ゴードー [ 焼酎 35度 1800ml ] 

氷砂糖

写真撮り忘れ。1kg

今後

半年くらい寝かせる。

たまに瓶を動かしてやると良いらしい。

写真

f:id:mktakuyax:20210613223533j:plain

梅 1kg

f:id:mktakuyax:20210613145543j:plain

梅と氷砂糖を交互に

f:id:mktakuyax:20210613223637j:plain

ここから冷暗所で半年ほど熟成する

Bose Noise Cancelling Headphones 700

Bose Noise Cancelling Headphones 700(以下NCH700)を購入した。

2年前に購入したQC 35 IIからの乗り換え。2019年の春に購入してから2年間ほぼ毎日使っていたせいか耳あてもボロボロ、右耳からキーンという音が聞こえたり、(これはMac miniのせいな気もするが)Bluetoothの音声も途切れてしまうという状況で、どうしようか迷っていたところにAmazonで安くなっていたのでポチッてしまった。

f:id:mktakuyax:20210612131550j:plain

オープンオフィスとか呼ばれる、壁を取り払った開放的な執務スペースでの作業に集中できず発狂しそうになったので購入したノイズキャンセリングヘッドフォン。リモートワークが中心となった今では、エアコンや換気扇のゴーッという音をシャットダウンするのに役立ってくれている。

 

QC 35 IIが2017年11月発売、今回購入したNCH700が2019年9月発売なので、後継品が今年の秋頃に発売される気もするが、まあ今使ってるものが壊れつつあるし、ほしいときが買い時って言うし……。

音質などに拘りはないが、装着感・ノイズキャンセリング性能ともに満足。QC 35 IIもNCH700も同時に2台接続が出来て、iPhoneとMac miniに接続しているのだが、前作はMac miniでビデオ会議中にiPhoneの音がなると音声が全部奪われてつらいということがあったが、今作はそのへんうまくソフトウェアで空気を読んでくれているっぽいので良さそう。

NCH700の対抗馬としてよく出てくるSONYのWH-1000XM4とも迷ったが、いくつかWeb上のレビューを読んだところNCH700の方がマイクの性能が良いという評判だったので、まぁビデオチャット多いしなということでNCH700にした感じ。

 

横須賀

後輩をタイムズカーシェアに紹介したらもらえた60分無料券が今月末で切れてしまうので、ドライブに行ってきた。行き先は横須賀。日帰りで行ってそれなりに楽しめそうなこと、backspace.fmのドリキンさんの出身地であることなどが理由。

僕の住んでいる横浜市青葉区からは車で1時間半ほど。

ランチにはどぶ板通り商店街(すごい名前だ)にあるTSUNAMIというレストランに行った。

www.navyburger.com

横須賀名物のネイビーバーガーや、海軍カレーなどを楽しめる。2年前にKing & Princeのメンバーが取材してた*1ほか、有名人がいっぱい来ているお店らしい。

僕が頼んだのは「ジョージワシントンバーガー」というやつ。めちゃくちゃデカい。

f:id:mktakuyax:20210529132203j:plain

横須賀TSUNAMIのジョージワシントンバーガー

他にもトランプバーガーやらロナルドレーガンバーガーやらがあった。大統領の名を冠したハンバーガーでは、ジョージワシントンバーガーが一番小さかった気がするが、それでこのボリューム。

かなり人気の店らしく、入店は30分待ちだったが予約システムが秀逸で外に並ばされることがなかった。MyTurnというやつを使っているようで、予約処理をしたらあとはその辺をぶらぶらしていれば良く、時間になったら電話やSMSで教えてくれる。

myturn.jp

 

昼食後、少しどぶ板通り商店街を散策する。スカジャンの聖地というだけあってスカジャン屋がめちゃくちゃあった。その他おみやげ屋やバー、ミリタリーショップもあって楽しかった。

f:id:mktakuyax:20210531000501j:plain

どぶ板通り

自分へのお土産用に、9mm弾を買っておいた。使用済みの本物で、下を見ると撃鉄によって叩かれ雷管が凹んでいるのがわかる。

f:id:mktakuyax:20210531000125j:plain

横須賀のミリタリーショップで買った使用済み9mm弾のお土産

午後はコースカベイサイドストアーズという大きなショッピングモールに行った。わざわざ横須賀まで来てショッピングモール……?と思ったけど、それはそれで楽しかった。

coaska.jp

 

夕方には横須賀美術館へ。海と山に挟まれたロケーションにある美術館だった。

www.yokosuka-moa.jp

僕も同居人も美術には疎いけど、わかってないなりにああでもないこうでもない言いながら絵を見ていくのは楽しかった。(基本的に作品の撮影は禁止だったので、写真は無し。)

そして一番の目的は、King & Princeの「君を待っている」という曲の聖地巡礼だったらしい。MVの撮影で使われているらしく、なにやら楽しそうに写真を撮っていた。撮影禁止エリアと許可エリアが明示的に分かれているので、そのあたりは注意が必要。

f:id:mktakuyax:20210529160506j:plain
f:id:mktakuyax:20210529161144j:plain
横須賀美術館(King & PrinceのMVのロケ地らしい)

最後に美術館前の海でぼーっと過ごして、暗くなる前に帰ることにした。

f:id:mktakuyax:20210531001654j:plain

横須賀美術館前の海

良いドライブだった。今度はまた別の神奈川県の有名スポットに行ってみたい。

土曜日

土曜日、おそらく小学校の遠足以来やってなかったピクニックというのをやってみた。

朝、サンドイッチを作る。適当にベーコンと卵を焼いてレタスと一緒にパンに挟むというのをやったことはあるけれど、真面目にサンドイッチを作ったことはなかったかもしれない。

てぬキッチンというYouTubeチャンネルのレシピを参考にたまごサンドを作った。卵をボウルに割り入れて電子レンジでチンして諸々を混ぜるだけ。

www.youtube.com

同居人の方はベーコンレタスサンドを作っていた。僕のよりも高度なことをやっていた。

なお両方写真を撮り忘れていた。

 

僕らの住む横浜市青葉区にはちょっとした公園がたくさんあり、今回はそのうちのひとつ「桜台公園」に行った。

f:id:mktakuyax:20210522131737j:plain

横浜市青葉区 桜台公園

でかい池のある公園で、青葉区には他にも2つほど池のある公園があるらしい。池が汚いのは雨の多い時期だからなのかもともとなのかよくわからない。

公園内では子供が釣りをしていたり、他の家族連れがピクニックしていたりなどしていた。特別人が多いという感じはしなかった。井の頭公園などのように県外から観光客が来るほど有名な公園ではたぶんないだろうし。

大きめのベンチがあったのでそこに陣取らせてもらって作ったサンドイッチを食べていた。目の前に池に続く小川があり、水の音を聞きながらの食事だった。自然の中で食事するという体験は心が洗われる感じがしてなかなか良い。本当に食べ物の写真を撮り忘れたので、周辺の写真を貼っておく。

f:id:mktakuyax:20210522131924j:plain

左奥に映るベンチで食事をしていた

わりと大きめの公園で、森と池、小川の自然コーナーっぽいのもありつつ、丘の上に行くと広場でバスケしたり滑り台で遊んだりみたいなのができる。

f:id:mktakuyax:20210522135611j:plain

広場

ピクニックに行くというのはわりと突発的に決まった用事だったので、特にそれ用の道具を持っていたとかではなかったが、今回なかなか体験が良かったので、サンドイッチを入れるのにちょうど良さそうなランチボックスくらいは買っておいても良いかもな、と思ったのであった。

Cursor-basedなページネーションをやめてpage-basedなページネーションに

先日作り直したPodcastのWebサイト。

blog.m6a.jp

GraphQL APIのepisodes一覧のfield(言い回しが正しいのか自信なし)を、Cursor-basedなページネーションで実装してしまったせいでPrev / Nextなページネーションしか出来ず使いにくくなっていた。

f:id:mktakuyax:20210506133429g:plain

Cursor-basedなページネーションで使いにくい様子(前・次の移動しかできない)

これを、Page-based(前のブログではOffset-basedと言っていたが、同じ意味)に作り変えた。

こんな感じ。

f:id:mktakuyax:20210516231829g:plain

Page-basedなページネーションができるようになった。(前・次だけでなく、ページ番号指定で移動できる)

これで少しは使いやすくなったはず。……なのだけど、本番のデータでやってみると、横幅がオーバーしてしまっていたり、スマホだともう崩壊していたり。

f:id:mktakuyax:20210516232136p:plain

f:id:mktakuyax:20210516232238p:plain

開発環境だけでなく、本番同様のデータでテストする重要性を噛み締めた出来事であった。

 

ちなみにgraphql-rubyでいい感じにpage-basedなページネーションをやるのに、graphql-paginationというgemがあったのでそれを使った。メンテされているかどうか判断するのに微妙なラインだったけど、最悪自分で実装できそうだったので一旦採用してみることにした。

github.com

PodcastのWebサイトをNext.js + GraphQL APIで作り直す

はじめに

Next.jsやGraphQLを学ぶ機運の高まりがあったので、GWの期間を使ってゆるふわPodcastのWebサイトを作り直してみた。Rails on HerokuなMPA(SPAの対義語としてMulti Pages Applicationと言うらしい)から、Next.jsによるSPA + GraphQL APIという感じ。

yuru28.com

f:id:mktakuyax:20210506130659p:plain

yuru28.com

ユーザに見える部分( yuru28.com )をNext.js on Vercelで構築し、従来のRailsアプリにはapi.yuru28.comとしてGraphQL APIと管理画面をやってもらうことにした。

フロントエンド(Next.js, Apollo Client, Chakra UI)

`npx create-next-app yuru28-com` してガシガシ作っていくだけ。デフォルトだとただのJSなので、TypeScript対応*1もしておいた。ページごとにSG(静的HTML生成)、SSR(サーバサイドレンダリング)、そしてCSR(クライアントサイドレンダリング、普通のSPA的な)を選択したり組み合わせたりすることができる。今回の要件だとTOPページ以外はSGで構築することが出来た。

後述するGraphQL APIを叩くために、Apollo ClientというGraphQLのライブラリを使用している。Next.jsとApollo Clientを組み合わせる方法は、Apollo公式のブログにわりと丁寧に書いてあった。SG、SSR、CSRそれぞれの場合のApollo Clientの使い方が書いてあるので読んでおくと良さそう。
Getting Started With Apollo Client in Next.js - Apollo Blog

UIフレームワークとしては、プロフィールサイトを作り直したとき*2に素振りしたChakra UIを採用した。Bootstrapを使っても良かったが、今だとChakra UIの方が流行りらしいということでこっちにした。ネイティブでTypeScript対応していたりするおかげで、コーディング時の体験はなかなか良かった印象。Bootstrapのようにクラスを当てていくのではなく、ReactらしくComponentをimportして使っていくので、そのへんがちょっとめんどくさかった。基本的には、公式のドキュメントをざっと見てどういうComponentがあるのかを頭に入れておいて、作りながら良さそうなComponentを使っていくというスタイルで開発を進めた。

GraphQL API

GraphQL APIは、既存のRails製Webサイトに生やした。RailsでGraphQLといえば、graphql-rubyを使うのが定番らしい。公式のドキュメントを流し読みした後、良さげな入門Qiita記事*3があったのでそれにそって基本のAPIを構築してみた。

ひたすらTypeを定義して、fieldを追加し、必要に応じてresolverを書くという作業ゲー。管理画面もNext.jsで作るとなるとMutationとか必要になるけど、一旦はユーザに見えるページだけをNext.js化して管理画面はそのままなので、今回はQuery書くだけだった。ある程度API側が出来た段階で api.yuru28.com にデプロイし、既存の管理画面以外のページを削除した。

何故かGraphQLのAPIのpaginationはCursor-basedでやるものだという先入観があったので、そういう感じでエピソード一覧のAPIを実装してしまったのだけど、普通にOffset-basedでやればよかったなという後悔がある。Cursor-basedでpaginationをやってしまうと、以下のGIF画像のように、常に prev or next のページ遷移しか出来ずに不便。週イチでしか増えないエピソードというデータに対して、cursor-basedなpaginationは明らかに向かない。あとでOffset-basedな感じに作り直そうと思う。

f:id:mktakuyax:20210506133429g:plain

Cursor-basedでページネーションを実装してしまったので不便な様子

 

デプロイ

フロントエンドのコードは、Vercelにデプロイしている。特に特別なことはしていないが、GitHub経由でログイン後にリポジトリを指定し独自ドメインまわりの設定をするだけで動いてくれて便利。

サーバサイドのコードは引き続きHerokuで動かしている。

おわりに

GW後半の3日間でサクッと実装することが出来た。ひとまずPodcastのユーザ側に見える部分だけNext.js化したので認証は無いのだが、管理画面もNext.js化してそのあたりの知見を溜めておきたい。Auth0でも使いたいなぁ。

Next.js、Apollo Client、Chakra UI、GraphQLと、新しい技術が盛り沢山だったが楽しくものを作ることが出来た。今後もサイトの改善をしつつ、働き始めてからあんまり出来ていなかった雑なWebアプリ量産なんかもこの技術スタックでやっていきたいなと思っている。