知る・学ぶ
ALBとNLB、何が違う？「レイヤー」からわかるL1〜L7
ALBはL7、NLBはL4。そう聞いても、そもそもレイヤーって何？AWSのロードバランサーをきっかけに、OSI参照モデルのL1〜L7、通信で見る情報の違い、Fargateとの役割分担を図で整理しました。
- #Webアプリ開発
- #バックエンド
特集 / COLLECTION
← 特集一覧へわかったつもりの、その先へ
AIと学び直す、Web開発の基礎と仕組み。 アプリは動いた。でも、なぜ動くのか、何を確かめればよいのか。Appli Parkの開発で出会った実体験に基づく「なぜ」を出発点に、「わかったつもり」をひとつずつ理解し直す特集です。
CONTENTS
この特集の記事
23件の記事
- 知る・学ぶ
コンテナを作り直すと、データも消える？保存先をComposeから読む
イメージ、コンテナ、ボリュームは同じ寿命ではありません。Appli ParkのローカルPostgreSQL構成から、どこへ保存され、再作成後に何を引き継ぐのか整理しました。
- #Webアプリ開発
- #AppliPark
- #バックエンド
- 知る・学ぶ
閉じた入力欄の文字は、どこへ行く？非表示と取り外しを比べる
折りたたんだ画面の入力が残る理由を、StoryDiaryの実コンポーネントで確認しました。画面に見えないこと、DOMから取り外すこと、サーバーへ保存することを分けます。
- #Webアプリ開発
- #AppliPark
- #UI・UX
- #テスト
- 知る・学ぶ
大きな文字と見出しは同じ？記事の目次ができるまで
見出しは見た目だけでなく、文章の構造を表します。実CMSの本文描画と目次関数へ架空ブロックを渡し、h2・h3、目次に載る条件、段落挿入で変わるIDを確認しました。
- #Webアプリ開発
- #AppliPark
- #UI・UX
- #CMS
- 知る・学ぶ
保存前に同名を確認したら、DBのUNIQUEは不要？
タグの保存前確認とDBの一意性は、別の場所で重複を防ぎます。実TagServiceとマイグレーションを読み、完全に分離したPostgreSQLの架空テーブルで大文字・小文字の重複拒否を試しました。
- #Webアプリ開発
- #テスト
- #CMS
- #バックエンド
- 知る・学ぶ
同じクラス名でも見た目が混ざらない？CSS Modulesの範囲を確かめる
二つのCSSファイルに同じheaderがあっても、生成後の名前は別になります。実プロジェクトのCSSを専用ページでビルドし、名前の分離と、通常のCSSが届く範囲を整理しました。
- #Webアプリ開発
- #AppliPark
- #UI・UX
- 知る・学ぶ
16文字のIDは、何を表している？Base64とランダム値を分ける
share&doのID生成は、ランダムな12バイトをURL向けのBase64で表します。既知の架空バイト列を往復変換し、文字数、表記、予測しにくさが別の話であることを確かめました。
- #Webアプリ開発
- #AppliPark
- #バックエンド
- 知る・学ぶ
押すとすぐ変わるのに、保存はまだ？お気に入りで学ぶ楽観的UI
お気に入りの表示がすぐ変わっても、通信が完了したとは限りません。実際の更新処理を模擬通信で動かし、先に表示を変える仕組みと失敗時の戻し方を確かめました。
- #Webアプリ開発
- #AppliPark
- #UI・UX
- 知る・学ぶ
同じデータへの処理は、順番待ちできる？行ロックを確かめる
「誰がアウト？」の更新処理には行ロックがあります。独立したPostgreSQLの小さな表で、二つ目の処理が待つことと、普通の読み取りまで全部止まるわけではないことを確かめました。
- #Webアプリ開発
- #AppliPark
- #バックエンド
- 知る・学ぶ
ダイアログの中を押しても閉じないのはなぜ？クリックの伝わり方
背景を押すと閉じるのに、中のボタンを押しても閉じない。実Modalを専用ページで動かし、イベントの伝播と、閉じる処理を直接呼ぶ経路を確認しました。
- #Webアプリ開発
- #AppliPark
- #UI・UX
- #テスト