昨日は、夜帰ってきてからも遅くまで開発をして、結局3時くらいに就寝。で、10:30くらいに遅めの起床。２週間ぶりの洗濯をして、空き時間でドトールで少し開発をして、洗濯が終わると一旦家に帰って出直し、五反田のエクセルシオールでまた開発。ドトールとエクセルシオールは同じ会社だったはずで、今日だけで合計2000円近く使った。カモだ。カフェで作業するのは良いのだけど、１日に二箇所は良くないな。無料で作業できる場所を見つけたいところ。そういえば、洗足駅の隣のセブンイレブンは２階にイートインスペースがある珍しい形で、今度はセブンのコーヒーを買ってあそこで作業するのも良いかもしれない。

最近カフェ出費が増えてきているのは要注意だな。今のところVポイントペイで払っているから、身銭を切っている感覚はないが、ポイントが底を尽きてくるとそろそろ危ない。塵つもなので。。。

ただ、家にいるとなかなか集中できないのも事実。２週間後にロードバイクを受け取るから、それ以降は少し遠出して図書館などで作業するのもありかも。東京の図書館なら、モニター使える場所もそこそこありそうだし。

で、今日は結構開発が捗ったから、技術系の話も少し書こうと思う。

tiptap.ProseMirror {
  background-color:red;
  width:100%;
}

みたいなcssセレクタの記述方法は、複合セレクタというらしい。これに限らずだけど、cssのセレクタは、WEBで複雑なスタイルを当てるのに耐えうる表現力を持っていて、いろいろな結合子が存在する。フロントエンドライブラリのcssとかを見にいくと、複雑そうなことが書いてあって思わずウッとなる人は俺だけではないと思うのだけど、複雑そうに見える部分の多くは、このセレクタの記述方法やセレクタ結合子が要因である可能性が高い。

https://developer.mozilla.org/ja/docs/Web/CSS/Guides/Selectors/Selectors_and_combinators

これまでは、tiptapの使い方がよくわかっておらず、エディタで執筆中の記事のスタイルと、実際のプレビュー画面でのスタイルに差分があったのだが、結論、tiptapで使用されている.scssをプレビュー画面のこんぽーねんとにimportしてclassName=”tiptap ProseMirrorr” とするだけで、プレビュー画面にもtiptapの見た目にすることができた。

また、supabaseへの画像アップロードも実装できた。
（画像は、昨日渋谷を散歩していた木に見つけた店。お前はトリコ？）

もっと苦戦するのかと思っていたら、なんのことはなくて、supabaseのSD Kでクライアントを作って、そこに関数をよんでファイルをアップロードするだけ。少し工夫がいるのは、ファイルの命名は、日本語のなどが許可されていないらしく（AI曰くS3のオブジェクトのkeyの名称ルールと同じらしい）、今回は衝突を防ぐためにアプリでuuidを作成して、それをファイル名としている。あとは、データ自体は、JavaScriptのFileオブジェクトをそのまま渡すだけで良い。あとは、PostgreSQLが提供する機能の一つであるRLS(Row Level Security)で、デフォルトではinsertなどが許可されておらず、403 unauthorized errorが出て、その解決にも多少手間取った。ここら辺の、開発時に詰まる細かい障害を解消していくスピードは今後もあげていかねば。でも、今日は結構進捗が埋めたので嬉しい。

〜

夜は五反田で大学時代の友達とシュラスコを食べた。めちゃくちゃお腹が空いていたはずなのに、あまりたくさん食べれなかった。そういえば先週の土曜日もマロリーポークステーキを食べて、肉結構食ってるな。

今日はこのあと風呂に入って、もう少し開発をしようと思う。ブログにタグ機能がまだないので、それを追加しようと思う。

あと、ブログとは別の個人開発プロジェクトを進めていきたい。タイピングアプリ中途半端に作って放置していたのだけど、再開しようかなぁ。デザインを考えるのがめんどくさいんだよなぁ。