JOURNAL
記事一覧
39件の記事
絞り込みを解除- 知る・学ぶわかったつもりの、その先へ
ALBとNLB、何が違う？「レイヤー」からわかるL1〜L7
ALBはL7、NLBはL4。そう聞いても、そもそもレイヤーって何？AWSのロードバランサーをきっかけに、OSI参照モデルのL1〜L7、通信で見る情報の違い、Fargateとの役割分担を図で整理しました。
- 知る・学ぶわかったつもりの、その先へ
コンテナを作り直すと、データも消える？保存先をComposeから読む
イメージ、コンテナ、ボリュームは同じ寿命ではありません。Appli ParkのローカルPostgreSQL構成から、どこへ保存され、再作成後に何を引き継ぐのか整理しました。
- 知る・学ぶわかったつもりの、その先へ
閉じた入力欄の文字は、どこへ行く？非表示と取り外しを比べる
折りたたんだ画面の入力が残る理由を、StoryDiaryの実コンポーネントで確認しました。画面に見えないこと、DOMから取り外すこと、サーバーへ保存することを分けます。
- 知る・学ぶわかったつもりの、その先へ
大きな文字と見出しは同じ？記事の目次ができるまで
見出しは見た目だけでなく、文章の構造を表します。実CMSの本文描画と目次関数へ架空ブロックを渡し、h2・h3、目次に載る条件、段落挿入で変わるIDを確認しました。
- 知る・学ぶわかったつもりの、その先へ
保存前に同名を確認したら、DBのUNIQUEは不要？
タグの保存前確認とDBの一意性は、別の場所で重複を防ぎます。実TagServiceとマイグレーションを読み、完全に分離したPostgreSQLの架空テーブルで大文字・小文字の重複拒否を試しました。
- 知る・学ぶわかったつもりの、その先へ
同じクラス名でも見た目が混ざらない？CSS Modulesの範囲を確かめる
二つのCSSファイルに同じheaderがあっても、生成後の名前は別になります。実プロジェクトのCSSを専用ページでビルドし、名前の分離と、通常のCSSが届く範囲を整理しました。
- 知る・学ぶわかったつもりの、その先へ
16文字のIDは、何を表している？Base64とランダム値を分ける
share&doのID生成は、ランダムな12バイトをURL向けのBase64で表します。既知の架空バイト列を往復変換し、文字数、表記、予測しにくさが別の話であることを確かめました。
- 知る・学ぶわかったつもりの、その先へ
押すとすぐ変わるのに、保存はまだ？お気に入りで学ぶ楽観的UI
お気に入りの表示がすぐ変わっても、通信が完了したとは限りません。実際の更新処理を模擬通信で動かし、先に表示を変える仕組みと失敗時の戻し方を確かめました。
- 知る・学ぶわかったつもりの、その先へ
同じデータへの処理は、順番待ちできる？行ロックを確かめる
「誰がアウト？」の更新処理には行ロックがあります。独立したPostgreSQLの小さな表で、二つ目の処理が待つことと、普通の読み取りまで全部止まるわけではないことを確かめました。
- 知る・学ぶわかったつもりの、その先へ
ダイアログの中を押しても閉じないのはなぜ？クリックの伝わり方
背景を押すと閉じるのに、中のボタンを押しても閉じない。実Modalを専用ページで動かし、イベントの伝播と、閉じる処理を直接呼ぶ経路を確認しました。
- 知る・学ぶわかったつもりの、その先へ
APIは応答したのに読めない？CORSでブラウザーが確認すること
CORSのエラーは、必ずしも要求がサーバーへ届かなかった意味ではありません。二つのローカル接続先を使い、GETの応答と、独自ヘッダー付きPOSTの事前確認を比べました。
- 知る・学ぶわかったつもりの、その先へ
画面が見えることと、ボタンが動くことは同じ？HTMLとhydration
Client Componentにも、最初のHTMLに含まれる表示があります。専用Next.jsページの生成HTMLと、ブラウザーで反応するボタンを比べ、初期表示と操作処理を分けて確認しました。
- 知る・学ぶわかったつもりの、その先へ
保存の途中で失敗したら？自作CMSで学ぶトランザクション
公開版の更新と編集下書きの削除が別々に確定すると、途中状態が残ります。自作CMSのpublishDraftを読み、同じ構造の小さなSQL実験で、成功とロールバックを比較しました。
- 知る・学ぶわかったつもりの、その先へ
新しいAPIに替えた瞬間、古い画面は動く？更新途中の互換性を考える
画面とAPIが同時に切り替わるとは限りません。Appli Parkの更新順序と架空のAPI変更を使い、旧画面と新APIが組み合わさる時間の互換性を整理しました。
- 知る・学ぶわかったつもりの、その先へ
CookieのHttpOnly・Secure・SameSiteは、何を変える？
三つのCookie属性は、それぞれ別の範囲を制御します。Appli Parkのゲスト用Cookieをダミー値で生成し、資格情報とマーカーの違い、削除時の指定を確認しました。
- 開発記録
挙げ録の開発記録｜入力は2つ、保存できた分だけ積み上がる設計
重さと回数だけの入力を、正確な保存と気持ちのよい反応につなぐには。挙げ録の入力設計、日別・期間別の集計、保存成功後の演出、通信の再送と小数の扱いを実装に沿って紹介します。
- 知る・学ぶわかったつもりの、その先へ
「保存した」はどこに残る？ワインQで学ぶlocalStorage
ワインQで保存した問題が、新しく開いたページにも残るのはなぜ？localStorageと会員サーバー保存の違い、同一オリジン、タブ間の通知、保存に失敗したときの挙動を実画面と図で整理します。
- 知る・学ぶわかったつもりの、その先へ
選択肢をシャッフルしても正解がずれない仕組み｜ワインQの4択で考える
4択を並べ替えたら、正解の位置も変わるはず。ワインQの処理を使い、選択肢と正解情報を一緒に動かす方法を図解します。固定乱数の作例、24通りの交換パターン、200問を使った検証結果も紹介します。
- 知る・学ぶわかったつもりの、その先へ
「ＴＯＤＯ」と「todo」を同じように探すには？サイト内検索で学ぶ文字の正規化
全角・半角や英字の大文字・小文字をそろえると、検索はどう変わる？Appli Parkのサイト内検索を使い、NFKC正規化と部分一致の流れ、吸収できる表記ゆれとできない表記ゆれを図と実測で解説します。
- 知る・学ぶわかったつもりの、その先へ
同じTODOを同時編集したら？share&doで学ぶ楽観ロックと更新競合
楽観ロックがあれば、同時編集はすべて安全なのでしょうか。share&doのローカルAPIで古い版の保存を試し、バージョン比較・画面の同期・競合後の操作を図と実行結果で整理します。
- 知る・学ぶわかったつもりの、その先へ
CI / CDって言葉、正しく使えてますか？
CI/CDを「ビルドやデプロイのこと」で終わらせないために。継続的インテグレーションと、継続的デリバリー・継続的デプロイの違いを図で解説し、現場で「CI/CDどうしてますか？」と聞かれたときの答え方まで整理します。
- 開発記録
Googleログインでゲストデータを引き継ぐ設計｜初回登録と既存会員を分けた理由
Appli Parkでは、初回のGoogle登録だけ現在のゲストIDを会員へ昇格させ、登録済み会員への再ログインではゲストデータを自動統合しません。その理由と実装の分岐、確認したケースを紹介します。
- 開発記録
AI駆動開発とは？AI時代に何をどこまで任せるべきか
AI駆動開発とは、生成AIを一部の補助ではなく開発工程全体の推進力として活用する考え方です。 Appli Parkでの「何食べたい」の実装例をもとに、AIへ渡した条件、人間が決めた範囲、実装後の確認を個人的な視点から整理します。
- お知らせ
2択を10回選ぶだけ！食事提案アプリ「何食べたい」を公開しました
「何食べたい？」に迷う時間を少しだけ前へ進める、2択の食事提案アプリ「何食べたい」を公開しました。昼・夜を選び、食べたい料理を10回答えるだけ。選びやすさ、提案の仕組み、自作イラストの工夫を、公開時の制作記録とその後の更新を分けて紹介します。
- 開発記録
Spring Bootのcron定期実行｜@Scheduledで期限切れデータを削除する
AppliParkでは、TODOリストと「誰がアウト？」の期限切れデータをSpring Bootの@Scheduledで定期削除しています。 AWS上でもEventBridge＋Lambdaを使わなかった理由、実装方法、複数台構成での注意点を実例から紹介します。
- お知らせ
罰ゲーム抽選アプリ「誰がアウト？」を公開しました！
グループで匿名の言葉を送り、その日のOUTを決める「誰がアウト？」を公開しました。 基本的な使い方と、本文を保存しない設計、再現可能な判定、複数人の進行同期など、開発で工夫した点を紹介します。
- お知らせ
Google認証によるログイン機能を導入しました！
Googleアカウントでログインすると、share&do・coffee diary・習慣マネージャー・StoryDiary・挙げ録・トレノートの会員に紐づくデータを別端末から使えます。初回登録時の引き継ぎ条件と、ブラウザ内にだけ残るデータの違いも紹介します。
- お知らせ
習慣マネージャーを公開しました！
三日坊主になりがちな毎日の習慣を、完了チェックとカレンダーで無理なく振り返れる「習慣マネージャー」を公開しました。
- お知らせ
「おいしかった一杯」を忘れないために。coffee diaryを作りました
coffee diaryで一杯の苦味・酸味とメモを残す方法を紹介します。記入例、味わいでの絞り込み、編集・削除、ゲストと会員の違い、保存期間を実際の画面に沿って説明します。
- 開発記録わかったつもりの、その先へ
テストカバレッジとは？C0・C1・C2の違いを例で解説
テストカバレッジは、テスト実行時にコードのどこを通ったかを示す指標です。C0・C1・C2の違い、複合条件で注意する点、100％でも安心できない理由を例とともに整理します。