開発者向け記事

Base64とは何か、なぜ必要で、どう動くのか

Base64がバイナリデータをASCIIテキストにどう変換するか、実際にいつ必要になるか。

Base32：Base64との違いと、どんな場面で便利か

大文字小文字を区別しないBase32のアルファベットと、Base64より便利な場面。

URL Encode/Decode：リンクにおけるパーセントエンコーディング

アドレスやパラメータ中の特殊文字が%XXの並びに変わる仕組み。

HTML Entities：特殊文字を安全に表示する方法

< > &をエスケープすべき理由と、それがマークアップの破損をどう防ぐか。

JWT：トークンの構造と「デコード」の意味

JWTのheader、payload、signatureと、デコードが署名検証と同じでない理由。

Unicode Escape：\uXXXX形式が意味するもの

JSONやJS文字列に現れる\u0041のようなシーケンスがどこから来て何を意味するか。

ROT13とシーザー暗号：単純な文字の置き換え

13文字分のシフトがROT13を自己反転にする理由と、今なお使われる理由。

Punycode：国際化ドメイン名がDNSでどう動くか

非ラテン文字を含むドメインがxn--プレフィックス付きのASCII形式にどう変わるか。

モールス符号：テキストが点と線に変わる仕組み

文字を点と線でエンコードする原理と、モールス符号が今どこで使われているか。

Data URI：画像をコードに直接埋め込むべき場面

Data URIがファイルの内容をHTMLやCSSに直接埋め込む仕組みと、それが有効な場面。

Gzip + Base64：テキストとして送るためのデータ圧縮

圧縮されたバイナリデータをテキストフィールドに入れる前にBase64でもエンコードする理由。

XML Entities：XML文書内の文字をエスケープする

これがないと解析時に文書が壊れる、XMLの5つの必須エンティティ。

JSON Formatter：整形、圧縮、検証

読みやすさのための整形、サイズのための圧縮、正しさのための検証 — JSONに関する3つの異なる作業。

JSONPath：手動でパースせずにJSONデータを検索する

JSONPathが大きなJSONから必要な値を手動での走査なしに1つの式で取り出せる仕組み。

JSON Diff：構造的な比較がテキスト比較とどう違うか

2つのJSONドキュメントの比較にキーの順序が影響してはいけない理由。

JSON Schema：JSONの構造を記述し検証する方法

JSON Schemaがデータが期待される契約に一致するかを自動的にチェックできるようにする仕組み。

JSON Flatten：ネストした構造をフラットなリストに変える

深くネストしたJSONがuser.address.cityのようなフラットなキーのリストにどう変わるか。

JSON Sort Keys：なぜオブジェクトのキーをソートするのか

JSONのキー順序が規定されていない理由と、それでも実際にはソートが役立つ理由。

JSON Repair：なぜJSONは壊れるのか、どう直すのか

「壊れた」JSONのよくある原因と、自動修復が直せることと直せないこと。

Mock JSON Generator：偽データが何の役に立つか

モックデータがバックエンドの完成前にUI開発を始められるようにする仕組み。

JSON ↔ YAML/CSV/XML/TOML：いつ、なぜ変換するのか

JSONをCSVに変換する際に失われるデータと、YAMLやTOMLが設定ファイルで人気な理由。

camelCase、snake_case、kebab-case：どの場面でどれを使うか

なぜcamelCase、snake_case、kebab-caseが存在し、それぞれ普通どこで使われるか。

Text Diff：テキストの差分検出アルゴリズムの仕組み

diffアルゴリズムがテキストの2つのバージョン間の最小変更セットをどう見つけるか。

正規表現：基本と貪欲マッチの罠

正規表現における貪欲マッチと非貪欲マッチの違いと、それが実務でなぜ重要か。

行のソート：アルファベット順と数値順はなぜ違うのか

アルファベット順ソートが数値をテキストとして扱う理由と、数値ソートとの違い。

文字列エスケープ：JS、JSON、シェル、正規表現でルールが異なる理由

あらゆる場面で通用する単一のエスケープルールが存在しない理由 — JS、JSON、シェル、正規表現それぞれに固有のルールがある。

CRLFとLF：改行コードが今も問題を引き起こす理由

CRLFとLFの違いがどこから来たのか、そしてgitやスクリプトで今も問題を引き起こす理由。

文字数と単語数のカウント：Unicodeがなぜこれを複雑にするか

Unicodeにおいて視覚的に1つの絵文字が複数のコードポイントから成り立つことがある理由。

Lorem Ipsum：このダミーテキストはどこから来て、なぜ意味がないのか

Lorem Ipsumテキストが実際どこから来たのか、そして実際のテキストの代わりに無意味なテキストが使われる理由。

Slugify：タイトルが有効なURLに変換される仕組み

記事タイトルがハイフンで区切られたクリーンで読みやすいURLに変換される仕組み。

Markdown：ドキュメント作成の標準になった理由

HTMLとは違い、Markdownが生のままでも読みやすい理由。

見えない空白文字：見た目が同じテキストの比較がなぜ失敗するのか

見えない空白文字1つが、見た目上同じ2つのテキストの比較を失敗させる仕組み。

テキストの反転：絵文字でなぜ壊れるのか

単純なテキスト反転が、複数のコードポイントから成る絵文字をなぜ壊してしまうのか。

テキスト頻度分析：ワードクラウドから暗号解読まで

文字頻度分析が歴史的にどう単純な換字式暗号の解読に役立ったか。

Hash Generator：MD5、SHA-1、SHA-256はどう違うのか

MD5が今もファイルの整合性検証に使われるが、パスワードには使われない理由。

Checksum Verifier：ファイルが壊れていないか確認する方法

一致するチェックサムがファイルの整合性を確認する一方、誰が作成したかは確認しない理由。

HMAC：鍵付きハッシュが通常のハッシュとどう違うか

通常のSHA-256がメッセージの改ざんから保護しない理由と、HMACがそれを可能にする理由。

Bcrypt：パスワードが速くではなく遅くハッシュ化される理由

速いSHA-256がパスワードに向かない理由と、遅いbcryptが適切な選択である理由。

UUID：ほとんど重複しない識別子はどう生成されるか

UUID v4が数百万台のマシンで独立して、衝突リスクなしに生成できる理由。

パスワード生成ツール：パスワードを本当に強くするものは何か

辞書の単語からなる長いパスワードが、記号や数字を含む短いパスワードより強い理由。

AES：共通鍵暗号の仕組み

AESで同じ鍵がデータの暗号化と復号の両方に使われる理由と、それが公開鍵暗号とどう違うか。

Argon2：このアルゴリズムがパスワードハッシュコンペティションで優勝した理由

Argon2が古いパスワードハッシュ化アルゴリズムよりGPUを使った攻撃に対してどう優れた防御を行うか。

Scrypt：このアルゴリズムがなぜこれほど多くのメモリを必要とするか

scryptがASICデバイスでのクラッキングを困難にするために意図的に大量のメモリを要求する理由。

TOTP：認証アプリのワンタイムコードはどう機能するか

Google Authenticatorのコードがインターネットなしで動作し、時刻だけでサーバーと同期する理由。

PBKDF2：最も古い鍵ストレッチング標準

PBKDF2の推奨反復回数が毎年増え続ける理由。

X.509：SSL証明書の中身は何か

緑色の錠前を表示する前に、ブラウザがサイトの証明書で正確に何をチェックしているか。

PGP：公開鍵と秘密鍵による暗号化の仕組み

PGPの公開鍵は自由に共有できるが、秘密鍵は決して共有してはいけない理由。

Unix時間：コンピュータが1970年から時間を数える理由

1970年1月1日がほとんどのコンピュータシステムにとって時間の基準点になった理由。

Cron式：タスクのスケジュールを読み解く方法

*/15 * * * *のような式を読み解き、タスクが正確にいつ実行されるかを知る方法。

数値システム：2進法、8進法、16進法が存在する理由

CSSの色#FF5733が10進数ではなく16進数の桁で書かれる理由。

ビット演算：AND、OR、XORがビットレベルでどう動作するか

ビットAND が論理ANDとどう違うか、そしてなぜ数値の個々のビットを操作する必要があるのか。

日付の差：日数を数えることが見た目より複雑な理由

うるう年のせいで日付を単純に引き算すると間違った結果になる理由。

年齢計算：単純な年の引き算ではない理由

単純に生まれた年を引き算すると、実際より1歳多い年齢になることがある理由。

タイムゾーン：UTCがGMTと同じではない理由

UTCが年に2回変わることはないのに、ロンドン時間（GMT/BST）は変わる理由。

時間計算：時間・分・秒を正しく合計する方法

分と秒を足すとき、10進法の足し算と同じように余りを次の桁に「繰り上げ」なければならない理由。

ISO 8601 Duration：標準フォーマットで時間の長さを書く方法

PT1H30Mが「1時間30分」を意味し、「1分30時間」を意味しない理由。

週番号：国によって週の数え方が異なる理由

ISO 8601標準では1月1日が前年の第52週または第53週に属することがある理由。

ローマ数字：ゼロも位取りもないシステムの仕組み

IVが6ではなく4を意味する理由と、ローマ数字における減算のルールの仕組み。

IEEE 754：コードで0.1 + 0.2が0.3にならない理由

ほとんどすべてのプログラミング言語で0.1 + 0.2が0.30000000000000004と表示される理由。

数字を言葉に：数字を単語に変換する理由

銀行文書が金額を数字と言葉の両方で同時に書く理由。

URL解析：ウェブアドレスはどんな部分でできているか

URLの#以降のフラグメント部分は、サーバーには決して届かず、ブラウザだけが処理する。

クエリ文字列とJSON：複雑なデータを渡すにはどちらが適切か

クエリ文字列で配列を渡す標準的な方法が存在しない理由。

User-Agent：Chromeの文字列に「Mozilla」や「Safari」がある理由

ChromeのUser-Agentが、実際には違うのに「Mozilla」や「Safari」を名乗る理由。

HTTP Basic認証：Authorizationヘッダーの仕組み

Base64は暗号化ではない — Basic認証のパスワードは数秒でデコードできてしまう。

HTTPヘッダー：リクエストとレスポンスに付随するメタデータ

Content-Typeヘッダーが、レスポンスをHTML・JSON・画像のどれとして扱うかブラウザに伝える仕組み。

Cookie：Secure、HttpOnly、SameSite属性が重要な理由

HttpOnly属性が、XSS攻撃でセッションCookieが盗まれるのを防ぐ理由。

CORSエラー：ブラウザがレスポンスをブロックする理由

Postmanでは動くリクエストが、ブラウザではCORSエラーになる理由。

メールヘッダー：SPF、DKIM、DMARCで送信元を検証する仕組み

メールの実際の送信元を追跡するために、Receivedヘッダーを下から上に読む理由。

meta タグ：検索とSNSに実際に影響するのはどれか

検索エンジンがmeta descriptionを無視して、ページのテキストから独自のスニペットを生成することがある理由。

robots.txt：検索ボットはクロールできる範囲をどう判断するか

robots.txtのDisallowルールが、他の場所からリンクされているページを検索結果から隠さない理由。

Sitemap.xml：検索エンジンがサイトマップを必要とする理由

sitemap.xmlに載っていることが、検索エンジンがそのページをインデックスすることを保証しない理由。

ファビコン：1つのアイコンになぜこれほど多くのサイズと形式が必要なのか

すべてのデバイスで正しく表示するために、単一のfavicon.icoだけではもう不十分な理由。

sitemap.xmlの生成：サイトマップを自動的に組み立てる方法

仕様の一部であるにもかかわらず、検索エンジンがsitemap.xmlのpriorityフィールドをほぼ無視する理由。

HEX、RGB、HSL：色の書き方がこれほど多く存在する理由

デザイナーが手動で色合いを選ぶとき、HEXではなくHSLを選ぶことが多い理由。

CSS圧縮：ファイルから実際に何が取り除かれるのか、その理由

圧縮されたCSSが人間には読めなくなっても、ブラウザではまったく同じように動作する理由。

JavaScript圧縮：圧縮と難読化の違い

圧縮されたコードは望めば読めるのに対し、難読化されたコードはそうはいかない理由。

HTML圧縮：マークアップの空白がそもそもなぜ重要なのか

<pre>やtextareaの内部で空白を取り除くと、ほぼどこよりもページの見た目を壊してしまう理由。

CSSグラデーション：linearがradialやconicとどう違うか

conic-gradientが円グラフに向いていて、radial-gradientが光の斑点効果を生み出す理由。

Luhnアルゴリズム：カード番号の正しさをどう検証するか

Luhnチェックに合格したカード番号が、そのカードが実際に存在することを意味しない理由。

IBAN：国際銀行口座番号の構造

IBANの最初の2文字が口座番号そのものの一部ではなく国コードである理由。

QRコード：ピクセルの正方形にリンクがどう収まるのか

中央にロゴがあるQRコードでも、模様の一部が隠れていながらスキャンできる理由。

バーコード：Code 128がEAN-13とどう違うか

店頭に並ぶ商品がほぼ常にCode 128ではなくEAN-13を使う理由。

プレースホルダー画像：開発中に偽の画像が重要な理由

レイアウトがまだ構築中の間、開発者が本物の写真の代わりに意図的にグレーの四角形を入れる理由。