TypeScript
TypeScript | 基礎文法：配列・タプル – union型配列
入門
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － ネットワーク最適化
ネットワーク最適化って何をすること？非同期処理のパフォーマンス最適化の中で、ネットワーク最適化は「サーバーとの通信をできるだけ速く・少なく・無駄なくする」ことです。JavaScript の世界だと、だ...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － バッチ処理
「バッチ処理」は“まとめてやるから速くて優しい”という発想バッチ処理は、「細かい処理を1個ずつやるのではなく、ある程度まとめて一気に処理する」という考え方です。非同期処理のパフォーマンス最適化では、・...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － Promise キャッシュ
Promise キャッシュって何者？Promise キャッシュは、「同じ非同期処理を何度も実行せず、“進行中 or 結果”を使い回すテクニック」 です。特に、「同じ API を短時間に何回も叩いてしま...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － 不要 await の削除
「不要な await」を消すと何が嬉しいのかawait は便利ですが、「なくてもいい場所に書いてしまうと、わざわざ処理を遅くしている」ことがあります。パフォーマンス最適化でよく効くのが、この「不要な ...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － 並列化の判断
「並列化の判断」は“どこを同時に走らせていいか”を見極めること非同期処理のパフォーマンス最適化で一番効くのが、「待ち時間の長い処理を、できるだけ同時に走らせる」ことです。でも、何でもかんでも並列にすれ...
Python Python | テスト・設計・品質：Protocol
Protocolって何？一言でいうと「“こう振る舞うもの”を型で表す」Protocol は、型ヒントの世界で「このオブジェクトは、こういうメソッドや属性を“持っているもの”として扱える」という“振る舞...
Python Python | テスト・設計・品質：Literal
Literalって何？一言でいうと「値そのものを型にする」Literal は、型ヒントの世界で「この引数（または値）は、この“決まった値”しか受け付けません」と表現するための道具です。普通の型ヒントは...
Python Python | テスト・設計・品質：Union
Unionって何？一言でいうと「型の“どれか”を許すための道具」Union は、型ヒントの世界で「この値は、A か B か C のどれかです」と表現するための仕組みです。形式的にはこうです。from ...
Python Python | テスト・設計・品質：Optional
Optionalって何？一言でいうと「Noneかもしれない」を型で表す道具Optional は、型ヒントの世界で「この値は、あるときは T 型だけど、ないときは None かもしれない」という状態を表...
Python Python | テスト・設計・品質：typing 型ヒント
型ヒントって何？まずは「コメント」だと思ってOKPython の「型ヒント（type hints）」は、「この変数や関数は、こういう型を想定しているよ」という情報を、コードの中に書き添える仕組みです。...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － UsedRange
UsedRange は「そのシートで“何かに使われている範囲”をひとかたまりで教えてくれる」まずイメージから。UsedRange は「そのワークシートの中で、“何かしら使われているセルの最小の長方形”...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － 最終行取得
「最終行取得」は“どこまでデータが入っているか”を知るための超重要テクニックまずイメージから。「最終行取得」は「この列は、いったい何行目までデータが入っているのか？」をコードで調べることです。Exce...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － With構文
With 構文は「同じ相手に、まとめて命令を出すための“会話モード”」まずイメージからいきます。With 構文は「同じオブジェクトに対して、何回も続けて命令を出したいときに使う“まとめモード”」です。...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Select回避
「Select回避」とは何か ― “選択してから操作する”クセをやめる発想まず前提から整理します。Excel を手で操作するとき、あなたは必ず「選択してから操作」しています。A1 をクリックして選択 ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － NumberFormat
NumberFormat は「セルの“表示のしかた”を決めるためのプロパティ」まず一番大事なイメージから。NumberFormat は「セルの中身そのもの」ではなく、「どう見せるか（表示形式）」を決め...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Borders
Borders は「セルや範囲の“罫線”をまとめて操るためのオブジェクト」まずイメージからいきましょう。Font が「文字の見た目」、Interior が「背景色」だとしたら、Borders は「セル...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Interior
Interior は「セルの“背景色”などを操るためのオブジェクト」まずイメージから。Font が「文字の見た目」を扱うのに対して、Interior は「セルの中の塗りつぶし（背景色など）」を扱うオブ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Font
Font は「セルの文字の“見た目”をまとめて操るためのオブジェクト」まずイメージから。Font は「セル（Range）の“文字の見た目”をまとめて持っているオブジェクト」です。太字にするか文字サイズ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Paste
Paste は「クリップボードにあるものを“今ここに貼り付ける”動き」まずイメージから。Paste は「コピーされた内容（クリップボードの中身）を、指定した場所に貼り付ける動き」です。手作業でやってい...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Copy
Copy は「セルや範囲を“そのまま別の場所へ複製する”ためのメソッド」まずイメージから。Copy は「選んだセル（Range）を、別の場所へコピーする命令」です。手作業でやっている「コピー → 貼り...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － ClearContents
ClearContents は「セルの“中身だけ”を消すための、とても安全な消しゴム」まず一番大事なイメージから。ClearContents は「セル（Range）の“中身だけ”を消すメソッドです。中...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Clear
Clear は「セルの中身や設定を“まっさらにする”ためのメソッド」まずイメージから。Clear は「セル（Range）に対して、“いろいろ付いているもの”をまとめて消す命令」です。Range は「場...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Formula
Formula は「セルに入っている“数式そのもの”を読み書きするプロパティ」まずイメージから。Value が「セルの中身（結果の値）」だとしたら、Formula は「セルに入っている数式そのもの（=...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Value
Value は「セルや範囲の“中身そのもの”を表すプロパティ」まず一番大事なイメージから。Value は「セル（Range）の中身そのもの」 を表すプロパティです。Range は「場所」Value は...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Resize
Resize は「基準のセル範囲の“縦横サイズ”だけを変えるための道具」Resize は、ある Range（セル範囲）を「基準」にして、その位置はそのままに、“高さ（行数）”と“幅（列数）”だけを変更...
Python Python | テスト・設計・品質：isort
isortって何？まずは役割を一言でつかむisort は、Python の import 文を自動で並び替えてくれるツールです。「import の順番なんてどうでもよくない？」と思うかもしれませんが、...
Python Python | テスト・設計・品質：ruff
ruffって何？一言でいうと「超高速オールインワンLint＆フォーマッタ」ruff は、Python のコードをチェックするための「超高速リンター兼フォーマッタ」です。flake8 や isort、部...
Python Python | テスト・設計・品質：black
blackって何？一言でいうと「コード自動整形マシーン」black は、Python のコードを「自動できれいな形に整えてくれるフォーマッタ」です。flake8 が「ここおかしいよ」と指摘する先生だと...
Python Python | テスト・設計・品質：flake8
flake8 って何？一言でいうと「コードの赤ペン先生」flake8 は、Python のコードを自動でチェックしてくれる「リンター（Linter）」です。「文法的には動くけど、読みづらい・バグの元に...
Python Python | テスト・設計・品質：コードレビュー
コードレビューって何？まずは目的からはっきりさせるコードレビューは、「他の人（または未来の自分）が、あなたの書いたコードを読んで、気づいたことをフィードバックするプロセス」です。バグを見つけるため読み...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － SPA と MPA
SPA と MPA を一言でいうとSPA は Single Page Application（シングルページアプリケーション） の略で、「最初に 1 つのページを読み込んだあと、画面の中身だけを Ja...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － フロントエンド / バックエンド
フロントエンド / バックエンドを一言でいうとフロントエンドは「ユーザーの目に見える“表側”」。バックエンドは「見えないところで動いている“裏側の頭脳と心臓”」。あなたが Java で書くのは、基本的...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － 3 層アーキテクチャ
3 層アーキテクチャを一言でいうと3 層アーキテクチャは、「Web アプリを 3 つの役割にきれいに分けて作ろう」という設計の型 です。プレゼンテーション層（画面・API の入り口）アプリケーション層...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － 動的コンテンツ
動的コンテンツを一言でいうと動的コンテンツは、「リクエストのたびにサーバー側で中身を“その場で作って返すコンテンツ」 です。誰がアクセスしたかいつアクセスしたかどんな条件でアクセスしたかによって、返す...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － 静的コンテンツ
静的コンテンツを一言でいうと静的コンテンツは、「サーバー側で中身が変わらないファイルを、そのままブラウザに配るもの」です。HTML、CSS、画像（PNG/JPEG）、JavaScript ファイル、P...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － アプリケーションサーバー
アプリケーションサーバーを一言でいうとアプリケーションサーバーは「ビジネスロジックを本気で動かすための“Java 実行プラットフォーム”」だと思ってください。Web サーバーが「HTTP を受け取って...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － Web サーバーとは
Web サーバーを一言でいうとWeb サーバーは、「ブラウザ（クライアント）からの HTTP リクエストを受け取り、HTTP レスポンスを返す“受付兼配達係”」です。ブラウザが「このページください」「...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － ブラウザの役割
ブラウザの役割を一言でいうとブラウザは、「人間と Web の世界をつなぐ“通訳兼プレイヤー”」です。人間が URL を入力したりボタンを押したりすると、ブラウザがサーバーに HTTP リクエストを送り...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － クライアントとサーバー
クライアントとサーバーを一言でいうとクライアントとサーバーは、「お願いする側」と「応える側」です。ブラウザやスマホアプリが クライアント、そのリクエストを受け取って処理するのが サーバー。Web の世...
Java Java | Web 基礎・HTTP・REST：Web 全体像 － Web アプリの仕組み
Web 全体像をざっくりつかむまずは「ブラウザで URL を開くと、裏で何が起きているのか」をイメージでつかみましょう。あなたがブラウザに と入力して Enter を押すと、ブラウザは「サーバー」に対...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － 排他制御の考え方
排他制御を一言でいうと排他制御（はいたせいぎょ）は、「同時に走ると困る処理を、“必ず1つずつしか動かさないようにする考え方” です。非同期処理が増えてくると、「同じデータを同時に書き換える」「同じ処理...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － 競合状態（Race Condition）
競合状態（Race Condition）を一言でいうと競合状態（Race Condition）は、「どっちの非同期処理が先に終わるかによって、結果が変わってしまう危険な状態」 です。コード上は「こう動...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － 非同期状態管理
「非同期状態管理」を一言でいうと非同期状態管理は、「今この非同期処理が、どの状態にいるのかをコードと UI で一貫して扱うこと」 です。例えば、API 呼び出しひとつ取っても、状態はざっくりこう変わり...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － WebSocket との比較
WebSocket とポーリングの違いを一言でまとめるとポーリングは 「クライアントが定期的にサーバーへ様子を見に行く」 方式。WebSocket は 「サーバーとクライアントが常時つながり、サーバー...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － ポーリング
ポーリングを一言でいうとポーリング（polling）は、「サーバー側の状態が変わったかどうかを、クライアント側から定期的に“様子見”しに行く仕組み」です。サーバーから「変わったよ！」と通知してくれるの...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － スロットリング
スロットリングを一言でいうとスロットリング（throttle）は、「どれだけ連続でイベントが発生しても、“一定間隔ごとにしか処理を実行させない”テクニック です。スクロール、マウス移動、リサイズなどは...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － デバウンス
デバウンスを一言でいうとデバウンスは、「連続して何度も呼ばれる処理を、“最後の1回だけ”にまとめるテクニック」 です。ユーザーがキーボードを連打したり、入力ボックスに高速で文字を打ち込んだりすると、イ...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － キャンセル処理（AbortController）
キャンセル処理（AbortController）を一言でいうとAbortController は、「一度投げた非同期処理（特に fetch）を、あとから“やっぱりやめる”と止めるための仕組み」 です。...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － 多重送信防止
多重送信防止を一言でいうと多重送信防止は、「ユーザーが同じ操作を連打しても、サーバーには“1 回分だけ”しか飛ばさないようにする仕組み」 です。非同期処理（特にフォーム送信やボタン押下）では、ユーザー...
JavaScript JavaScript | 非同期処理：実務での非同期制御 － ローディング表示
ローディング表示を一言でいうとローディング表示は、「今、アプリはちゃんと動いているよ。止まっているんじゃなくて“待っているだけ”だよ」とユーザーに伝えるためのサインです。非同期処理（fetch / A...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 明示的に型を指定するケース
ゴール：「ふだんは推論に任せる。でも“ここだけは型を言語化したい”場面を見抜けるようになる」ジェネリクスは基本的に「型推論に任せる」のが正解です。それでも、あえて <T> を書いた方がいい場面がいくつ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 関数とジェネリクスの推論
ゴール：「<T> を書かなくても、勝手に T を決めてくれる感覚をつかむジェネリクスの一番おいしいところのひとつが、「型パラメータをほとんど書かなくていい」ことです。TypeScript が、関数の引...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － デフォルト型パラメータ
ゴール：「毎回 <T, string> と書かなくても済む“親切なジェネリクス”を書けるようになるデフォルト型パラメータは一言でいうと、「ジェネリクスに“デフォルトの型”を用意しておく仕組み」です。関...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 制約付きジェネリクス関数
ゴール：「なんでも T」ではなく「こういう T だけOK」を自分でコントロールできるようになる制約付きジェネリクス関数は一言でいうと、「ジェネリクスの“自由さ”に、ちょっとだけ“条件”を足した関数」で...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 型パラメータの制約（extends）
ゴール：「T はなんでもアリ」から「T は“こういう型だけ”に絞る」感覚をつかむジェネリクスに制約（extends）をつける一番の目的は、「T はなんでもいいわけじゃなくて、“この条件を満たす型だけ”...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 複数型パラメータ
ゴール：「T だけじゃ足りないときに、自然に型パラメータを増やせるようになる」ジェネリクスに慣れてくると、「T だけじゃ足りないな…もう1種類、型を扱いたい」という場面が必ず出てきます。複数型パラメー...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリクスとanyの違い
ゴール：「どっちも“なんでも受け取れる”のに、なぜジェネリクスが偉いのか」を腑に落とすジェネリクスも any も、一見どちらも「どんな型でも受け取れる」ように見えます。だからこそ初心者ほどこう思いやす...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 型パラメータの命名規則
ゴール：「T って何？を“意味のある名前”にできるようになる」ジェネリクスを書き始めると、まず最初に出てくる疑問がこれです。「T って、なんでみんな T って書いてるの？U とか K とか、あれ何？」...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリック関数の基本
ゴール：「型だけ違う同じ関数」を、1本のジェネリック関数で書けるようになるジェネリック関数の本質はとてもシンプルです。「型だけ違って、やっていることは同じ関数」を、1本にまとめるための書き方です。<T...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリクスとは何か
ゴール：「型を“あとから差し込める穴”として扱う感覚をつかむ」ジェネリクス（Generics）は一言でいうと、「型に“変数”を導入して、あとから具体的な型を差し込める仕組み」です。関数でいうと、(x:...