JOURNAL
アプリ開発日記
店に並ぶ道具たちを実際に作りながら考えたこと、詰まったこと、工夫した点をまとめています。
メール誤送信事故を防ぐ！超軽量SMTPサーバー「Mailpit」完全入門 — Docker導入からPHP・WordPress・各言語設定まで
開発環境からのテストメール誤送信事故を防ぎ、ブラウザで即座に受信メールを確認できるGo製の超軽量メールキャプチャツール「Mailpit」。MailHogからの移行理由からDocker / Docker Composeでの導入、PHP・WordPress・各種言語での接続設定、API連携まで網羅的に解説します。
→Device Bridgeを作った話 — QRコードで端末間にメモを届ける、小さな橋
スマホで書いたメモをパソコンにも送りたい。そんな小さな不便を解消するために作ったツールの裏話と、開発中に踏んだ地雷の記録です。
→AI LINE Botを作った話 — Claude・ChatGPT・Geminiを切り替えられる設計にした理由
複数のAIプロバイダーを差し替え可能にしておくことで、後から気軽に乗り換えられる設計にした話です。
→Simple Line Botを作った理由 — 「2つのAPIキーを貼るだけ」にこだわった話
LINE Botを作るハードルを下げたくて、設定項目を極限まで絞ったテンプレートにした経緯です。
→サイト全体のデザインを『赤猫座』という世界観に統一した理由
雑多なWeb道具を束ねる世界観デザインの戦略。無機質なツール集から脱却し、記憶に残るブランディング、ポータルとツール内部を分離する二層構造のUI設計論を語りました。
→道具を作るときに毎回やっている、公開前のチェックリスト
個人開発の品質と安全を守る「公開前・最終点検チェックリスト（全12項目）」。スマホ表示崩れやOGP、GitへのAPIキー誤コミット防止、sitemap更新など冷や汗の歴史から生まれた実戦ノウハウを公開。
→Clamp Scopeを作った話 — CSS clamp()の面倒な計算を、スライダーで直感的に
画面幅に応じて文字サイズを滑らかに変えるclamp()。計算式を毎回調べるのが面倒で、動かしながら作れるツールにしました。
→Bezier Labを作った話 — cubic-bezierを『見ながら』作りたかった
数値だけのcubic-bezier設定に限界を感じ、動きを目で確認しながら調整できるツールを作った記録です。
→お問い合わせフォームに確認コード（メール認証）を入れた理由
スパム対策として、送信前にメールアドレスの確認コードを挟む仕組みを入れた設計の話です。
→CSS沼レスキューを作った理由 — 「なぜ効かないのか」を可視化したかった話
詳細度診断、px⇔rem変換、SCSS/LESS/Tailwind相互変換。バラバラに使っていた作業を、1つの道具にまとめた経緯です。
→