JavaScript
JavaScript | レベル別練習問題：条件分岐（if / else / switch）
プログラミング入門
JavaScript JavaScript | HTML / CSS 連携：CSS基礎 － 子孫セレクタ
子孫セレクタは「この中にある“全部の○○”にスタイルを当てるための選び方」子孫セレクタは、 「ある要素の“内側にある”別の要素たちをまとめて選ぶためのセレクタ」です。書き方はとてもシンプルで、 セレク...
JavaScript JavaScript | HTML / CSS 連携：CSS基礎 － IDセレクタ
IDセレクタは「ページの中で“この1つだけ”を指さすための名前」IDセレクタは、 「このページの中で、たった1つの特別な要素にスタイルを当てるための“固有の名前”」を扱う仕組みです。CSS側では # ...
JavaScript JavaScript | HTML / CSS 連携：CSS基礎 － クラスセレクタ
クラスセレクタは「意味のグループに“共通の見た目”を当てるための仕組み」クラスセレクタは、 「このクラス名が付いている要素たちに、共通のスタイルを当てる」ためのCSSの“選び方”です。CSS側では ....
JavaScript JavaScript | HTML / CSS 連携：CSS基礎 － セレクタ
セレクタは「どのHTML要素に、このCSSルールを“当てるか”を決めるもの」CSSの役割は「見た目のルールを書くこと」ですが、 その前に必ずやることがあります。「このルールを、どの要素に適用するか？」...
JavaScript JavaScript | HTML / CSS 連携：CSS基礎 － CSSの役割
CSSの役割は「見た目のルールをHTMLから“切り離して”管理すること」まず一番大事なところからいきます。HTMLの役割：ページの“中身”と“構造”を書くもの CSSの役割：その中身の“見た目”と“装...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － autocomplete
autocomplete は「ブラウザに“ここには何の情報が入るか”を教えるための属性」autocomplete は、 「この入力欄には、ユーザーのどんな情報が入るのか」をブラウザに教えるための属性 ...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － pattern
pattern は「この入力欄の“合格パターン”を正規表現で決めるためのルール」pattern は、 「この入力欄には、こういう形の文字列だけを“正解”として受け付けてほしい」 とブラウザに伝えるため...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － required
required は「ここは“絶対に空で送らせない”ためのスイッチ」required は、 「この入力欄は必須です。空のままフォームを送信させないでください」 とブラウザに伝えるための属性です。ユーザ...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － placeholder
placeholder は「入力欄の中に表示する“ヒントテキスト”」placeholder は、 入力欄の中に薄い文字で表示される「ここには何を書けばいいか」のヒント です。ラベルが「名前」だけだと、...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － range入力
range入力は「スライダーで“数値の範囲”から直感的に選んでもらう入力欄」type="range" は、 ユーザーに「ある範囲の数値」を、スライダーを動かして選んでもらうための入力欄 です。テキスト...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － color入力
color入力は「カラーピッカーで“色そのもの”を選んでもらうための入力欄」type="color" は、 ユーザーに「色」を選んでもらうための専用入力欄 です。テキスト入力で #ff0000 みたい...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － date入力
date入力は「カレンダーUIで“正しい日付”を確実に受け取るための入力欄」type="date" は、 ユーザーに「日付」を入力してもらうための専用入力欄 です。テキスト入力と違い、 ブラウザが「カ...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － file入力
file入力は「ユーザーのPCやスマホから“ファイルそのもの”を受け取るための入り口」type="file" は、 ユーザーの端末（PC・スマホ）の中から、画像やPDFなどの「ファイルそのもの」を選ん...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － radioボタン
radioボタンは「グループの中から“必ず1つだけ”選んでもらうための入力欄」type="radio" は、 「いくつかの候補の中から、ユーザーに“1つだけ”選んでもらうための入力欄」 です。チェック...
JavaScript JavaScript | HTML / CSS 連携：フォーム応用 － checkbox
checkbox は「ON/OFF や“複数選択”を表現するためのスイッチ」type="checkbox" は、 「その項目を選ぶか選ばないか（ON/OFF）を表現するための入力欄」 です。「利用規約...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － button
button 要素は「ユーザーに“何かのきっかけ”を押してもらうためのスイッチ」<button> は、 「ユーザーにクリック（タップ）してもらうことで、何かの処理を始めるためのスイッチ」 です。フォー...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － option
option 要素は「select の中の“1つぶんの選択肢”」<option> は、 「select の中に並ぶ、1 つ 1 つの“選べる候補”」 を表すタグです。<select> が「選択メニュー...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － select
select は「候補の中から選んでもらうための“選択メニュー”」<select> は、 「あらかじめ用意した選択肢の中から、ユーザーに選んでもらうための入力欄」 です。テキストボックスや texta...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － textarea
textarea は「長文や複数行の文章を入れてもらうための入力欄」<textarea> は、 「ユーザーに“複数行の文章”や“長めのテキスト”を入力してもらうための専用の入力欄」 です。input ...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － number入力
number入力は「数値だけを入れてもらうための“賢い入力欄”」type="number" の入力欄は、 ユーザーに 「数字だけ」を入力してもらうための専用の入り口 です。年齢 個数 価格 点数 割合...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － email入力
email入力は「メールアドレス専用の“賢いテキスト入力欄”」type="email" の入力欄は、 「ユーザーにメールアドレスを入力してもらうための、ちょっと賢いテキスト入力」 です。見た目はほぼ ...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － password入力
password入力は「中身を隠しながら文字を受け取るための入力欄」type="password" の入力欄は、 「ユーザーに文字を入力してもらうけれど、画面上では中身を見えなくする」 ための特別なテ...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － text入力
text入力は「なんでも文字を入れてもらうための“1行の入力欄”」type="text" の入力欄は、 「ユーザーに自由な文字列を 1 行ぶん入力してもらうための入り口」 です。名前 タイトル ニック...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － inputタグ
input 要素は「ユーザーから“1つの値”を受け取るための入り口」<input> は、 ユーザーから たった 1 つの値を受け取るためのパーツ です。名前 メールアドレス パスワード チェックの O...
JavaScript JavaScript | HTML / CSS 連携：フォーム基礎 － formタグ
form 要素は「入力をひとまとめにして“送信するための枠”」<form> は、 「ユーザーの入力をひとまとまりにして、どこかへ送るための“フォーム全体の箱”」 です。テキストボックス チェックボック...
Python Python | DevOps・運用：Docker network
Docker networkって何？一言でいうと「コンテナ同士をつなぐ“専用LAN”」Docker network は、コンテナ同士をつなぐための「仮想ネットワーク」です。同じネットワークに属するコン...
Python Python | DevOps・運用：Docker volume
Docker volumeって何？一言でいうと「コンテナが消えても残る“外付けハードディスク”」Docker volume は、コンテナの外側にある「永続ストレージ」です。コンテナの中のファイルは、コ...
Python Python | DevOps・運用：docker-compose
docker-composeって何？一言でいうと「複数コンテナを“1つのアプリ”としてまとめて起動・停止するリモコン」Docker は「1コンテナ＝1プロセス」をきれいに動かすのが得意です。でも、現実...
Python Python | DevOps・運用：Dockerfile ベストプラクティス
まずゴールを決めよう：「本番でそのまま動かせる、軽くて、安全で、再現性の高いイメージ」Dockerfile のベストプラクティスは、一言でいうと「どこでビルドしても、同じように動く、無駄が少なくて、安...
Python Python | DevOps・運用：CD 自動デプロイ
CD 自動デプロイって何？一言でいうと「テストに通ったコードを、人の手を介さず“同じ手順で”本番に届ける仕組み」CI が「自動テスト」だとしたら、CD（Continuous Delivery / De...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － セッション
セッションを一言でいうとセッションは「同じユーザーからの一連のリクエストを“ひとまとまり”として扱うためのサーバー側の仕組み」です。HTTP は本来「1 回 1 回がバラバラで、前後のつながりを覚えな...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － Cookie
Cookie を一言でいうとCookie は「ブラウザの中に一時的にメモしておける“名札・メモ用紙”」です。HTTP は本来「1 回 1 回のリクエストがバラバラで、前後のつながりを覚えていない」仕組...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － User-Agent
User-Agent を一言でいうとUser-Agent は「このリクエストを送っている“クライアントの正体”をサーバーに伝えるヘッダー」です。ブラウザなのか、スマホアプリなのか、Java のプログラ...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － Accept
Accept を一言でいうとAccept ヘッダーは「サーバーさん、レスポンスは“この種類のデータ”で返してくれると嬉しいです、という希望を伝えるヘッダー」です。クライアント（ブラウザやアプリ）が「J...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － Content-Type
Content-Type を一言でいうとContent-Type は「このボディの中身は“何の種類のデータ”かを相手に教えるためのヘッダー」です。中身が JSON なのか、HTML なのか、画像なのか...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － ボディの役割
ボディを一言でいうとHTTP のボディは「実際にやり取りしたい“中身そのもの”が入る場所」です。ヘッダーが「説明書」だとしたら、ボディは「商品そのもの」。ユーザー情報の JSON、HTML のページ、...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － ヘッダーの役割
ヘッダーを一言でいうとHTTP のヘッダーは「リクエストやレスポンスにくっついてくる“メタ情報（付加情報）”」です。本体（ボディ）が「中身」だとしたら、ヘッダーは「この中身は何なのか」「どう扱ってほし...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － パスパラメータ
パスパラメータを一言でいうとパスパラメータは「URL の一部として書かれる“ID などの変わる部分”」です。/users/1 の 1/products/123/reviews の 123みたいに、「ど...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － クエリパラメータ
クエリパラメータを一言でいうとクエリパラメータは「同じ URL の“条件やオプション”を指定するための追加情報」です。/users という「ユーザー一覧」というリソースに対して、「有効なユーザーだけ欲...
Java Java | Web 基礎・HTTP・REST：HTTP 詳細 － URL 構造
URL を一言でいうとURL は「インターネット上の“場所”を指し示す住所」です。ブラウザやプログラムは、この URL を手がかりに「どのサーバーの」「どのサービスの」「どのデータを」取りに行けばいい...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Find
Find は「表の中から“条件に合うセル”を一発で探しに行くためのメソッド」まずイメージから。Find は「この範囲の中から“〇〇”という値（文字）を持つセルを探してきて」と頼むためのメソッドです。手...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Delete
Delete は「セル・行・列を“詰めて”消す動き」まずイメージから。さっき学んだ Insert が「押し広げてスペースを作る」なら、Delete は「その場所を消して、周りを詰める」動きです。手作業...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Insert
Insert は「セル・行・列を“押し広げて”新しいスペースを作る動き」まずイメージから。Insert は「今あるセルや行・列をズラして、新しいセル／行／列の“空きスペース”を差し込む」動きです。手作...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Sort
Sort は「表の行を“並べ替える”ための仕組みをコードで操作するもの」まずイメージから。Sort は、表の行を「昇順」「降順」などのルールで並べ替えるための機能です。普段、リボンの「並べ替え」ボタン...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － AutoFilter
AutoFilter は「表に“絞り込み”をかけるための仕組みをコードで操作するもの」まずイメージから。AutoFilter は、シート上の“表”に対して「この条件に合う行だけ表示して」と絞り込みをか...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － tdタグ
td 要素は「表の“中身のマス”を表すセル」<td> は「このマスには“実際のデータ”が入っています」ということを表すタグです。table の中で、tr（行）の中に並ぶ「ふつうのセル」が td です。...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － thタグ
th 要素は「このセルは“見出し側”ですよ」と宣言するタグ<th> は「このセルは、ただのデータじゃなくて“見出し・ラベル”です」とブラウザや機械に伝えるためのタグです。table の中で使われ、「列...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － trタグ
tr 要素は「表の“1行分”をまとめるための行コンテナ」<tr> は「table の中で、横一列のセルをひとかたまりにする“行の箱”」です。table が「表全体の箱」だとしたら、tr は「その中の ...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － tableタグ
table 要素は「行と列で“表形式のデータ”を並べるための箱」<table> は、「行（よこ）と列（たて）で整理されたデータ」を表にするためのタグ です。時間割料金表成績表比較表みたいな、「表で見る...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － ddタグ
dd 要素は「ラベルに対する“中身・説明側”を表すタグ」<dd> は「これは“ラベルの中身・説明・値”ですよ」と示すためのタグです。単体では使わず、必ず <dl> の中で「ラベル（dt）」「その中身（...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － dtタグ
dt 要素は「ラベル側（項目名・用語）」を表すタグ<dt> は「これは“名前・ラベル・用語”の側ですよ」と示すためのタグです。単体では使わず、必ず <dl> の中で「ラベル（dt）」「その中身（dd）...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － dlタグ
dl 要素は「用語とその説明（ペアの一覧）」の箱<dl> は「用語（ラベル）と、その説明（値）」のペアを並べるための箱だと思ってください。“d” は definition（定義）、dl は defin...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － liタグ
li 要素は「リストの“1項目”を表すパーツ」まずイメージから。li 要素は、「ul や ol の中に並ぶ“1つ1つの項目”」 を表すためのタグです。ul（順不同リスト）＝「箱」ol（番号付きリスト）...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － olタグ
ol 要素は「順番に意味がある“番号付きリスト”の箱」<ol> は「1 → 2 → 3 の順番に意味がある項目の並び」を表すためのタグです。“o” は ordered（順序付き）の略で、「順番が大事な...
JavaScript JavaScript | HTML / CSS 連携：リスト・表組み － ulタグ
ul 要素は「順番を気にしない“箇条書きの箱”」まずイメージからいきます。<ul> は「順番はどうでもいいけど、いくつかの項目を並べて見せたい」ときに使う“箇条書きの箱”です。買い物リストサイトのナビ...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － 改行タグ（br）
br 要素は「ここで“行だけ”を折りたいときの改行スイッチ」<br> は「ここで行を折って、すぐ次の行から続けて書いて」とブラウザに指示するためのタグです。ポイントは、「段落を分ける」のではなく「同じ...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － 補足タグ（em）
em 要素は「言い方・ニュアンスを強めるためのタグ」<em> は「ここ、ちょっと“気持ち強め”で読んでほしい」という“ニュアンスの強調”を表すタグです。ブラウザのデフォルト表示だと斜体になりますが、目...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － 強調タグ（strong）
strong 要素は「見た目の太字」ではなく「意味として重要な部分」まずここをしっかり押さえたいです。<strong> は、「ここは文章の中で特に重要だよ」という“意味としての強調”を表すタグです。ブ...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － figcaptionタグ
figcaption 要素は「図のタイトル・説明を書くためのラベル」<figcaption> は、「この図は何なのか？」を説明するための“キャプション専用タグ” です。単体では使わず、必ず <figu...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － figureタグ
figure 要素は「画像やコードなど“ひとかたまりの図”の箱」まずイメージからいきます。<figure> は、「画像・図・コード・表など、“ひとつの図として意味を持つかたまり”を包む箱」です。単なる...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － alt属性
alt 属性は「画像が見えない人のための“言葉の代わり”」まず一番大事な本質からいきます。alt 属性は、「この画像は何なのか？」を“言葉で説明するための場所” です。画像がちゃんと表示されているとき...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － imgタグ
img タグは「ページに画像を埋め込むためのタグ」<img> タグは、「この場所に、この画像ファイルを表示して」とブラウザに伝えるためのタグです。テキストが <p> や <h1> なら、画像は <im...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － target属性
target 属性は「リンクを“どの窓で開くか”を決めるスイッチ」<a> タグの target 属性は、「このリンクをクリックしたとき、どこで開くか」 を指定するためのものです。行き先そのものを決める...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － href属性
href 属性は「このリンクの行き先はここです」という住所ラベルまず一番大事なところから。href 属性は、「このリンク（a タグ）は、どこへ飛ぶのか？」という“行き先”を指定するための属性です。hr...
JavaScript JavaScript | HTML / CSS 連携：テキスト・リンク・画像 － aタグ
a タグは「ページとページをつなぐ“リンクのタグ”」まず一番大事なことから。<a> タグは「ここをクリックすると、どこかへ移動します」という“リンク”を作るタグです。「a」は anchor（アンカー＝...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － コメントの書き方
HTML のコメントは「未来の自分と他人へのメモ」まず前提から。HTML のコメントは、<!-- ここがコメント -->という形で書きます。ブラウザには表示されませんが、ソースコードを開くと見える「メ...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － span要素
span 要素は「意味のついていない“文字レベルの小さな箱”」まずイメージから。<div> が「ブロック全体をまとめる大きめの箱」だとしたら、<span> は 「文章の一部分だけを囲う、小さな箱」 で...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － div要素
div 要素は「意味のついていない“箱”」＝レイアウト用のコンテナまず一番大事なことから。<div> は「特別な意味を持たない、ただの“箱（コンテナ）”」 です。「段落」でもない「見出し」でもない「ボ...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － 段落タグ（p）
p タグは「文章のひとかたまり」を表すタグまず一番大事なポイントからいきます。<p> は「文章のひとかたまり（段落）」を表すタグ です。「一文ごと」ではなく、「意味がひとまとまりになっている文章のかた...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － 見出しタグ（h1〜h6）
見出しタグは「文章の見出し」と「ページのアウトライン」を作るもの見出しタグ（<h1>〜<h6>）は、文字を大きくするためのタグではなく、「ここがタイトルです」「ここがその中の小見出しです」と、文章の構...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － body要素
body 要素は「ユーザーが実際に触る“本体”」HTML 全体を家にたとえると、<!DOCTYPE html> は「これは家ですよ」の宣言、<html> は家全体の外枠、<head> は電気・住所・設...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － head要素
head 要素は「ページの設定・プロフィールを書く場所」まずイメージからいきます。<head> は、「画面に直接は見えないけれど、ページにとって超重要な情報」を書く場所です。タイトル文字コードスマホ向...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － DOCTYPE宣言
DOCTYPE 宣言は「これはどのルールの HTML ですよ」という最初のひと言HTML ファイルの一行目に書くこれ：<!DOCTYPE html>これが DOCTYPE 宣言 です。役割を一言でいう...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － HTML文書の基本構造
HTML 文書の基本構造は「家の骨組み」みたいなものまずイメージからいきます。HTML ファイルは、ただタグを並べればいいわけではなく、「決まった骨組み（ひな形）」 を持っています。その骨組みがあるか...
JavaScript JavaScript | HTML / CSS 連携：HTML基礎 － HTMLの役割
HTML の役割は「中身の意味を伝えること」まず一番大事なことから。HTML の役割は「見た目を決めること」ではなく「中身の意味（構造）を伝えること」 です。人間にとっては「画面にどう見えるか」ですが...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － 安全なメソッド
「安全なメソッド」を一言でいうとHTTP でいう「安全なメソッド」は、「サーバー側の状態を変えないメソッド」 のことです。何回呼んでも、DB の中身が変わらない。新しいデータも増えないし、削除もされな...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － 冪等性
冪等性を一言でいうと冪等性（べきとうせい）は、「同じ操作を何回繰り返しても、最終的な結果が変わらない性質」のことです。1 回やっても、10 回やっても、「状態」が同じなら冪等。回数によって結果が変わる...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － PATCH
PATCH を一言でいうとPATCH は「このリソースの“一部だけ”を変えてほしいときに使うメソッド」です。PUT が「丸ごと上書きして」なら、PATCH は「ここだけ直して（パッチを当てて）」という...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － DELETE の役割
DELETE を一言でいうとDELETE は「この URL が指しているものを“消して”」とサーバーに頼むためのメソッドです。ユーザー削除商品削除お気に入り解除など、「そのリソース自体をなくす・無効に...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － PUT の役割
PUT を一言でいうとPUT は「この場所のデータを“丸ごとこの内容で上書きして”というメソッド」です。POST が「新しく作って」だとしたら、PUT は「ここにあるものを、このデータで置き換えて」で...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － POST の役割
POST を一言でいうとPOST は「サーバーにデータを送りつけて、“何かしらの処理をしてもらう”ためのメソッド」です。特に重要なのは、新しいデータ（リソース）を作成するサーバー側の状態を変えるという...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － GET の役割
GET を一言でいうとGET は「サーバーのデータを“読むだけ”のメソッド」です。「この URL の内容を見せて」「このデータを教えて」というときに使います。サーバー側の状態を変えない（書き換えない）...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － HTTP メソッド一覧
HTTP メソッドを一言でいうとHTTP メソッドは「この URL に対して、サーバーに何をしてほしいのか」を表す“動詞”です。同じ /users という URL でも、GET なら「取得したい」、P...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － リクエスト / レスポンス
リクエスト / レスポンスを一言でいうとHTTP の世界は、ものすごく乱暴に言うと「お願い」と「返事」だけでできています。ブラウザやアプリがサーバーに送る「お願い」がリクエスト、サーバーがそれに対して...
Java Java | Web 基礎・HTTP・REST：HTTP 基礎 － HTTP プロトコル概要
HTTP プロトコルを一言でいうとHTTP は「ブラウザ（クライアント）と Web サーバーが会話するための“決まりごと（プロトコル）”」です。ブラウザが「このページください」「このデータください」と...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － API 利用のベストプラクティス
API 利用のベストプラクティスは「安全・高速・壊れない」を同時に満たす設計API を使うときに初心者がつまずきやすいのは、「動くコード」と「正しいコード」の違い です。API は動くだけなら簡単です...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － 権限管理設計
「権限管理設計」は“技術”じゃなくて“信頼”の設計位置情報、カメラ、マイク、通知、センサー、ストレージ…。Web API の多くは「権限（permission）」をユーザーに確認してから使います。ここ...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － HTTPS の重要性
HTTPS は「盗み見・改ざん・なりすまし」をまとめて防ぐ“前提条件”まず一番大事なことから。今どきの Web 開発で「HTTP でいい場面」はほぼゼロ です。ログインがあるから HTTPSクレジット...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － CSP（Content Security Policy）
CSP は「このページで何をしていいか」をブラウザに教えるルールブックCSP（Content Security Policy）は、「このページでは、こういうリソースだけ読み込んでいい／こういうスクリプ...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － CSRF 対策
CSRF は「ユーザーになりすまして勝手に操作させる攻撃」まずイメージからいきます。CSRF（Cross-Site Request Forgery）は、「ログイン中のユーザーになりすまして、別サイトか...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － XSS 対策
XSS は「ユーザーの入力が“そのままスクリプトになる”事故」まず、XSS（クロスサイトスクリプティング）のイメージからいきます。XSS は、ざっくり言うと「ユーザーが入力した文字列が、そのまま HT...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － 非同期パフォーマンス
「非同期パフォーマンス」は“待ち時間をどう見せるか”の技術JavaScript のパフォーマンスって聞くと、「処理をどれだけ速くするか」をイメージしがちですが、非同期の世界ではもう一つ大事な視点があり...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － メモリ監視
「メモリ監視」は“どれだけ詰め込んでいて、どれだけ片付いていないか”を見ることパフォーマンスは「速さ」だけじゃなくて、「どれだけメモリを使っているか」も重要です。メモリを使いすぎると、ブラウザが重くな...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － 計測（time / mark）
「計測」は“なんとなく遅い”を数字に変えるための技術パフォーマンスの話で一番大事なのは、「速い／遅い」を 感覚ではなく数字で話せるようになること です。そのために使うのが、console.time /...
JavaScript JavaScript | Web API：パフォーマンス・セキュリティ － Performance API
Performance API は「なんとなく速い／遅い」を数字にするための道具「このページ、なんか重いな…」「この処理、体感遅いけど、どれくらい遅いんだろう？」Performance API は、こ...
Python Python | DevOps・運用：CI 自動テスト
CI 自動テストって何？一言でいうと「人がサボっても、機械が毎回テストしてくれる仕組み」CI 自動テストは、コードを GitHub に push したり Pull Request を作ったタイミングで...
Python Python | DevOps・運用：Issue 管理
Issue 管理って何？一言でいうと「やるべきこと・困っていることを“見える化”して、迷子をなくす仕組み」Issue 管理は、「タスク・バグ・改善点・相談ごと」をすべて Issue として記録し、整理...
Python Python | DevOps・運用：コードレビュー運用
コードレビュー運用って何？一言でいうと「一人の頭の中のコードを、チームの知恵に変える仕組み」コードレビュー運用は、「Pull Request をどうレビューするか」を、チームとしてのルールや習慣に落と...
Python Python | DevOps・運用：Pull Request
Pull Requestって何？一言でいうと「この変更、main に入れていいか一緒に確認してもらうための“申請書”」Pull Request（PR）は、「自分がブランチで作った変更を、main（や他...
Python Python | DevOps・運用：GitHub Flow
GitHub Flowって何？一言でいうと「小さく枝を切って、小さくレビューして、小さく本番に出すためのルール」GitHub Flow は、「GitHub を使って開発するときの、シンプルなブランチ運...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリクス設計の判断基準
ゴール：「ここはジェネリクスにする／しない」を自分で決められるようになることジェネリクスを“書ける”ようになった次のステップは、「どこで使うべきか」「どこでは使うべきでないか」を判断できることです。こ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 実務でよくある失敗例
ゴール：「“ありがちな事故パターン”を先に知っておいて、自分のジェネリクスを危険運転にしない」ジェネリクスは強力だけど、そのぶん「やらかしポイント」も多いです。しかも、やらかした瞬間はコンパイルが通る...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 可読性の高いジェネリクス
ゴール：「型が強いのに“怖くないコード”としてジェネリクスを書けるようになる」ジェネリクスって、慣れてない人から見ると「T とか U とかよく分からん記号が飛び交ってて怖いコード」に見えがちです。でも...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － 過剰ジェネリクスの回避
ゴール：「ジェネリクスは“カッコいい飾り”じゃなくて、“必要なときだけ出す道具”だと理解するジェネリクスに慣れてくると、ほぼ確実に一度は通る道があります。それが 「何でもかんでも <T> を付けたくな...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリクスの再利用設計
ゴール：「そのジェネリクス“だけ”で終わらせず、プロジェクト全体で使い回せる形に育てる感覚を持つここまでで、ジェネリクスそのものの書き方はかなり分かってきていると思います。ここから一歩進めて大事になる...
JavaScript JavaScript | Web API：位置情報・センサー － プライバシー配慮
センサーとプライバシーは「技術」じゃなくて「人の生活」に触れている話位置情報・カメラ・マイク・DeviceMotion・DeviceOrientation…。これらは全部、「あなたがどこにいて、何をし...
JavaScript JavaScript | Web API：位置情報・センサー － センサー利用の注意点
センサー利用の「注意点」は“技術”と“人間”の両方を見ること位置情報・DeviceOrientation・DeviceMotion・カメラ・マイク…。どれも「現実世界のあなた」を Web に持ち込むた...
JavaScript JavaScript | Web API：位置情報・センサー － バッテリー API（廃止傾向）
バッテリー API は「端末の電池残量をブラウザから覗く仕組み」だったまずイメージからいきます。バッテリー API（Battery Status API）は、ブラウザから「この端末のバッテリー残量や充...
JavaScript JavaScript | Web API：位置情報・センサー － DeviceMotion
DeviceMotion は「端末がどれくらい“揺れているか・加速しているか”」を教えてくれるセンサーまずイメージからいきます。DeviceMotion は、スマホやタブレットの「動き」そのものを数値...
JavaScript JavaScript | Web API：位置情報・センサー － DeviceOrientation
DeviceOrientation は「端末がどっち向いているか」を教えてくれるセンサーまずイメージからいきます。DeviceOrientation は、スマホやタブレットの「向き」を教えてくれる仕組...
JavaScript JavaScript | Web API：位置情報・センサー － 権限管理
「権限管理」は“ユーザーの OK がないと触れない領域をどう扱うか”の話位置情報・カメラ・マイク・通知・センサー系は、どれも「ユーザーのプライバシーや安全」に直結します。だからブラウザは、こういう機能...
JavaScript JavaScript | Web API：位置情報・センサー － 精度と誤差
「精度と誤差」は“どれくらい当たっていて、どれくらいズレているか”の話位置情報を扱うときに絶対に避けて通れないのが「精度（accuracy）」と「誤差（error）」 です。地図アプリを開いたら、自分...
JavaScript JavaScript | Web API：位置情報・センサー － watchPosition
watchPosition は「動いたらそのたびに現在地を教えてもらう」仕組み前回の getCurrentPosition は「今どこ？」を一回だけ聞く API でした。watchPosition は...
JavaScript JavaScript | Web API：位置情報・センサー － 現在地取得
「現在地取得」は“ブラウザに今いる場所を一回だけ教えてもらう”こと「現在地取得」と聞いたら、まずイメージしてほしいのはこれです。ブラウザに「今どこにいる？」と一度だけ質問して、緯度・経度などの位置情報...
JavaScript JavaScript | Web API：位置情報・センサー － Geolocation API
Geolocation API は「ブラウザに“今どこにいるか”を教えてもらう窓口」まずイメージからいきます。Geolocation API は、ブラウザに対して「このユーザーが今どこにいるか教えて」...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － interfaceのジェネリクス
ゴール：「interface は“型のテンプレート”であり、<T> で“穴あきテンプレート”にできると理解するクラスのジェネリクスが「インスタンス全体のルール」を決めるものだとしたら、interfac...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － クラスのジェネリクス
ゴール：「クラスにも <T> が付くんだ、しかも“インスタンス全体の型のルール”になるんだ、を体で覚える関数のジェネリクスはだいぶ見慣れてきたと思います。クラスのジェネリクスは、その 「型パラメータを...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリクスとintersection
ゴール：「T & U は“足し算された型”だ、と直感でわかるようになる」ジェネリクスと intersection（交差型、&）を一緒に使うときのキーワードは、「型を“混ぜる”のではなく、“足し算する”...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリクスとunionの併用
ゴール：「T なのに T | U もアリ？を“安全に混ぜる感覚”で理解するジェネリクスと union（|）を一緒に使うとき、最初に出てくるモヤモヤはだいたいこれです。「T って“1つの型”じゃないの？...
TypeScript TypeScript | 関数・クラス・ジェネリクス：ジェネリクス基礎 － ジェネリクス配列操作
ゴール：「配列操作は全部 any で書けるけど、あえてジェネリクスで“型を守る”感覚をつかむ配列操作は、正直 any[] でも全部書けます。でもそれをやると、バグも型の穴も“侵入し放題”になります。ジ...
JavaScript JavaScript | Web API：グラフィック・メディア － アニメーション処理
アニメーション処理は「毎フレーム、画面を描き直す仕組み」を作ることグラフィック系の JavaScript でいう「アニメーション処理」は、ざっくり言うと「時間の経過に合わせて、毎フレームごとに“今の状...
JavaScript JavaScript | Web API：グラフィック・メディア － WebRTC の概要
WebRTC は「ブラウザ同士を直接つないで、映像・音・データをやり取りする仕組み」まず一言でいうと、WebRTC は「ブラウザ同士を“ほぼ直接”つないで、カメラ映像・マイク音声・任意のデータをリアル...
JavaScript JavaScript | Web API：グラフィック・メディア － ストリーム処理
「ストリーム処理」は“流れてくる映像・音を、そのまま扱う”考え方グラフィック・メディアの世界でいう「ストリーム」は、ざっくり言うと「時間とともに流れてくるデータ（映像・音）の連続」です。カメラからの映...
JavaScript JavaScript | Web API：グラフィック・メディア － MediaDevices（カメラ・マイク）
MediaDevices は「ブラウザからカメラ・マイクを借りるための窓口」スマホや PC には、カメラやマイクが付いています。普段はカメラアプリやビデオ通話アプリがそれを使っていますが、実は Web...
JavaScript JavaScript | Web API：グラフィック・メディア － Audio API
Audio API は「ブラウザの中にある音のミキサー＆シンセサイザー」JavaScript で音を扱う方法は大きく分けて 2 つあります。ひとつは <audio> タグを JavaScript から...
JavaScript JavaScript | Web API：グラフィック・メディア － 動画制御
「動画制御」は“ブラウザにあるビデオプレイヤーのリモコンを自分で作る”ことHTML の <video> タグは、それだけで再生ボタンやシークバーを持っています。でも JavaScript から操作する...
JavaScript JavaScript | Web API：グラフィック・メディア － 画像読み込み
「画像読み込み」は“ファイルをブラウザに連れてきて、キャンバスに貼る”ことCanvas で画像を扱うときに必ず通るのが「画像読み込み」です。ざっくり言うと、画像ファイルをブラウザに読み込む読み込みが終...
JavaScript JavaScript | Web API：グラフィック・メディア － 描画処理
「描画処理」は“毎回、画面をどうやって作るか”を決めることCanvas API の世界でいう「描画処理」は、ざっくり言うと「キャンバスという白い紙に、どの順番で、何を、どこに、どういう見た目で描くか」...
JavaScript JavaScript | Web API：グラフィック・メディア － 2D コンテキスト
「2D コンテキスト」は“キャンバスに絵を描くためのペン箱”Canvas API を使うとき、必ず最初にやるのがこれです。const canvas = document.querySelector("...
JavaScript JavaScript | Web API：グラフィック・メディア － Canvas API
Canvas API は「ブラウザの中にあるお絵かき用の白い紙」Canvas API は、HTML の <canvas> 要素と JavaScript を使って図形・文字・画像・アニメーションなどを「...
JavaScript JavaScript | Web API：クリップボード・共有 － UX 改善パターン
クリップボード・共有の UX は「技術」より「気づかい」で差がつくコピー・ペースト・共有って、コード的にはどれも数行で書けます。でも、「使っていて気持ちいいかどうか」 はその数行の周りにある“気づかい...
JavaScript JavaScript | Web API：クリップボード・共有 － URL 共有
「URL 共有」は“このページを誰かに渡す”ための一番シンプルな機能URL 共有は、ざっくり言うと「今見ているページのリンクを、他の人や自分の別の端末に渡す」ための仕組みです。JavaScript で...
JavaScript JavaScript | Web API：クリップボード・共有 － ネイティブ共有
「ネイティブ共有」は“ブラウザの外の世界”に渡すための出口Web アプリの中だけなら、URL をコピーしたり、画面に何か表示したりすれば完結します。でも実際のユーザーは、このページを LINE で送り...
JavaScript JavaScript | Web API：クリップボード・共有 － Share API
Share API は「このページいい感じだから誰かに送ろう」をボタン一発にする仕組みスマホでブラウザを見ていると、「共有」ボタンからLINE やメール、Twitter などに URL を送れますよね...
JavaScript JavaScript | Web API：クリップボード・共有 － セキュリティ制限
クリップボードのセキュリティ制限は「ユーザーを守るための強いガード」クリップボードには、ユーザーがコピーしたあらゆる情報が入ります。パスワード、クレカ番号、住所、仕事の文章、社外秘のコード——全部です...
JavaScript JavaScript | Web API：クリップボード・共有 － 読み取り権限
クリップボードの「読み取り権限」は“ユーザーのプライバシーを守るための最重要ポイント”クリップボードには、ユーザーがコピーした パスワード・住所・クレカ番号・仕事の文章 など、とてもセンシティブな情報...
JavaScript JavaScript | Web API：クリップボード・共有 － 書き込み権限
「書き込み権限」は“クリップボードを勝手にいじらないためのブレーキ”Clipboard API の「書き込み権限」は、ざっくり言うと 「このサイトに、クリップボードへ書き込ませていいか？」 をブラウザ...
JavaScript JavaScript | Web API：クリップボード・共有 － ペースト処理
「ペースト処理」は“ユーザーのクリップボードの中身を、アプリに連れてくる”ことコピー処理が「アプリ → クリップボード」だとしたら、ペースト処理はその逆、「クリップボード → アプリ」 です。ユーザー...
JavaScript JavaScript | Web API：クリップボード・共有 － コピー処理
「コピー処理」は“ユーザーの手を 1 回減らす”ための仕組みコピー処理は、ユーザーが本来やるはずだったテキストをドラッグで選択Ctrl+C / 右クリック → コピーという手順を、ボタン 1 回で代わ...
JavaScript JavaScript | Web API：クリップボード・共有 － Clipboard API
Clipboard API は「コピー／ペーストをコードから扱うための正式な入口」普段、コピーやペースストはキーボードの Ctrl+C / Ctrl+V や右クリックメニューでやりますよね。Clipb...
Python Python | テスト・設計・品質：Web アプリの本番運用
「本番運用」って何？一言でいうと「“たまたま動く”から“24時間ちゃんと動き続ける”にすること」ローカルで FastAPI や Django を動かして「動いた！」は、まだスタートラインです。本番運用...
Python Python | テスト・設計・品質：API のモック
APIのモックって何？一言でいうと「本物の代わりに動く“テスト用の偽物サーバー”」API のモックは、「本物の外部APIを呼ばずに、その代わりをする“偽物”を用意してテストすること」です。本物のAPI...
Python Python | テスト・設計・品質：環境変数管理
環境変数管理って何？一言でいうと「コードに書いちゃいけない“秘密と設定”を外に出してあげること」環境変数管理は、「本番・開発・テストで変わる値」や「絶対にコードに埋め込んではいけない秘密」を、コードの...
Python Python | テスト・設計・品質：コンテナ構築
コンテナ構築って何？一言でいうと「動く箱を作るための“レシピづくり＋焼き上げ”」ここでいう「コンテナ構築」は、ほぼ「Docker コンテナを作ること」と考えてOKです。レシピを書くフェーズ（Docke...
Python Python | テスト・設計・品質：Docker
Dockerって何？一言でいうと「どこでも同じように動く“持ち運べる開発環境”」Docker は、ざっくり言うと「アプリとその周りの環境を、ひとまとめにして箱に入れて持ち運べるようにする仕組み」です。...
JavaScript JavaScript | Web API：ファイル・データ操作 － 大容量ファイルの扱い
「大容量ファイルの扱い」は“全部一気にやらない”が合言葉まず前提からいきます。数 KB〜数 MB 程度のファイルなら、FileReader.readAsText や readAsArrayBuffer...
JavaScript JavaScript | Web API：ファイル・データ操作 － CSV / JSON ファイル処理
CSV / JSON ファイル処理は「テキストとして読み、オブジェクトとして扱い、またテキストに戻す」流れCSV も JSON も、本質はただのテキストファイルです。JavaScript から扱うとき...
JavaScript JavaScript | Web API：ファイル・データ操作 － バイナリデータ処理
「バイナリデータ処理」は“0と1の生データ”を意識して触ることふだん JavaScript で扱っているのは、文字列・数値・オブジェクトなど「人間に優しい形」のデータです。でも、画像・音声・PDF・Z...
JavaScript JavaScript | Web API：ファイル・データ操作 － input type=”file”
input type="file" は「ユーザーにファイルを選んでもらうための唯一の正規ルート」まず大前提として、ブラウザの JavaScript は、勝手にユーザーのパソコンの中を覗けません。「この...
JavaScript JavaScript | Web API：ファイル・データ操作 － ドラッグ＆ドロップ
ドラッグ＆ドロップは「マウスでつかんで、そのままブラウザに渡す入力方法」ドラッグ＆ドロップ（D&D）は、「ユーザーがファイルや要素をマウスでつかんで、別の場所に“落とす”操作をイベントとして扱う仕組み...
JavaScript JavaScript | Web API：ファイル・データ操作 － ダウンロード処理
「ダウンロード処理」は“ブラウザの中のデータ”を“ユーザーのファイル”に変えることJavaScript でいう「ダウンロード処理」は、ブラウザの中にあるデータ（文字列・JSON・画像・Blob など）...
JavaScript JavaScript | Web API：ファイル・データ操作 － URL.createObjectURL
URL.createObjectURL は「Blob や File に一時的な URL を貼る魔法」URL.createObjectURL は、Blob や File に「一時的にアクセスできる UR...
JavaScript JavaScript | Web API：ファイル・データ操作 － Blob
Blob は「生データ（バイナリやテキスト）をまとめて持つ“データのかたまり”」Blob は、「ファイルっぽい“データのかたまり”をメモリ上に表現するためのオブジェクト」 です。画像・テキスト・JSO...
JavaScript JavaScript | Web API：ファイル・データ操作 － FileReader
FileReader は「ファイルの中身を“いろんな形”で読み出すための専用リーダー」前回の File API で出てきた File は、「ユーザーが選んだファイルへのハンドル（取っ手）」でした。でも...
JavaScript JavaScript | Web API：ファイル・データ操作 － File API
File API は「ユーザーが選んだファイルをブラウザから触るための窓口」まず一番大事なことから。JavaScript は、勝手にユーザーのパソコンの中を覗いたり、好きなファイルを読みまくったりはで...
JavaScript JavaScript | Web API：DOM 拡張 API － shadow DOM の概要
shadow DOM は「外側から見えない、部品専用のプライベート DOM」まず一言でいうと、shadow DOM は「コンポーネントの中だけで完結する、外側から直接いじれない専用 DOM」 です。普...
JavaScript JavaScript | Web API：DOM 拡張 API － documentFragment
documentFragment は「画面にまだ挿していない一時作業用のミニ DOM」DocumentFragment（document.createDocumentFragment() で作るやつ）...
JavaScript JavaScript | Web API：DOM 拡張 API － NodeList 操作
NodeList は「querySelectorAll が返してくる“要素の集まり”」まず前提からいきます。document.querySelectorAll() を使うと、複数の要素が一度に取れます...
JavaScript JavaScript | Web API：DOM 拡張 API － dataset API
dataset は「HTML に自由にメモを書いておけるポケット」dataset は、HTML 要素に “自分で決めたデータ” を安全に持たせておくための仕組み です。HTML の data-◯◯ 属...
JavaScript JavaScript | Web API：DOM 拡張 API － classList API
classList は「要素に付いているクラス名を出し入れするための専用リモコン」HTML 要素には class 属性がありますよね。<div class="box active"></div>この ...
JavaScript JavaScript | Web API：DOM 拡張 API － Event コンストラクタ
Event コンストラクタは「既存イベントを自分の手で発火させるための素のイベント」Event コンストラクタは、「クリックや変更など、既に名前が決まっているイベントを、自分の手で“発生させたことにす...
JavaScript JavaScript | Web API：DOM 拡張 API － CustomEvent
CustomEvent は「自分で名前を付けられるオリジナルイベント」CustomEvent は、「クリックやスクロールみたいな“既存のイベント”ではなく、自分で名前を付けたイベントを作って、発火でき...
JavaScript JavaScript | Web API：DOM 拡張 API － ResizeObserver
ResizeObserver は「要素の大きさが変わった瞬間を教えてくれるセンサー」ResizeObserver は、「特定の要素の幅や高さが変わったときに、それを教えてくれる仕組み」 です。ウィンド...
JavaScript JavaScript | Web API：DOM 拡張 API － MutationObserver
MutationObserver は「DOM の変化を見張る監視カメラ」MutationObserver は、「DOM（要素の追加・削除・属性変更・テキスト変更など）が変わった瞬間を教えてくれる監視カ...
JavaScript JavaScript | Web API：DOM 拡張 API － IntersectionObserver
IntersectionObserver は「要素が画面に入ったかどうかを見張る番人」IntersectionObserver は、「ある要素が、画面（または指定した枠）の中に入ったか・出たか」を自動...
Python Python | テスト・設計・品質：CD
CDって何？一言でいうと「テストが通ったら“そのまま本番まで運んでくれるベルトコンベア”」CD は大きく分けて2つあります。Continuous Delivery（継続的デリバリー）Continuou...
Python Python | テスト・設計・品質：CI（GitHub Actions）
CI（GitHub Actions）って何？一言でいうと「プッシュした瞬間に“自動でテストしてくれるロボット”」CI（Continuous Integration）は、「コードを少し変更するたびに、自...
Python Python | テスト・設計・品質：フォルダ構成標準化
フォルダ構成標準化って何？一言でいうと「どのプロジェクトでも迷子にならないための地図づくり」フォルダ構成標準化は、「Pythonプロジェクトのフォルダやファイルの置き方に、共通ルールを決めること」です...
Python Python | テスト・設計・品質：例外階層
例外階層って何？一言でいうと「エラーを“種類ごとに整理する”ための仕組み」例外階層（Exception Hierarchy）は、「エラーを種類ごとに分類して、親子関係で整理する」ための設計です。Pyt...
Python Python | テスト・設計・品質：ロギング設計
ロギング設計って何？一言でいうと「あとから原因を追えるように“足跡”を設計すること」ロギング設計は、「エラーが起きたとき・おかしな動きをしたときに、あとから原因を追えるように、どこで何を記録しておくか...
Python Python | テスト・設計・品質：REST 設計
REST設計って何？一言でいうと「URLとHTTPを“きれいなルール”で使う設計」REST 設計は、Web API を作るときに、URLHTTPメソッド（GET / POST / PUT / PATC...
Python Python | テスト・設計・品質：API 設計
API設計って何？一言でいうと「他人（未来の自分）が使いやすい“入口”を設計すること」ここでいう「API」は、Web API だけじゃなく、「関数・クラス・モジュールの“使い方の顔”」も含めた広い意味...
Python Python | テスト・設計・品質：interface 分離
interface分離って何？一言でいうと「いらないボタンを押させないようにする設計」interface 分離（インターフェース分離の原則 / Interface Segregation Princi...
Python Python | テスト・設計・品質：責務定義
「責務定義」って何？一言でいうと「この子は何を担当するのかを決めること」責務定義は、クラス・関数・モジュールなどに対して「あなたは何を担当するのか？」をはっきり決めることです。もっと砕くと、「このコー...
Python Python | テスト・設計・品質：モジュール分割
モジュール分割って何？一言でいうと「ファイルごとに役割をはっきり分けること」Python でいう「モジュール分割」は、コードを複数の .py ファイルに分けて、それぞれに「はっきりした役割」を持たせる...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － ページリロード
「ページリロード」は「このURLをもう一度最初から開き直すこと」まずイメージからいきます。ブラウザの「再読み込みボタン」や F5 を押すと、今表示している URL にもう一度アクセスするHTML・CS...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － アラート（alert / confirm / prompt）
アラートは「ブラウザが出してくれる超シンプルなダイアログ」alert / confirm / prompt は、ブラウザが標準で用意してくれているダイアログ表示の仕組み です。画面の真ん中に、ブラウザ...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － タブ操作（open / close）
「タブ操作」は「新しい窓を開く権利」と「閉じていい範囲」を理解するところからJavaScript でのタブ操作は、window.open() と window.close() が中心です。ただし、ここ...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － リダイレクト
「リダイレクト」は「ユーザーを別のURLに連れて行くこと」まず言葉の整理からいきます。リダイレクト（redirect） は、ざっくり言うと「今このページを見ているユーザーを、別の URL に自動的に移...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － 画面サイズ取得
「画面サイズ取得」は「どの“枠”のサイズが欲しいか」を決めるところから始まるまず一番大事なことから。「画面サイズ」と一口に言っても、実は何種類かあります。ブラウザのウィンドウ全体のサイズウィンドウの中...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － userAgent
userAgent は「ブラウザが名乗る自己紹介テキスト」navigator.userAgent（ふつうは userAgent と呼ぶ）は、「このブラウザはこういう環境ですよ」とサーバーなどに伝えるた...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － navigator
navigator は「今使っているブラウザと環境のプロフィールカード」navigator は、「このページを開いているブラウザや環境の情報」をまとめたオブジェクト です。どんなブラウザか（Chrom...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － history API
history API は「ブラウザの戻る・進むをコードから操る仕組み」history は window.history のことで、ブラウザの「戻る」「進む」ボタンと同じようなことを、JavaScri...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － location
location は「今開いているページの住所カード」location は、「このタブで今開いているページの URL 情報をまとめたオブジェクト」 です。「今どの URL を見ているか知りたい」「別の...
JavaScript JavaScript | Web API：ウィンドウ・ブラウザ制御 － window オブジェクト
window オブジェクトは「ブラウザタブそのもの」を表す巨大な入り口JavaScript でいう window は、「今あなたが見ているブラウザのタブ（ウィンドウ）そのものを表すオブジェクト」 です...
Python Python | テスト・設計・品質：ドメイン駆動設計
ドメイン駆動設計って何？一言でいうと「現実のルールをコードの中心に置く考え方」ドメイン駆動設計（DDD）は、「フレームワークやDBの都合ではなく、“現実世界のルール”を中心にコードを組み立てよう」とい...
Python Python | テスト・設計・品質：クリーンアーキテクチャ
クリーンアーキテクチャって何？一言でいうと「大事なものを真ん中に守る設計」クリーンアーキテクチャは、アプリケーションの「大事なルール（ビジネスロジック）」を、外側の技術的なもの（Web フレームワーク...
Python Python | テスト・設計・品質：リファクタリング
リファクタリングって何？一言でいうと「動きを変えずに中身だけキレイにする」リファクタリングは、「コードの外から見た振る舞い（仕様・動き）は変えずに、中身の構造だけを良くすること」です。バグ修正でも新機...
Python Python | テスト・設計・品質：mypy
mypyって何？一言でいうと「Pythonコードに“型のテスト”をかけるツール」mypy は、Python コードに書いた「型ヒント（type hints）」を読み取って、その使い方が矛盾していないか...
Python Python | テスト・設計・品質：TypedDict
TypedDictって何？一言でいうと「キー付き辞書に“型の設計図”を付けるもの」TypedDict は、「この辞書は、こういうキーを持っていて、それぞれの値はこういう型です」という“設計図”を型ヒン...
JavaScript JavaScript | Web API：タイマー・スケジューリング － スケジューリング設計
「スケジューリング設計」は「いつ・どのくらい・どう止めるか」を決めることタイマーは「ちょっと遅らせて実行する便利関数」ではなく、「処理のタイミングを設計するための道具」 です。いつ実行するかどのくらい...
JavaScript JavaScript | Web API：タイマー・スケジューリング － UI 更新との関係
UI 更新とタイマーの関係は「JavaScript とブラウザの役割分担」を理解すると一気に分かりやすくなるタイマー（setTimeout / setInterval / requestAnimati...
JavaScript JavaScript | Web API：タイマー・スケジューリング － 無限ループ防止
「無限ループ防止」は「止まる出口を必ず用意する」という発想タイマーやループを書いているときに一番やっちゃいけないのが、「永遠に終わらない処理」＝無限ループ です。ブラウザが固まるCPU が 100% ...
JavaScript JavaScript | Web API：タイマー・スケジューリング － タイマー精度の問題
「タイマー精度の問題」は「指定した時間どおりには動かないことがある」という話まず一番大事なことを先に言います。setTimeout(…, 1000) と書いても、きっちり 1000ms 後に実行される...
JavaScript JavaScript | Web API：タイマー・スケジューリング － requestIdleCallback
requestIdleCallback は「ブラウザがヒマなときにやってもらう雑用係」requestIdleCallback は、「今すぐじゃなくて、ブラウザがヒマになったタイミングでやってほしい処理...
JavaScript JavaScript | Web API：タイマー・スケジューリング － requestAnimationFrame
requestAnimationFrame は「ブラウザに最適なタイミングでアニメを進めてもらう仕組み」requestAnimationFrame（略して rAF）は、「アニメーションを滑らかに動かす...
JavaScript JavaScript | Web API：タイマー・スケジューリング － clearInterval
clearInterval は「繰り返し処理を止めるためのスイッチ」clearInterval は、setInterval で始めた“繰り返し処理”を止めるための関数 です。setInterval は...
JavaScript JavaScript | Web API：タイマー・スケジューリング － clearTimeout
clearTimeout は「さっき予約した“◯秒後”をなかったことにする」関数clearTimeout は、setTimeout で予約した「あとで実行する処理」をキャンセルするための関数 です。「...
JavaScript JavaScript | Web API：タイマー・スケジューリング － setInterval
setInterval は「◯秒ごとにこれを繰り返して」と予約する関数setTimeout が「一回だけあとで実行」だとしたら、setInterval は 「一定間隔で同じ処理を何度も繰り返す」 ため...
JavaScript JavaScript | Web API：タイマー・スケジューリング － setTimeout
setTimeout は「◯秒後にこれやって」を予約する関数setTimeout は、「今すぐじゃなくて、少し時間が経ってから処理を実行したいとき」に使うタイマー関数 です。「3 秒後にメッセージを出...
JavaScript JavaScript | Web API：通信・ネットワーク系 － WebSocket の概要
WebSocket は「つなぎっぱなしでしゃべり続けられる通信」まずイメージからいきます。ふつうの HTTP（fetch など）は「用があるときだけノックして、用が済んだらすぐ帰る」通信です。リクエス...
JavaScript JavaScript | Web API：通信・ネットワーク系 － オフライン対応の基本
まず「オフライン対応って何を指しているのか」をはっきりさせるオフライン対応と聞くと、「ネットが切れても全部普通に動く魔法」みたいに思いがちですが、現実はもう少し地に足がついた話です。本質は、「ネットワ...
JavaScript JavaScript | Web API：通信・ネットワーク系 － Service Worker の概要
Service Worker は「ブラウザの中に住む、裏方の小さなサーバー」まずイメージからいきます。Service Worker は、「ブラウザの中で動く、あなたのサイト専用の“裏方サーバー”」 で...
JavaScript JavaScript | Web API：通信・ネットワーク系 － キャッシュ制御
「キャッシュ制御」は“いつまで古いデータを使っていいか”を決めるルールまずざっくりイメージからいきます。キャッシュは、「一度取ってきたデータを、次回以降は早く返すために手元に置いておく仕組み」 です。...
JavaScript JavaScript | Web API：通信・ネットワーク系 － 認証ヘッダ
認証ヘッダは「あなたが誰なのか」をサーバーに伝えるための“身分証”まずイメージからいきます。認証ヘッダ（Authentication Header）は、「このリクエストは誰として送っているのか」 をサ...
JavaScript JavaScript | Web API：通信・ネットワーク系 － Cookie の扱い
Cookie は「ブラウザが自動で持ち運んでくれる小さなメモ」まずイメージからいきます。Cookie は、「ブラウザがサーバーとの間で自動的に持ち運んでくれる小さなメモ」 です。サーバーが「このユーザ...
JavaScript JavaScript | Web API：通信・ネットワーク系 － CORS の基本
まず「なぜ CORS なんてものがあるのか」からCORS を理解する一番の近道は、「ブラウザは、もともと“よそのサイトに勝手にリクエストさせない”ように作られている」という前提をちゃんと掴むことです。...
JavaScript JavaScript | Web API：通信・ネットワーク系 － Headers
ヘッダーは「一緒にくっついて飛んでいくメモ書き」まずイメージからいきます。HTTP の世界では、リクエストやレスポンスは「封筒付きの手紙」みたいなものです。本文（ボディ）実際の中身。JSON や HT...
JavaScript JavaScript | Web API：通信・ネットワーク系 － Request / Response オブジェクト
「Request / Response」は fetch がやり取りする“手紙の入れ物”まず大きなイメージからいきます。fetch は「サーバーと会話する窓口」でしたよね。その会話の中で実際に行き来して...
JavaScript JavaScript | Web API：通信・ネットワーク系 － fetch API
fetch は「ブラウザからサーバーにお願いしに行く関数」まずイメージからいきます。fetch は、「ブラウザからサーバーに“ちょっとデータください”とか“これ送ります”とお願いしに行くための関数」 ...
JavaScript JavaScript | Web API：ストレージ系 API － IndexedDB の概要
IndexedDB は「ブラウザ内のちゃんとしたデータベース」localStorage / sessionStorage は「小さなメモ帳」でした。IndexedDB は一段レベルが違います。イメージ...
JavaScript JavaScript | Web API：ストレージ系 API － セキュリティの注意点
「ストレージは安全な金庫」ではない、という前提から始めようlocalStorage / sessionStorage は便利ですが、「ここに入れておけば安全」な場所ではありません。ブラウザの中にあると...
JavaScript JavaScript | Web API：ストレージ系 API － ストレージイベント
ストレージイベントは「別タブでの変更を教えてくれる仕組み」まず一言でいうと、ストレージイベント（storage イベント）は「他のタブで localStorage が書き換えられたことを教えてくれる通...
JavaScript JavaScript | Web API：ストレージ系 API － 同期 API の特性
「同期 API」ってそもそも何者かまず言葉の整理からいきます。同期 API（synchronous API）というのは、呼び出した瞬間に処理が終わるまで、そのスレッドを止めてしまうタイプの API の...
JavaScript JavaScript | Web API：ストレージ系 API － 容量制限
ストレージの「容量制限」をちゃんと意識すると設計が変わるlocalStorage / sessionStorage は便利ですが、「無限に保存できる魔法の箱」ではありません。どちらもブラウザごとに 容...
JavaScript JavaScript | Web API：ストレージ系 API － JSON との組み合わせ
なぜ「ストレージ × JSON」がほぼセットなのかlocalStorage / sessionStorage は、とてもシンプルなストレージです。でも制約が一つあります——「保存できるのは文字列だけ」...
JavaScript JavaScript | Web API：ストレージ系 API － removeItem / clear
removeItem / clear は「部分的に消す」と「全部消す」の違いストレージ系 API（localStorage / sessionStorage）には、データを「書く」「読む」だけでなく、...
JavaScript JavaScript | Web API：ストレージ系 API － setItem / getItem
setItem / getItem は「ブラウザのメモ帳に書く・読む」操作まずざっくりイメージからいきます。setItem と getItem は、ブラウザの中にある小さなメモ帳に「書く」「読む」ため...
JavaScript JavaScript | Web API：ストレージ系 API － SessionStorage の基本
SessionStorage は「タブごとの一時メモ帳」まずイメージからいきます。SessionStorage は 「ブラウザのタブごとに用意される、一時的なメモ帳」 です。LocalStorage ...
JavaScript JavaScript | Web API：ストレージ系 API － LocalStorage の基本
LocalStorage は「ブラウザにメモ帳を置く」イメージまずざっくりイメージから。LocalStorage は、「ブラウザの中にある、キーと値を保存できる小さなメモ帳」 です。ページを閉じても、...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － プロとしての非同期設計
「プロとしての非同期設計」って何が違うのか非同期処理を「書ける」ようになるのは、正直そんなに難しくありません。async/await を覚えて、fetch を呼んで、try/catch を付ければ、と...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － 非同期バグの再現
なぜ「非同期バグの再現」がこんなに難しいのか非同期バグって、ほんとイヤらしいですよね。さっきまで出ていたのに、もう一回やると出ない。本番では起きるのに、ローカルでは起きない。理由はシンプルで、非同期バ...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － 例外仕様の文書化
なぜ「例外仕様の文書化」がそんなに大事なのか非同期処理は「うまくいくとき」だけ見ていると、わりと簡単そうに見えます。await fetch(...) して、res.json() して、画面に出す——こ...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － モック化戦略
「モック化戦略」ってそもそも何の話？非同期処理をテストしようとすると、必ずぶつかる壁があります。それが「外部とのやり取り」です。サーバーへのリクエストデータベースタイマー（setTimeout）ブラウ...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － テストしやすい非同期
なぜ「テストしやすい非同期」が大事なのか非同期処理って、バグが出ても再現しづらいし、「たまたま動いた」状態になりがちです。だからこそ、「テストしやすい形で非同期コードを書く」という発想がめちゃくちゃ重...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － 同期 API との境界
なぜ「同期 API との境界」を意識しないといけないのか非同期処理を学び始めると、「どこまでを同期で書いて、どこからを非同期にするのか」がだんだん分からなくなってきます。全部 async にしてしまう...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － 非同期 API 設計
「非同期 API 設計」って何を考えること？まず前提から整理します。ここでいう「非同期 API」は、サーバーの REST API というより、「あなたが JavaScript で提供する非同期関数の“...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － 非同期関数の命名
なぜ「非同期関数の命名」がそんなに大事なのか非同期処理って、それだけで頭を使います。そこに「名前がふわっとしている関数」が混ざると、一気に読めなくなります。doSomething(), handle(...
JavaScript JavaScript | 非同期処理：設計・理解の深化 － 責務分離
「責務分離」を非同期コードで考える意味非同期処理って、それだけで頭を使いますよね。そこに「UI」「エラー処理」「キャッシュ」「ローディング表示」などを全部一緒に書き始めると、一瞬でカオスになります。だ...
JavaScript入門 JavaScript | 非同期処理：設計・理解の深化 － 非同期コードの可読性
なぜ「非同期コードの可読性」がそんなに大事なのか非同期処理って、動かすだけなら意外とすぐ書けます。async 付けて、await fetch(...) して、console.log して終わり——みた...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － 非同期設計レビュー
「非同期設計レビュー」って何をする時間か非同期処理のコードは、とりあえず動かすだけなら意外と簡単です。async/await を付けて、fetch を呼んで、console.log して終わり。でも「...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － UI ブロック回避
なぜ「UI ブロック回避」がそんなに大事なのかJavaScript は基本「1本のメインスレッド」で動いています。この1本の線の上で、描画・クリック処理・スクロール・あなたの書いた処理が、全部順番待ち...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － 長時間処理の分割
なぜ「長時間処理の分割」が必要になるのかJavaScript は基本的に「シングルスレッド」で動きます。つまり、1本の道に、処理が一列に並んで流れているイメージです。その道の上で、重い処理（ループ・計...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － 非同期処理の計測
なぜ「非同期処理の計測」が大事なのかパフォーマンス最適化って、つい「こうした方が速そう」と感覚でやりがちです。でも、本当にやるべきことはシンプルで、たった一つです。「遅いところをちゃんと測って、事実ベ...
JavaScript JavaScript | 非同期処理：パフォーマンス最適化 － レイテンシ考慮
レイテンシってそもそも何？まず言葉からいきます。レイテンシ（latency）は「お願いしてから、最初の反応が返ってくるまでの時間」 です。ユーザーから見ると、ボタンを押してから画面が変わるまで検索ワー...
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:...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Offset
Offset は「基準セルから“何行・何列ずらした場所”を指すための道具」Offset は、あるセル（または範囲）を「基準」にして、そこから上下左右に「何行・何列ずらした場所」を指すためのプロパティで...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Columns
Columns は「列そのもの」をまとめて扱うための入り口まずイメージからいきます。Rows が「行単位（横一列）」を扱うのに対して、Columns は「列単位（縦一列）」をまとめて扱うためのオブジェ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Rows
Rows は「行そのもの」をまとめて扱うための入り口まずイメージからいきます。Cells が「行番号・列番号で“1セル”」を指すのに対して、Rows は「行単位（1行、または複数行）」をまとめて扱うた...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Cells
Cells は「行番号・列番号でセルを指定するための道具」まずイメージからいきます。Range("A1") が「住所（A1）」でセルを指定するのに対して、Cells(行番号, 列番号) は「座標（行・...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Range
Range は「シート上の“セルや範囲”そのもの」まずイメージからいきます。Range オブジェクト = シート上の「セル1つ」または「セルのかたまり」そのもの です。A1 だけを指す Range も...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Worksheet
Worksheet は「1枚のシートそのもの」まずイメージからいきます。Worksheet オブジェクト = Excel のシート1枚そのもの です。Workbook（ブック）が「ファイル1冊」だとし...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Worksheets
Worksheets は「ブックの中に並んでいる“ワークシートの集合”」まずイメージからいきます。1つの Excel ファイル（Workbook）の中には、シートが何枚も入っていますよね。その「ワーク...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Workbook
Workbook は「1つの Excel ファイルそのもの」まずイメージからいきます。Workbook オブジェクト = 1つの Excel ファイルそのもの です。拡張子が .xlsx や .xls...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Workbooks
Workbooks は「今 Excel で開いている“ブックの集合”」まずイメージからいきます。Excel では、1つ1つのファイルが Workbook（ブック）です。そして Workbooks は「...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：Excelオブジェクト基礎 － Application
Application は「Excel 全体そのもの」を表す“親玉オブジェクト”まず一番イメージしてほしいのは、Application オブジェクト = 「今動いている Excel そのもの」というこ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － InputBox
InputBox は「ユーザーに一言入力してもらうための小さな窓」InputBox は、ユーザーに文字や数字を入力してもらうためのダイアログです。MsgBox が「VBA → 人間への一方通行のメッセ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － MsgBox
MsgBox は「VBAが人間に話しかけるための吹き出し」MsgBox は、「メッセージボックス（小さなダイアログ）」を表示するための命令です。VBAが「ちょっと一言伝えたい」「確認したい」「結果を見...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Now関数
Now 関数は「今この瞬間の“日付＋時刻”をくれる関数」まず一言でいうと、Now 関数は「今この瞬間の“日付と時刻”を、まとめて Date 型で返してくれる関数」です。今日が何日か（年月日）何時何分何...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Date関数
Date 関数は「今日の日付だけをくれるシンプルな関数」まず一言でいうと、Date 関数は「今日の日付（年月日だけ）」を返してくれる関数です。時刻は含みません（0:00 相当）戻り値の型は Date ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － 日付型
日付型ってそもそも何者？まず一番大事なところからいきます。VBAの「日付型（Date）」は、「見た目は日付や時刻だけど、中身は“日付・時刻として計算できる数値”」です。セルに「2026/02/23」と...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Trim
Trim は「文字列の前後についた“余計な空白”を掃除するクリーナー」Trim 関数は、文字列の「前」と「後ろ」についているスペースを取り除くための関数です。イメージとしては、「文字列の両端にくっつい...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Replace
Replace は「文字列の一部を別の文字に“総入れ替え”する道具」Replace 関数は、「文字列の中にある“ある部分”を、別の文字列に置き換える」ための関数です。人間の感覚で言うと、「この文章の『...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Mid
Mid は「文字列の真ん中を、好きな位置から好きな長さだけ切り出すハサミ」Left/Right は「端っこ担当」でした。Mid は「真ん中担当」――文字列の“途中”から、指定した長さだけ切り出す関数で...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Left/Right
Left / Right は「文字列の端っこを切り取るハサミ」Left と Right は、どちらも「文字列の端っこから、指定した文字数だけ切り出す」ための関数です。Left は「左（先頭）から」Ri...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Len
Len は「文字列が何文字あるか」を教えてくれるメジャーLen 関数は、文字列の「長さ（文字数）」を調べるための関数です。イメージとしては、文字列にメジャーを当てて「何文字ぶんある？」と測る道具です。...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － 文字列操作
文字列操作って何をすること？VBAでいう「文字列操作」は、ざっくり言うと、文字列の一部を取り出す文字列の中を検索する文字を置き換える分割したり、くっつけたりするといった、「文字の並びをいじる」こと全般...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Preserve
Preserve は「配列の中身を守ったままサイズを変える」ためのキーワードまず一言でいうと、Preserve は「動的配列の中身を消さずに、サイズだけ変えたいときに使う魔法の言葉」です。普通の Re...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － ReDim
ReDim は「動的配列のサイズを“あとから決め直す”ための命令」ReDim は、普通の変数には使いません。「動的配列の“箱の数”を、あとから決めたり、変えたりするための命令」です。固定配列はこうでし...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － 動的配列
動的配列って何が「動的」なのか？前回の「配列宣言」は、こんな形でしたよね。Dim scores(1 To 5) As LongDim scores(1 To 5) As LongVBこれは「5個分」と...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － 配列宣言
配列ってそもそも何者？まず「配列宣言」の前に、配列そのもののイメージをはっきりさせましょう。配列はざっくり言うと、「同じ種類のデータを、番号付きでズラッと並べて入れておく箱」です。普通の変数は「1つの...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 － 障害時の復旧設計
「障害時の復旧設計」を一言でいうと障害時の復旧設計は、「エラーが起きた“あと”に、アプリをどう立て直すかをあらかじめ決めておくこと」 です。エラー処理というと、つい「catch してログ出して終わり」...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – エラー再送出
「エラー再送出」を一言でいうとエラー再送出（rethrow）は、「一度 catch で受け取ったエラーを、“ここでは処理しきらないから、上のレイヤーにもう一回投げ直す” 行為 です。非同期処理では特に...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – ログ出力設計
ログ出力設計を一言でいうとログ出力設計は、「エラーや重要な出来事を、あとから“意味を持って”追いかけられるように記録する設計」 のことです。ただ console.log(err) を散らばせるのではな...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – ユーザー向けエラー表示
ユーザー向けエラー表示を一言でいうとユーザー向けエラー表示は、「技術的に何が壊れたか」ではなく、「ユーザーが次にどうすればいいか」を伝えるためのメッセージ です。非同期処理（fetch / API 通...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – エラー情報の整形
「エラー情報の整形」を一言でいうと「エラー情報の整形」は、「バラバラで生々しいエラー情報を、“人間やアプリが扱いやすい形” に整理し直すこと」 です。生のエラーは、たいていこうです。・メッセージが英語...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – カスタムエラー
カスタムエラーを一言でいうとカスタムエラーは、「自分のアプリ専用の“名前付きエラー型”を作って、エラーの意味をはっきりさせる仕組み」 です。ただの Error だけだと、「何が原因で」「どのレイヤーで...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – catch の共通化
「catch の共通化」を一言でいうと「catch の共通化」は、「あちこちにバラバラに書いているエラー処理を、意味のある“ひとつの場所”にまとめること」 です。同じような catch (err) {...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – Promise 内 throw
「Promise 内 throw」を一言でいうとPromise の中で throw する、というのは「その Promise を reject（失敗状態）にするための、ちょっと短い書き方」 です。new...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – try / catch の範囲
「try / catch の範囲」を一言でいうとtry / catch の「範囲」は、「どこで起きたエラーまで、この try / catch で捕まえられるのか」 という話です。ここを勘違いすると、「...
JavaScript JavaScript | 非同期処理：エラー処理・例外設計 – 同期例外と非同期例外
同期例外と非同期例外を一言でいうと同期例外と非同期例外の違いは、「エラーが いつ 投げられて、どこで 捕まえられるか」の違いです。同期例外は、「その関数を呼んだ“その瞬間”に起きるエラー」。非同期例外...
Python Python | テスト・設計・品質：カバレッジ
カバレッジって何？まずは一言でイメージをつかむテストの「カバレッジ（coverage）」は、「テストを実行したときに、あなたのコードのどこまでが実際に実行されたか」を数値で教えてくれる指標です。ざっく...
Python Python | テスト・設計・品質：E2E テスト
E2E テストって何？まずはざっくりイメージからE2E テスト（End-to-End テスト）は、「ユーザーの操作の始まりから終わりまで、システム全体を通して動かして確認するテスト」です。単体テスト関...
Python Python | テスト・設計・品質：結合テスト
結合テストって何？単体テストとの違いからつかむ結合テスト（integration test）は、「複数の部品（関数・クラス・モジュール）を“つなげた状態”で、ちゃんと一緒に動くかを確認するテスト」です...
Python Python | テスト・設計・品質：単体テスト
単体テストって何？まずはゴールのイメージから単体テスト（ユニットテスト）は、「プログラムを小さな“部品（ユニット）”ごとに分けて、その部品がちゃんと動くかを確認するテスト」です。ここでいう“部品”は、...
Python Python | テスト・設計・品質：monkeypatch
monkeypatch って何？mock とどう違うのかpytest の monkeypatch は、「テスト中だけ、モジュールやオブジェクトの属性を書き換えるための道具」です。やりたいことは moc...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – API 設計との関係
API 設計と fetch の関係の全体像fetch 自体は「URL に HTTP リクエストを送って、レスポンスを受け取るだけ」の素朴な道具です。でも、実際のコードの書きやすさ・分かりやすさは、AP...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – 再試行処理
「再試行処理」を一言でいうとfetch の「再試行処理」は、「1 回の通信が失敗したときに、すぐ諦めずにもう何回かやり直す仕組み」 のことです。ネットワークの世界では、「たまたま一瞬だけ回線が不安定だ...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – タイムアウト対策
fetch の「タイムアウト対策」を一言でいうとfetch のタイムアウト対策は、「一定時間待ってもサーバーから返事がこなかったら、自分から通信を打ち切る仕組みを入れること」 です。そのままの fet...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – エラーレスポンス処理
「エラーレスポンス処理」を一言でいうとfetch / API 通信における「エラーレスポンス処理」は、「サーバーから“うまくいかなかった”という返事が返ってきたときに、何をどうするか決めておくこと」 ...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – ステータスコード確認
ステータスコード確認を一言でいうとfetch で API を叩くときの「ステータスコード確認」は、「サーバーが今どんな気持ちで返事してきているか」をちゃんと見ること です。200「OK、うまくいったよ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Exit文
Exit文は「ここでいったん打ち切るための非常口」Exit文は、「本来の終わり方を待たずに、ここで処理を打ち切りたい」ときに使う“非常口”のような命令です。ループなら「本当は10回回す予定だけど、条件...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Do Until
Do Until は「条件が成り立つ“まで”繰り返す」ループDo While は「条件が True のあいだ繰り返す」ループでした。Do Until はその逆で、「条件が True になる“まで”繰り...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Do While
Do While は「条件が成り立つあいだ、ずっと繰り返す」ループFor文は「何回繰り返すか」があらかじめ決まっているループでした。一方 Do While は、「この条件が True のあいだは、ずっ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － For Each
For Each は「集まりの中身を一つずつ取り出して処理する」ための文For文は「番号で回すループ」でした。i = 1 から 10 まで のように、「番号（インデックス）」を自分で管理します。一方 ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － Step指定
Step指定は「カウンタの増え方・減り方を決めるつまみ」For文は、For i = 1 To 10 ' 繰り返し処理Next iFor i = 1 To 10 ' 繰り返し処理Next iVBのように...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – JSON 送受信
JSON と fetch の関係を一言でいうとJSON と fetch の関係は、「JavaScript とサーバーが会話するときの“共通言語（JSON）”を、fetch という電話で送受信する」 と...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – headers の設定
headers ってそもそも何？なぜ設定が必要なのかfetch の headers は、「このリクエストに関する“メタ情報”（追加情報）をサーバーに伝えるためのラベル集」 です。サーバーは、ただ UR...
JavaScript JavaScript | 非同期処理：fetch / API 通信 － POST リクエスト
POST リクエストを一言でいうとfetch の POST リクエストは、「ブラウザからサーバーに“データを送る”ための HTTP 通信」 です。GET が「取りに行く」だとしたら、POST は「渡し...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – GET リクエスト
GET リクエストって何をしているのかまず「GET リクエスト」とは、“サーバーにデータをください、とお願いするためのリクエスト” です。今日の天気を教えてユーザー一覧をちょうだい記事の詳細を見せてみ...
JavaScript JavaScript | 非同期処理：fetch / API 通信 – fetch の基本
fetch ってそもそも何者かfetch は、JavaScript から「ネット越しにデータを取りに行く（サーバーと通信する）」ための関数 です。天気 API から今日の天気をもらう自分のサーバーにフ...
JavaScript JavaScript | 非同期処理：async / await – 同期風コードの注意点
async / await が生み出す「同期っぽいコード」とはasync / await を使うと、await を並べるだけで、「上から順番に実行されているように見えるコード」 が書けます。async...
JavaScript JavaScript | 非同期処理：async / await – async 関数の戻り値
async 関数の戻り値を一言でいうとasync 関数の戻り値は、「必ず Promise になる」 です。もう少しだけ正確に言うと：async を付けた関数は、必ず Promise を返すその Pro...
JavaScript JavaScript | 非同期処理：async / await – await とループ
await とループを一言でいうとawait をループの中で使うときのポイントは、「そのループを“順番にゆっくり回す”のか、“できるだけ同時に走らせる”のかを意識すること です。同じループでも、各要素...
JavaScript JavaScript | 非同期処理：async / await – 並列 await の書き方
並列 await を一言でいうと「並列 await」は、“複数の非同期処理を同時にスタートさせて、あとからまとめて結果を受け取る書き方” です。普通に await を縦に並べると、A が終わってから ...
JavaScript JavaScript | 非同期処理：async / await – 複数 await の順序
複数の await の「順序」を一言でいうとawait を何回も使うとき、「どこで await を書くか」によって、非同期処理が「順番に」動くか「同時に」動くかが変わります。同じ await でも、上...
JavaScript JavaScript | 非同期処理：async / await – finally との併用
async / await と finally を一言でいうとasync / await と finally を組み合わせると、「非同期処理が成功しても失敗しても、必ず最後にやりたい処理」を書ける よ...
JavaScript JavaScript | 非同期処理：async / await – try / catch との併用
async / await と try / catch を一言でいうとasync / await と try / catch を組み合わせると、「非同期処理の成功もエラーも、同期コードと同じように書け...
JavaScript JavaScript | 非同期処理：async / await – await の戻り値
await の戻り値を一言でいうとawait の「戻り値」は、「Promise が resolve（成功）したときに渡される“中身の値”」 です。const result = await somePr...
JavaScript JavaScript | 非同期処理：async / await – await の役割
await を一言でいうとawait は、「Promise の完了を“その行で一旦止まって待ち”、結果の値を取り出すためのキーワード」 です。await promise と書くと、その行で「promi...
JavaScript JavaScript | 非同期処理：async / await – async 関数の定義
async / await の「async 関数」を一言でいうとasync 関数は、「中で await が使える “非同期版の関数”」 です。先に一番大事なポイントだけ言うと：関数の前に async ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 － For文
For文は「決まった回数だけ同じ処理を繰り返すための仕組み」For文は、「この処理を、何回も、順番に、機械的に繰り返したい」というときに使う“ループ”の文です。人間の言葉にすると、「i を 1 から ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – Select Case
Select Case は「一つの値で分岐をきれいに並べるスイッチ」If ～ ElseIf ～ Else も「条件分岐」でしたが、条件が増えてくると、どうしても読みにくくなります。そこで登場するのが ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – ElseIf
ElseIfは「条件が3つ以上あるときの整理整頓ツール」If文は「もし〇〇なら〜する」という分岐でした。でも現実のロジックって、「合格／不合格」みたいな二択だけじゃなくて、S評価A評価B評価C評価D評...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – If文
If文は「条件しだいで処理を分けるための分岐スイッチ」If文は、プログラムに「状況を見て、やることを変えてね」と指示するための文です。人間の言葉で言えば、「もし〇〇なら、Aをする。そうでなければBをす...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – 比較演算子
比較演算子って何をする記号？比較演算子は、「この値とこの値を比べて、条件が成り立つかどうか」を判定するための記号です。VBAでは、比較の結果は必ず Boolean型（True / False） になり...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – 演算子
演算子は「値と値のあいだで何をしたいか」を表す記号演算子は、「足したい」「引きたい」「比べたい」「つなげたい」「条件を組み合わせたい」といった“意図”を、記号で表現したものです。VBAでは、数値を計算...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – 代入
「代入」は“箱の中身を決める”動作変数は「値を入れておく箱」でしたよね。代入は、その箱の中身を「これにする」と決める動作です。VBAでは、「左側＝右側」という形で書きます。変数名 = 値や式変数名 =...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – Variantの特徴
Variantは「なんでも入るけど、扱い注意な箱」Variant型は、VBAの中で「ほぼ何でも入る特別な箱」です。数値、文字列、日付、真偽値、オブジェクト参照、Empty、Null…と、ほとんどの値を...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – データ型理解
「データ型」は“箱の種類”だと思うと分かりやすい変数は「値を入れておく箱」でしたよね。データ型は、その箱の「種類」です。お菓子の箱、ペットボトル、ガラス瓶――入れられる中身や量が違うように、VBAの変...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：基本文法 – 変数宣言
変数宣言ってそもそも何？まず一番やさしく言うと、変数は「データを入れておく“名前付きの箱”」です。そして 変数宣言 は、その箱を「これからこういう用途で使います」と VBA に正式に伝える行為です。人...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – マクロセキュリティ理解
マクロセキュリティは「安全にVBAを使うための門番」Excel VBA を学ぶうえで、マクロセキュリティは絶対に避けて通れません。なぜなら、VBA は「Excel を自動で動かす力」を持っているぶん、...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – ヘルプ参照
VBAの「ヘルプ参照」は“公式の説明書”への入口VBAのヘルプ参照は、「この命令って正しくはどう使うんだっけ？」「このプロパティの意味、ちゃんと知りたい」というときに開く、“公式の説明書”への入口です...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – オブジェクトブラウザ
オブジェクトブラウザは「Excelの辞書＋地図」オブジェクトブラウザは、VBAで使える「オブジェクト・プロパティ・メソッド・定数」を一覧で調べられるツールです。イメージとしては、Excelの世界の「辞...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – 参照設定
参照設定ってそもそも何？まず一番やさしく言うと、参照設定＝「VBAに、この道具（ライブラリ）を使っていいよ、と事前に教える設定」です。Excel VBAは、最初から「Excelの基本機能」は使える状態...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – モジュール構成理解
「モジュール」はVBAコードを入れる“フォルダ”だと思ってみるまずイメージからいきます。Excelブックの中に、VBAのコードを入れておく“箱”がいくつか用意されています。その箱の種類のことを「モジュ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – Public / Private
Public / Private は「どこから見えるか」を決めるラベルPublic と Private は、「この変数（や Sub / Function）を、どこから見えるようにするか」を決めるための...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – スコープ概念
「スコープ」は“見える範囲”という発想でとらえるVBAでいう「スコープ」は、ざっくり言うと「この変数（やプロシージャ）は、どこから見える（使える）のかという“範囲”」です。同じ名前の変数でも、書いた場...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – SubとFunctionの違い
まずざっくり：「Sub」と「Function」の一番大きな違い一言で言うと、こうです。Sub「何か処理をするだけの手順」結果（値）を“返さない”タイプのプロシージャFunction「何か処理をして、そ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – コメント記述
コメントは「未来の自分へのメモ」VBAのコメントは、「プログラムとしては実行されない説明文」です。コードの意味、意図、注意点、「ここはあとで直す」などを、未来の自分や他人に伝えるためのメモだと思ってく...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – Option Explicit
Option Explicit は「うっかりミス防止スイッチ」まず一言でいうと、Option Explicit は「変数を必ず宣言しなさい」というルールをオンにするスイッチです。VBAは、本来「宣言し...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – イミディエイトウィンドウ
イミディエイトウィンドウって何をするところ？イミディエイトウィンドウは、VBAの世界の「その場で試せるメモ帳兼電卓兼リモコン」です。コードを書いて保存して実行するのではなく、「一行だけ命令を書いて、す...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – ブレークポイント
ブレークポイントってそもそも何者？ブレークポイントは、VBAの実行を「ここで一回止まって」と指示するための“しおり”のようなものです。マクロを F5 で一気に実行すると、途中の様子は見えませんが、ブレ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – ステップ実行（F8）
「ステップ実行（F8）」って何をするもの？VBAの「ステップ実行（F8）」は、マクロを一気に最後まで動かすのではなく、「1行ずつゆっくり進めて、何が起きているかを確認するためのモード」です。F5 が「...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – 実行方法（F5）
「実行する」とは何かをまず言葉でつかむVBAで「実行する」とは、書いたプログラム（マクロ）を実際に動かしてみることです。Sub で始まり End Sub で終わる一つのプロシージャを、上から順番に最後...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – プロシージャ作成
Excel VBAと「プロシージャ」の関係をイメージするExcel VBA では、コードはバラバラに書くのではなく、「プロシージャ」という単位にまとめて書きます。プロシージャは「意味のあるひと固まりの...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – 標準モジュール追加
Excel VBAと標準モジュールの関係をイメージするExcel VBA は「Excelを自動で動かすための言語」です。その“命令文”を書いて保存しておく箱が「標準モジュール」です。超ざっくり言うと、...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – VBE起動
Excel VBAとVBEの関係をイメージするExcel VBA は「Excelに対して出す命令の言語」です。その命令を書くための“ノート”が必要ですよね。そのノートが、Visual Basic Ed...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – 開発タブ表示
Excel VBAって何者かをまずイメージしようExcel VBA は「Excelに命令を出すための言語」です。正式名称は Visual Basic for Applications。難しそうに聞こえ...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – マクロの保存形式（xlsm）
Excel VBAって何？超初心者向けのイメージづくりExcel VBA は「Excelを自動で動かすための言語」です。正式名称は Visual Basic for Applications。難しく聞...
VBA Excel VBA | 超初心者（Excel操作＋マクロ体験）：VBA基礎環境 – マクロ有効ブックを理解
Excel VBAってそもそも何者？Excel VBA は「Excelに入っている小さなプログラミング言語」です。正式名称は Visual Basic for Applications。あなたが普段マ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – 実務でのクラス設計判断
ゴール：「この処理、本当にクラスにすべき？」を自分で判断できるようになる実務で一番大事なのは、「クラスの書き方」よりも、「そもそも、ここはクラスにすべきか？」を判断できることです。TypeScript...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – ConstructorParameters の利用
ゴール：「コンストラクタの引数の型を“そのまま再利用する”感覚をつかむConstructorParameters<T> は一言でいうと、「コンストラクタ型 T から、引数の型だけをタプルとして抜き出す...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – InstanceType の利用
ゴール：「クラス“側”だけ知っていても、インスタンスの型を安全に扱える」ようになるInstanceType<T> は一言でいうと、「コンストラクタ型 T から、new したときの“インスタンスの型”だ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – インスタンス型の取得
ゴール：「“クラスそのもの”から“インスタンスの型”だけをきれいに取り出す」感覚をつかむここでのテーマは、「クラス（コンストラクタ）から、そのインスタンスの型だけを取り出す」です。TypeScript...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – typeof Class の意味
ゴール：「typeof Class は“クラスそのものの型”を取る」と腑に落とすまず一番大事な一文からいきます。typeof クラス名 は、「インスタンスの型」ではなく「クラスそのもの（コンストラクタ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – クラスの型としての扱い
ゴール：「クラスには“2つの顔（値としての顔／型としての顔）”がある」と腑に落とすTypeScript のクラスで一番つまずきやすいポイントは、「クラスは“値”でもあり、“型”でもある」という二重の顔...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – クラスを返す関数
ゴール：「クラスも“値”として扱えて、関数から返せる」と腑に落とすまず一番大事なポイントはこれです。クラスは「型」でもあり、「値」でもあるということです。「型」としては User 型などに使い、「値」...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – Factoryパターン
ゴール：「new の場所を“工場”に集めて、作り方のルールを1カ所に閉じ込める感覚をつかむ」Factory（ファクトリ）パターンは一言でいうと、「オブジェクトの new をあちこちで書かず、“作る専門...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – Singletonパターン
ゴール：「アプリ全体で“そのクラスは1個だけ”をコードで保証する感覚をつかむ」Singleton（シングルトン）パターンは一言でいうと、「このクラスのインスタンスは、アプリ全体で“必ず1つだけ”にする...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – private constructorの用途
ゴール：「new させないクラス」に意味を持たせる感覚をつかむprivate constructor は一言でいうと、「このクラスは、外から new してほしくない」と宣言するための仕組みです。「え、...
Python Python | テスト・設計・品質：mock
mock って何？まずはイメージからmock（モック）は、テストのときだけ「本物の代わりに振る舞うニセモノのオブジェクト」です。本物をそのまま使うと困る場面を想像してみてください。外部 API を叩く...
Python Python | テスト・設計・品質：パラメタライズ
パラメタライズって何？まずはイメージからpytest の「パラメタライズ（parametrize）」は、「同じテストの形で、入力と期待値だけを変えて、何パターンも一気にテストする仕組み」です。同じ関数...
Python Python | テスト・設計・品質：fixture
fixture って何？まずはイメージからpytest の fixture（フィクスチャ）は、「テストのたびに必要になる“準備”を、共通化して再利用する仕組み」です。毎回のテストで同じようなことをして...
Python Python | テスト・設計・品質：assert
assert って何？まずは一言でいうとassert は、「この条件が成り立っているはずだ」とコードに書いておくための仕組みです。成り立っていれば何も起きない。成り立っていなければ Assertion...
Python Python | テスト・設計・品質：pytest 基本
pytest って何？まずはゴールのイメージからpytest は、Python のテストを書くための「超定番ツール」です。一言でいうと、テスト用のファイルと関数を書いておくpytest コマンドを叩く...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – クラスの再利用設計
ゴール：「このクラス、別の場面でもそのまま使えるな」と思える設計感覚を身につけるクラスの再利用設計は、一言でいうと、「今この機能だけ動けばいい」ではなく、「あとで別の場所でも気持ちよく使える形」にして...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – クラス間の責務分離
ゴール：「このクラスは“何だけ”をやるのか？」と説明できるようになるクラス間の責務分離は、一言でいうと、「1つのクラスに“何でもかんでも”やらせず、“役割ごと”にクラスを分けること」です。ここができて...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – 多重interface実装
ゴール：「1つのクラスに“複数の役割”を約束させる感覚をつかむ」多重 interface 実装は一言でいうと、「このクラスは A という顔も B という顔も、両方ちゃんと持ちますよ」と約束させる仕組み...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – implementsの役割
ゴール：「implements は“この約束は必ず守ります”という宣言」だと理解するimplements は一言でいうと、「このクラスは、この interface が決めた“形（契約）”を必ず守ります...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – interfaceでクラスを縛る
ゴール：「interface は“クラスに守らせる約束”」だと理解するここでのテーマは、「interface を使って、クラスに“こういう形であれ”と約束させる」という感覚をつかむことです。クラスの継...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – 抽象メソッドの定義
ゴール：「抽象メソッド＝“ここは必ず子クラスが実装して”という穴あきメソッド」と理解する抽象メソッドは一言でいうと、「このメソッドは“存在すること”だけ決めておいて、中身は子クラスに必ず書かせる仕組み...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – 抽象クラスの設計
ゴール：「抽象クラスは“共通の型と骨組みだけを持つ設計図”」だと理解する抽象クラスは一言でいうと、「new できないけれど、“こういうクラスであってほしい”という共通ルールを決めるクラス」です。共通の...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – メソッドオーバーライド
ゴール：「同じメソッド名でも“クラスごとに振る舞いを変える”感覚をつかむ」メソッドオーバーライドは一言でいうと、「親クラスと同じ名前・同じ型のメソッドを、子クラス側で“書き直す”こと」です。これができ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – superの役割
ゴール：「super は“親クラス側の自分”を呼び出すキーワードだ」と腹で理解するsuper は、継承しているときだけ出てくる特別なキーワードです。一言でいうと、「親クラス側の自分を呼び出すためのスイ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – 継承の基本（extends）
ゴール：extends で「共通部分をまとめる」感覚をつかむ継承（extends）は、「似たようなクラス同士で、共通部分を親クラスにまとめる」ための仕組みです。ここでは、「書き方」だけでなく「どういう...
Java Java | Java 詳細・モダン文法：設計・実務視点 – モダン Java 総復習
モダン Java 総復習のゴールここまで「設計・実務視点」でいろいろ見てきましたが、モダン Java を一言でまとめると、こういう世界観になります。「Java 8 以降の機能（ラムダ、Stream、O...
Java Java | Java 詳細・モダン文法：設計・実務視点 – 実務でよくある罠
「実務でよくある罠」とは何かここでいう「罠」は、コンパイルは通るし一見正しく動いているように見えるのに、本番や長期運用の中でじわじわ効いてきて、バグ・障害・保守地獄につながるポイントのことです。初心者...
Java Java | Java 詳細・モダン文法：設計・実務視点 – モダン構文の使い過ぎ問題
「モダン構文の使い過ぎ問題」とは何かJava には、ラムダ式、Stream API、Optional、record、switch 式、パターンマッチングなど、「モダンでカッコいい構文」がたくさんありま...
Java Java | Java 詳細・モダン文法：設計・実務視点 – 公開 API の互換性
公開 API の互換性とは何か公開 API の互換性とは、「一度公開した API を、後から変更しても利用者のコードが壊れないようにすること」です。ここでいう「利用者」は、あなたのクラスを呼び出す別の...
Java Java | Java 詳細・モダン文法：設計・実務視点 – API 設計観点
API 設計観点とは何かAPI 設計観点とは、「他の人（他のクラス・他の開発者・他のシステム）が使いやすく、安全で、誤解されないインターフェースをどう作るか」という視点のことです。Java の API...
Java Java | Java 詳細・モダン文法：設計・実務視点 – ライブラリ選定基準
ライブラリ選定基準とは何かライブラリ選定基準とは、「このプロジェクトでどの外部ライブラリを使うかを判断するためのルール」 のことです。Java の世界には膨大なライブラリがあります。便利なものもあれば...
Java Java | Java 詳細・モダン文法：設計・実務視点 – チーム内 Java 方針
チーム内 Java 方針とは何かチーム内 Java 方針とは、「このチームでは Java をこう使う」という“共通ルール・共通思想”のことです。コーディング規約が「書き方のルール」だとすれば、チーム内...
Java Java | Java 詳細・モダン文法：設計・実務視点 – コーディング規約統一
コーディング規約統一とは何かコーディング規約統一とは、「プロジェクト全員が同じ“書き方のルール”でコードを書くようにすること」です。これは単なる“見た目の統一”ではありません。読みやすさ、保守性、レビ...
Java Java | Java 詳細・モダン文法：設計・実務視点 – LTS バージョン
LTS バージョンを一言でいうとJava の LTS（Long-Term Support）バージョンは、「長期間サポートされる“安定版”の Java」です。実務で言うと、「会社やプロジェクトが“これを...
Java Java | Java 詳細・モダン文法：設計・実務視点 – バージョンアップ対応
バージョンアップ対応を一言でいうとJava のバージョンアップ対応は、「今ちゃんと動いているシステムを壊さずに、新しい Java（JDK/JRE）に乗り換えるための一連の作業」です。単に「JDK を入...
Java Java | Java 詳細・モダン文法：設計・実務視点 – 非推奨 API の扱い
「非推奨 API」とは何か非推奨 API（deprecated API）は、「今はまだ使えるけれど、将来は消えるかもしれない／使ってほしくない」と宣言された API のことです。Java では @De...
Java Java | Java 詳細・モダン文法：設計・実務視点 – レガシーコード対応
レガシーコード対応を一言でいうとレガシーコード対応は、「よく分からないけど本番で動いている古いコード」を、壊さずに理解し、少しずつ安全にマシな状態へ近づけていく作業です。「全部書き直したい」という気持...
Java Java | Java 詳細・モダン文法：設計・実務視点 – 古い Java との互換性
「古い Java との互換性」とは何を指しているか「古い Java との互換性」というとき、実は複数のレイヤーの話が混ざっています。コンパイルしたクラスファイルが、どのバージョンの JVM で動くかと...
Java Java | Java 詳細・モダン文法：設計・実務視点 – モダン Java の書き方
「モダン Java の書き方」とは何かここでいう「モダン Java」は、Java 8 以降で手に入った機能や考え方を前提にした書き方のことだと思ってください。昔ながらの「for 文だらけ・null だ...
Java Java | Java 詳細・モダン文法：設計・実務視点 – 可読性とパフォーマンスのバランス
「速いコード」より「分かるコード」が先まず大前提として、実務では「とにかく速いコード」より「読んで分かるコード」の方が価値が高いです。なぜかというと、ほとんどのコードは「読む時間＞書く時間＞実行時間」...
Java Java | Java 詳細・モダン文法：設計・実務視点 – defensive programming
defensive programming を一言でいうとdefensive programming（防御的プログラミング）は、「相手（呼び出し側や外部システム）が“ちゃんとしている”と期待しすぎない...
Java Java | Java 詳細・モダン文法：設計・実務視点 – イミュータブル設計
イミュータブル設計を一言でいうとイミュータブル（immutable）は、「一度作ったら中身が変わらないオブジェクト」のことです。Java で一番有名なのは String です。String は rep...
JavaScript JavaScript | 非同期処理：Promise 応用 – Promise の落とし穴
まず「Promise の落とし穴」をざっくり整理するPromise 自体は仕組みとしてはそんなに難しくないのに、実際に書き始めると「なんか思った通りに動かない」「エラーが消える」「順番がおかしい」みた...
JavaScript JavaScript | 非同期処理：Promise 応用 – 非同期関数の再利用
「非同期関数の再利用」を一言でいうと非同期関数の再利用は、「一度作った Promise ベースの処理を、“場面だけ変えて何度も使い回せる形” に設計すること」です。言い換えると、同じような API 呼...
JavaScript JavaScript | 非同期処理：Promise 応用 – Promise のラップ
まず「Promise のラップ」を一言でいうとPromise の「ラップ」とは、「既存の処理（コールバック形式や Promise など）を “Promise を返す関数” という形に包み直して、扱いや...
JavaScript JavaScript | 非同期処理：Promise 応用 – 条件付き非同期処理
「条件付き非同期処理」って何かをまずイメージするPromise を使っていると、だんだんこういう場面が出てきます。「A の結果しだいで、B を呼ぶか呼ばないか決めたい」「ログイン済みなら API を叩...
JavaScript JavaScript | 非同期処理：Promise 応用 – 逐次処理の書き方
まず「逐次処理」とは何かをはっきりさせるPromise で言う「逐次処理（ちくじ処理）」は、「非同期処理を A → B → C… のように“順番に”実行する書き方」 のことです。具体的には、A が終わ...
JavaScript JavaScript | 非同期処理：Promise 応用 – 並列処理の考え方
まず「並列処理」をざっくりイメージでつかむJavaScript の Promise でいう「並列処理」は、「待ち時間がある処理を “同時にスタート” させて、全部終わる（またはどれかが終わる）のを待つ...
JavaScript JavaScript | 非同期処理：Promise 応用 – Promise.any
Promise.any を一言でいうとPromise.any は、「複数の Promise のうち、“最初に成功したもの 1 つ” だけの結果を採用する関数」 です。race が「一番早く 成功でも失...
JavaScript JavaScript | 非同期処理：Promise 応用 – Promise.race
Promise.race を一言でいうとPromise.race は、「複数の Promise のうち、“一番早く決着したやつだけ” の結果を採用する関数」 です。race（レース）という名前の通り、...
JavaScript JavaScript | 非同期処理：Promise 応用 – Promise.allSettled
Promise.allSettled を一言でいうとPromise.allSettled は、「複数の Promise が “成功しても失敗しても、とにかく全部終わるまで待ち、結果をぜんぶレポートして...
JavaScript JavaScript | 非同期処理：Promise 応用 – Promise.all
Promise.all を一言でいうとPromise.all は、「複数の Promise を“同時に走らせて”、全部そろったら結果をまとめて受け取るための関数」です。たとえば、ユーザー情報を取得する...
JavaScript JavaScript | 非同期処理：Promise 基礎 － エラー伝播
まず「エラー伝播」を一言でいうとPromise のエラー伝播は、「どこかの then で失敗しても、その“失敗情報”がチェーンを下へ流れていき、最後の catch まで届く仕組み」のことです。コールバ...
JavaScript JavaScript | 非同期処理：Promise 基礎 – 値の受け渡し
まず「値の受け渡し」を一言でいうとPromise の「値の受け渡し」は、「前の then（または resolve/reject）で決まった値が、次の then / catch にバトンのように渡ってい...
JavaScript JavaScript | 非同期処理：Promise 基礎 – チェーン処理
まず「チェーン処理」を一言でいうとPromise のチェーン処理は、「非同期のステップを、then を使って“上から順番に”つなげていく書き方」 です。コールバック地獄だと、A の中で B を呼んでB...
JavaScript JavaScript | 非同期処理：Promise 基礎 – finally の役割
まず finally を一言でいうとfinally は、「Promise が成功しても失敗しても“どっちにしても最後に必ず実行したい処理”を書く場所」です。例えば、ローディング表示を消したいモーダルを...
JavaScript JavaScript | 非同期処理：Promise 基礎 – catch の基本
まず catch を一言でいうとcatch は、「Promise で起きたエラー（失敗）を、最後にまとめて受け止める場所」です。then が「成功したときの続きを書く場所」だとしたら、catch は ...
JavaScript JavaScript | 非同期処理：Promise 基礎 – then の基本
まず then を一言でいうとthen は、「Promise が“成功したあとにやりたい処理”を登録するための関数」です。Promise は「そのうち結果が入る箱」でしたね。then はその箱に対して...
JavaScript JavaScript | 非同期処理：Promise 基礎 – reject の役割
まず「reject」のイメージを一言でreject は、「この Promise の非同期処理は“失敗”で終わったよ、と確定させるスイッチ」です。そして同時に、「なぜ失敗したのか（エラー情報）はこれだよ...
JavaScript JavaScript | 非同期処理：Promise 基礎 – resolve の役割
まず「resolve」のイメージを一言でresolve は、「この Promise の非同期処理は“成功”で終わったよ、と確定させるスイッチ」です。そして同時に、「成功した結果はこれだよ」と、Prom...
JavaScript JavaScript | 非同期処理：Promise 基礎 – Promise の状態（pending / fulfilled / rejected）
Promise の状態を一言でイメージするPromise は「そのうち結果が入る箱」 で、その箱には常にどれか 1 つの「状態」がくっついています。pending（保留中）fulfilled（成功）r...
JavaScript JavaScript | 非同期処理：Promise 基礎 – Promise とは何か
まず Promise を一言でイメージするPromise は、「まだ終わっていない非同期処理の“結果がそのうち入る箱”」だと思ってください。今は結果が分からないけど、そのうち 成功するかもしれないもし...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – escape analysis
escape analysis を一言でいうとescape analysis（エスケープ解析）は、JIT コンパイラが「このオブジェクトはメソッドの外に“逃げる”か？」「このオブジェクトはスレッドの外...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – String プール
String プールを一言でいうとString プールは、「同じ内容の文字列を、JVM の中でできるだけ 1 個だけにまとめて共有する仕組み」です。Java の String は不変（immutabl...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – 不要なオブジェクト生成
「不要なオブジェクト生成」がなぜパフォーマンス問題になるのかJava では new しても GC が片付けてくれるので、「とりあえず new しとけばいいや」となりがちです。でも、オブジェクトを作るた...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – パフォーマンス測定
「なんとなく速そう」ではなく「数字で語る」がパフォーマンス測定パフォーマンス測定の一番大事なポイントは、「体感」や「勘」ではなく、数字で語ることです。「この実装の方が速い気がする」ではなく、「この処理...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – Stop The World
Stop The World を一言でいうとStop The World（STW）は、「JVM が何か重要な作業をするために、アプリケーションのスレッドを一時的に全部止めること」です。特に GC（ガー...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – GC の基本
GC を一言でいうと「いらなくなったオブジェクトの自動掃除屋」GC（Garbage Collection）は、「もう使われていないオブジェクトを、自動で見つけて捨ててくれる仕組み」です。C や C++...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – ヒープ / スタック
ヒープとスタックを「机」と「倉庫」でイメージするまずはイメージからいきましょう。スタックは「今やっている作業のための机」。ヒープは「作ったモノを置いておく大きな倉庫」。机（スタック）の上には、今呼び出...
Java Java | Java 詳細・モダン文法：JVM・パフォーマンス – JVM メモリ構造
JVM メモリ構造をざっくり一枚の絵にするまずイメージからいきます。JVM のメモリは、大きく言うと次のような「部屋」に分かれています。ヒープ（Heap）：new したオブジェクトが住む場所スタック（...
JavaScript JavaScript | 非同期処理：コールバック – Promise が生まれた背景
なぜ Promise なんてものが出てきたのか（ざっくり全体像）Promise は、「非同期処理をコールバックだけで頑張った結果、みんながしんどくなったので生まれた“救急アイテム” です。特に、次のよ...
JavaScript JavaScript | 非同期処理：コールバック – 可読性の低下
「コールバックで可読性が落ちる」という話の本質コールバックは、非同期処理には欠かせない仕組みです。ただし、使い方次第でコードの「可読性（読みやすさ）」を一気に悪くしてしまう ことがあります。特に問題に...
JavaScript JavaScript | 非同期処理：コールバック – エラーハンドリングの問題
コールバックとエラーハンドリングの関係（まず全体像）コールバックを使った非同期処理では、「エラーをどう扱うか」 が一気に難しくなります。同期処理なら、try { const result = doSo...
JavaScript JavaScript | 非同期処理：コールバック – コールバック地獄
コールバック地獄とは何か（まずイメージ）コールバック地獄（callback hell）は、「非同期処理をコールバックだけでつなぎまくった結果、コードが右に右にネストしまくって、読めない・直せない状態」...
JavaScript JavaScript | 非同期処理：コールバック – ネストしたコールバック
ネストしたコールバックとは何か（まずイメージ）ネストしたコールバックというのは、「コールバックの中で、さらに別の非同期処理を呼び、その中でまたコールバックを書き…と階段状に深くなっていく書き方」 のこ...
JavaScript JavaScript | 非同期処理：コールバック – 同期コールバックとの違い
いちばん大事な違いのイメージまず、ざっくりこう覚えてください。同期コールバック→ 「その場で、すぐに呼ばれるコールバック」非同期コールバック→ 「あとで、別のタイミングで呼ばれるコールバック」どちらも...
JavaScript JavaScript | 非同期処理：コールバック – 非同期コールバック
まず「非同期コールバック」を一言でイメージする非同期コールバックは、「“今すぐ”ではなく、“あとで”呼び出してもらうために登録しておく関数」のことです。普通のコールバックも「あとで呼ばれる関数」ですが...
JavaScript JavaScript | 非同期処理：コールバック – setInterval の仕組み
setInterval を一言でいうと何かsetInterval は「この処理を◯ミリ秒ごとにくり返し実行してね」とブラウザ（または Node）に頼む関数です。setTimeout が「1回だけ、あと...
JavaScript JavaScript | 非同期処理：コールバック – setTimeout の仕組み
まず setTimeout を一言でイメージするsetTimeout は、「この処理を◯ミリ秒“後に”実行してね」とブラウザ（または Node）にお願いする関数です。ポイントはここです。setTime...
JavaScript JavaScript | 非同期処理：コールバック – コールバック関数とは
コールバック関数のイメージ（まず感覚から）コールバック関数は、「あとで呼んでね」と他の関数に渡しておく関数 です。自分で直接 myFunc() と呼ぶのではなく、「この処理が終わったときに、この関数を...
Java Java | Java 詳細・モダン文法：並行・非同期 – 非同期例外処理
まず「非同期の例外」がなぜややこしいのか同期コードなら、try-catch で囲めばだいたい済みます。try { int x = doSomething(); // ここで例外が出たら catch に...
Java Java | Java 詳細・モダン文法：並行・非同期 – allOf / anyOf
allOf / anyOf を一言でいうとCompletableFuture.allOf と CompletableFuture.anyOf は、「複数の非同期処理をまとめて扱うための“ハブ”」です。...
Java Java | Java 詳細・モダン文法：並行・非同期 – thenApply / thenCompose
まず「何をつなぎたいのか」をはっきりさせるCompletableFuture を使うとき、thenApply と thenCompose の違いで必ずつまずきます。でも本質はシンプルで、こうです。「た...
Java Java | Java 詳細・モダン文法：並行・非同期 – CompletableFuture 組み合わせ
CompletableFuture の「組み合わせ」をざっくり俯瞰するCompletableFuture の本質は「非同期処理を“値”として扱い、それらをつなぎ合わせること」です。単発で supply...
Java Java | Java 詳細・モダン文法：並行・非同期 – ThreadPool 設計
ThreadPool を一言でいうと「スレッドの再利用工場」ThreadPool（スレッドプール）は、「あらかじめ何本かスレッドを作っておき、タスクをそこに流し込んで再利用する仕組み」です。毎回 ne...
Java Java | Java 詳細・モダン文法：並行・非同期 – ExecutorService 詳細
ExecutorService を一言でいうとExecutorService は、「スレッドを自分で new せずに、“仕事（タスク）だけ渡して実行してもらう”ための仕組み」です。new Thread...
Java Java | Java 詳細・モダン文法：並行・非同期 – happens-before
happens-before を一言でいうとhappens-before は、「この処理が終わってから、あの処理が“必ずその結果を見える形で”起きる」という“時間とメモリの順序”を表す言葉です。もっと...
Java Java | Java 詳細・モダン文法：並行・非同期 – volatile の役割
volatile を一言でいうとvolatile は、「この変数の“最新の値”を、すべてのスレッドから必ず見えるようにする」ためのキーワードです。もっと砕くと、「CPU やスレッドごとのキャッシュにこ...
Java Java | Java 詳細・モダン文法：並行・非同期 – synchronized の仕組み
synchronized は何を「約束」してくれるのかsynchronized は一言でいうと、「同じ場所を同時に触ろうとする複数スレッドを、順番待ちにさせる仕組み」です。もっと具体的に言うと、あるオ...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – 非同期が必要な理由
まず「なぜ非同期なんて面倒なものがあるのか」いきなり本音から言うと、多くの人はこう感じます。「同期処理だけで書けたらどれだけ楽か」「非同期って急に難しくなるし、できれば避けたい」実は JavaScri...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – 実行順序の全体像
まず「実行順序の全体像」を一言でまとめるJavaScript の実行順序は、ざっくり言うとこうなります。同期処理（ふつうのコード）を上から順番に実行する同期が一段落してコールスタックが空いたら、Pro...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – イベントループ
まずイベントループを一言でイメージするイベントループは、「JavaScript に“次にやるべき仕事”をひたすら渡し続ける司会進行役」です。JavaScript はシングルスレッドで、同時に動ける処理...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – マイクロタスクキュー
マイクロタスクキューとは何か（まずざっくりイメージ）マイクロタスクキューは、「とても優先度の高い“あとで実行する処理”が並ぶ、特別レーンの待ち行列」 です。前回の「タスクキュー」は、setTimeou...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – タスクキュー
まずタスクキューを一言でイメージするタスクキューは、「あとで実行する処理（コールバック）を順番に並べておく待ち行列」 です。JavaScript はシングルスレッドなので、「今」実行できるのは 1 つ...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – Web API の役割
全体像：Web API は「JavaScript の外にいる助っ人」まず前提から整理します。ブラウザの中で JavaScript が動くとき、JavaScript エンジン（言語そのものを実行する脳み...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – コールスタック
コールスタックとは何か（まずイメージから）コールスタックは、「今、どの関数を実行中で、その関数からどの関数を呼び出しているか」を記録している“関数呼び出しの積み重ねメモ” です。JavaScript ...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – JavaScript がシングルスレッドである理由
まず「シングルスレッド」のイメージからJavaScript が「シングルスレッド」というのは、「同時に実行できるのは、基本的に1つのことだけ」 という意味です。console.log() を実行してい...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – ブロッキングとは何か
「ブロッキング」とは何か（まずイメージから）「ブロッキング」は、ある処理が終わるまで、そこから先の処理が一切進めなくなる状態のことです。JavaScript だと「一番の働き手（メインスレッド）が、そ...
JavaScript JavaScript | 非同期処理：非同期の基礎概念 – 同期処理と非同期処理の違い
同期処理と非同期処理の一番大事なイメージまず、抽象的な言葉を捨てて、イメージから掴みにいきます。同期処理は、「一列に並んで順番待ちする世界」 です。前の人の処理が終わるまで、次の人は絶対に動けません。...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – クラスの初期化順序
ゴール：「クラスが new されたとき“何がどの順番で動くか”をイメージできるようになる」クラス設計がうまくいくかどうかは、「初期化の順番」をちゃんと理解しているかにかなり左右されます。フィールド初期...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – staticメソッド
ゴール：「これは“インスタンスのメソッド”か“クラスのメソッド”か」を自分で選べるようになるstatic メソッドは一言でいうと、「new した“個体”ではなく、“クラスそのもの”にぶら下がる関数」で...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – staticプロパティ
ゴール：「static は“インスタンスじゃなくてクラスに属するもの”だと腹で理解する」static を一言でいうと、「new した“個体”ではなく、“クラスそのもの”にぶら下がるもの」です。ここがふ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – getter / setter の型
ゴール：「getter / setter の“型”を見て、どう使うかイメージできるようになる」getter / setter は、クラスのプロパティに「振る舞い」をくっつける仕組みです。でも、ただ「便...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – readonlyプロパティの活用
ゴール：「この値は“変わらない”」を型で約束できるようになるreadonly プロパティは、クラス設計でめちゃくちゃコスパのいい武器です。一言でいうと、「この値は、作ったあとに書き換えちゃダメ」をコン...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – public / private / protected
ゴール：「どこまで外に見せるか」を自分でコントロールできるようになるpublic / private / protected は、「クラスの中身をどこまで外に見せるか」を決めるスイッチです。ここをなん...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – メソッドの型指定
ゴール：「メソッドの型だけ見て“何をするか”がだいたい分かるように書ける」クラスのメソッドって、書こうと思えば何でも書けます。だからこそ「型をどう付けるか」で、読みやすさと安全性が大きく変わります。こ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – コンストラクタ引数と型
ゴール：「コンストラクタの引数に“どんな型をつけるか”を意識して設計できるようになることクラスを書くとき、コンストラクタは「インスタンスをどう初期化するか」を決める、とても重要な場所です。ここでの型設...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – プロパティの型設計
ゴール：「クラスのプロパティに“どんな型をつけるか”を意識して設計できるようになること」クラスを書くとき、「プロパティ名」だけでなく「プロパティの型」をどう設計するかで、そのクラスの使いやすさ・安全さ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：クラス設計 – クラスの基本構文復習
クラスってそもそも何者？「設計図」と「new」の関係から整理するまずイメージからいきます。クラスはざっくり言うと、「オブジェクトを量産するための設計図」です。設計図（class）を書いておいて、new...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 実務での関数分割ルール
ゴール：「どこまでを1つの関数にして、どこから分けるか」を自分の基準で判断できるようになる実務で一番モヤっとしやすいのがここです。「この関数、長い気はするけど、どこで分ければいいの？」「分けたら分けた...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 可読性の高い関数型設計
ゴール：「関数の“型”を見ただけで、何をするかだいたい分かる」状態を目指す可読性の高い関数型設計って、難しい言い方をしているけれど、やりたいことはシンプルです。その関数の「型」だけを見たときに、何を受...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 関数設計での型肥大対策
ゴール：「型がデカくなってきた…」と感じたときに、落ち着いて“細く・分けて・名前をつける”発想を持てるようにするTypeScript を真面目に書けば書くほど、そのうち必ずこうなります。「型、でかすぎ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 非同期関数への移行準備
ゴール：「あとで async にしたくなっても困らない関数設計」を身につけるいきなり全部 async/await にする必要はありません。むしろ大事なのは、「今は同期処理だけど、いつでも非同期（asy...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – assert関数の型定義
ゴール：「assert 関数の型」を“道具として設計できる”ようになるまずイメージからいきます。assert 関数は一言でいうと、「この条件が成り立たないなら、ここで止まってくれ」「この時点で、値はも...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – ユーザー定義型ガード
ゴール：「ユーザー定義型ガード」を“自分で設計して使いこなせる”ようになるここで目指したいのは、「ユーザー定義型ガードって何？」から一歩進んで、「いつ・どう設計するとコードが楽になるか」までイメージで...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 型ガード関数の設計
まず「型ガードって何を守ってくれるのか」をイメージする型ガード関数は一言でいうと、「この値は〇〇型だよ、と TypeScript に“証拠付きで教える”ための関数」です。普通の if だと、TypeS...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 条件分岐による戻り値型変化
ゴール：「if や switch で分岐した結果、戻り値の型がどう変わるか」を意識して設計できるようになる関数の戻り値って、「常に同じ型」だけじゃなくて、条件によって“中身の型”が変わることがあります...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – エラーを投げる関数の型
まず「エラーを投げる関数」を2種類に分けて考えるいきなり型の話に行く前に、役割で分けます。エラーを投げる関数には、大きく言って次の2パターンがあります。1つ目は、「必ずエラーを投げて、絶対に呼び出し元...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – neverを返す関数設計
ゴール：「never を返す関数」が“設計上どういう意味を持つか”を理解するnever は、初心者から見ると一番「意味不明な型」に見えます。でも、関数設計の文脈では、「ここには絶対に到達しない」「この...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – void戻り値の設計判断
ゴール：「とりあえず void」から卒業するまず一番大事なことを先に言います。多くの初心者は、「戻り値を使わないから、とりあえず void」と書きがちです。でも、本当にそうしていい場面と、「void ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – bind / call / apply と型
ゴール：bind / call / apply を「型の目」で理解するここで目指したいのは、「bind / call / apply が“何をするメソッドか”」だけでなく、「TypeScript 的に...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – thisパラメータの明示
「thisパラメータを明示する」とは何をしているのかまず言葉の整理からいきます。TypeScript でいう「thisパラメータ」とは、関数の一番最初の引数の位置にだけ書ける、特別な仮引数のことです。...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – this を使う関数の型指定
まず「this を型として扱う」という発想からJavaScript ではおなじみの this ですが、TypeScript では 「this そのものにも型を付けられる」 というのがポイントです。fu...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 関数を返す関数の型
「関数を返す関数」って、まず何者？いきなり型の話に行く前に、イメージを固めましょう。function createAdder(a: number) { return (b: number) => a ...
Python Python | DB・SQL：DB 設計
DB 設計って何？まずはゴールのイメージからDB 設計は、「アプリで扱う情報を、テーブル・カラム・関係に分解して、矛盾なく・拡張しやすく・速く扱える形にする作業」です。言い換えると、「現実の世界（ユー...
Python Python | DB・SQL：接続プール
接続プールって何？まずはイメージから接続プール（コネクションプール）は、「データベースへの接続を、使い回すための“待機列（プール）”」です。DB への接続は、実はかなり重い処理です。毎回「接続を開く ...
Python Python | DB・SQL：N+1 問題
N+1 問題って何？まずはざっくりイメージN+1 問題は、「本当は少ない回数のクエリで済むのに、気づかないうちに大量のクエリを投げてしまっている状態」のことです。特に多いのが、1 回目のクエリで「親デ...
Python Python | DB・SQL：パフォーマンス
「パフォーマンス」って何？まずは感覚からDB・SQL の「パフォーマンス」は、ざっくり言うと「どれくらい速く・無駄なく・安定して動くか」です。同じ結果を出すクエリでも、1 秒で終わる書き方1 分かかる...
Python Python | DB・SQL：バルク処理
バルク処理って何？まずはイメージからバルク処理（バルク INSERT / バルク UPDATE など）は、「大量のデータをまとめて一気に処理する」やり方のことです。1 行ずつチマチマ INSERT す...
Python Python | DB・SQL：migration
migration って何？まずはイメージからmigration（マイグレーション）は、「データベースの“形”（テーブルやカラムの構造）を、コードでバージョン管理して、少しずつ進化させていく仕組み」で...
Python Python | DB・SQL：relationship
relationship って何？まずはイメージからSQLAlchemy の relationship は、「テーブル同士のつながり（リレーション）を、Python のオブジェクト同士のつながりとして...
Python Python | DB・SQL：join
join って何？まずはイメージからJOIN は、「別々のテーブルに分かれている情報を、くっつけて一つの表として見る」ための仕組みです。現実のアプリでは、ユーザー情報と注文情報、商品情報とカテゴリ情報...
Python Python | DB・SQL：CRUD
CRUD って何？まずは全体像からCRUD（クラッド）は、データベース操作の基本 4 セットの頭文字です。Create（作る）、Read（読む）、Update（更新する）、Delete（削除する）。ア...
Python Python | DB・SQL：セッション
セッションって何？まずはざっくりイメージ「セッション」は、データベースとやり取りするときの「ひとまとまりの会話」のようなものです。Python から見ると、あるタイミングで DB との“窓口”を開くそ...
Python Python | DB・SQL：ORM モデル
ORM モデルって何？まずはイメージから「ORM モデル」は、データベースのテーブルを「Python のクラスとして表現したもの」です。ORM は Object Relational Mapping（...
Python Python | DB・SQL：SQLAlchemy 基本
SQLAlchemy って何者？ざっくりイメージSQLAlchemy は、「Python からデータベースを触るための超定番ライブラリ」です。一言でいうと、SQL を直接書く代わりに、Python の...
Python Python | DB・SQL：SQLite
SQLite ってそもそも何者？SQLite（エスキューライト）は、「組み込み型」のリレーショナルデータベースです。PostgreSQL や MySQL みたいに「サーバーを立てて接続するタイプ」では...
Python Python | DB・SQL：PostgreSQL
PostgreSQL ってそもそも何者？PostgreSQL（ポストグレスキューエル）は、オープンソースのリレーショナルデータベース管理システム（RDBMS）です。「無料で使えるのに、企業の本番システ...
Python Python | DB・SQL：ACID
概要（ACID は「ちゃんとしたトランザクション」の 4 つの約束）ACID は、データベースのトランザクションが「ちゃんとしている」ことを表す 4 つの性質の頭文字です。Atomicity（原子性）...
Python Python | DB・SQL：トランザクション
概要（トランザクションは「一連の処理を、成功か失敗かで丸ごと扱う仕組み」）トランザクションは、データベースに対して行う「一連の処理」を、「全部まとめて成功」か「全部なかったことにする（失敗）」かのどち...
Python Python | DB・SQL：インデックス
概要（インデックスは「データベースの辞書の“索引”」）インデックス（index）は、データベースにとっての「本の索引」です。本の後ろにある五十音順の索引があると、目的の用語のページを一瞬で開けますよね...
Python Python | DB・SQL：サブクエリ
概要（サブクエリ＝「SQL の中にもう一個 SQL を入れる」）サブクエリは、「SQL 文の中に、さらに別の SQL 文（小さな SELECT）を入れるテクニック」です。イメージとしては、一回クエリを...
Python Python | DB・SQL：JOIN
概要（JOIN は「バラバラの表をつないで、1 枚の結果にする」）JOIN は、SQL の中でも「一段レベルが上がった感じ」がするところですが、本質はとてもシンプルで、「関連する 2 つ以上のテーブル...
Python Python | DB・SQL：HAVING
概要（HAVING は「集計結果に対する WHERE」だと思うと分かりやすい）HAVING は、SQL の中でも「ちょっとだけ上級者向け」に見える句ですが、本質はシンプルで、「GROUP BY でグル...
Python Python | DB・SQL：GROUP BY
概要（GROUP BY は「グループごとにまとめて計算する」ためのスイッチ）GROUP BY は、SQL で「グループごとに集計する」ための仕組みです。「ユーザーごとの合計金額」「日付ごとの件数」「科...
Python Python | DB・SQL：ORDER
概要（ORDER BY は「結果の並び順を決めるスイッチ」）SQL の ORDER BY 句は、SELECT で取り出した結果を「どんな順番で並べるか」を指定するための仕組みです。「年齢の若い順に」「...
Python Python | DB・SQL：WHERE
概要（WHERE は「どの行だけを相手にするか」を決めるフィルター）SQL の WHERE 句は、テーブルの中から「どの行だけを対象にするか」を決めるフィルターです。SELECT だけでなく、UPDA...
Python Python | DB・SQL：SELECT
概要（SELECT は「欲しいデータだけを取り出すコマンド」）SQL の SELECT 文は、データベースから「欲しいデータだけ」を取り出すためのコマンドです。Excel の表から「この列だけ見たい」...
Python Python | DB・SQL：SQL 基本
概要（SQL は「データベースに話しかける言語」）SQL（エスキューエル）は、データベースに対して「これして」「あれして」と命令を出すための言語です。Excel の表をもっと厳密にしたものが「テーブル...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 関数を引数に取る設計
「関数を引数に取る」とは、責任を“相手に渡す”設計まずイメージからいきます。function doTwice(fn: () => void) { fn(); fn();}doTwice(() => {...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 関数型interfaceの書き方
前提：関数にも「interface で形を決める」という発想があるまず押さえたいのは、「関数の型は type だけじゃなく、interface でも書ける」ということです。type FnByType ...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 関数型エイリアス設計
まず「関数型エイリアス」とは何かをはっきりさせる関数型エイリアスは、かんたんに言うと「よく使う関数の“形”に名前をつけること」です。type StringToNumber = (value: stri...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – map / filter / reduce 用関数型
ゴール：map / filter / reduce の「関数型」を言葉で説明できるようになるまず目標からはっきりさせます。map / filter / reduce は、「配列に対して“どう変換するか...
TypeScript TypeScript | 関数・クラス・ジェネリクス：関数設計の深化 – 高階関数の型付け
まず「高階関数」をちゃんと定義しておく高階関数（higher-order function）は、ざっくり言うと「関数を受け取る」か「関数を返す」か、あるいはその両方をする関数のことです。functio...
Python Python | Web フレームワーク：バックエンド設計
概要（バックエンド設計＝「見えないところの“筋肉と血管”を設計すること」）バックエンド設計は、「画面に見えないところで、アプリをちゃんと動かすための仕組みをどう組み立てるか」を考える作業です。どんなデ...
Python Python | Web フレームワーク：API 実践
概要（API 実践＝「画面なしでデータをやり取りする Web アプリ」）API 実践は、「ブラウザに HTML を返す」のではなく、「プログラム同士がデータをやり取りする窓口」を作る練習です。Djan...
Python Python | Web フレームワーク：Web アプリ実践
概要（「Web アプリ実践」は“全部をつなげて動かす”フェーズ）ここまでで、Django のモデル・ビュー・URL・テンプレート・認証・セッション・設定・分割構造など、部品ごとの話をかなり見てきました...
Python Python | Web フレームワーク：Django の分割構造
概要（Django の分割構造＝「大きな家を部屋ごとに区切る設計」）Django の「分割構造」は、一言でいうと「プロジェクト全体を、役割ごと・機能ごとにきれいに分ける仕組み」です。一番大きな単位が「...
Python Python | Web フレームワーク：Django 設定
概要（Django 設定＝「プロジェクト全体のルールブック」）Django の設定（settings.py）は、「このプロジェクトは、どんなルールで動くのか」を一箇所にまとめたファイルです。どのアプリ...
Python Python | Web フレームワーク：Django セッション
概要（Django セッション＝「ブラウザごとの“一時的な記憶領域”」）Django のセッションは、「このブラウザは、前回どんな状態だったか」をサーバー側に覚えておくための仕組みです。ログイン状態カ...
Python Python | Web フレームワーク：Django 認証
概要（Django 認証＝「ユーザーを識別して、ログイン状態を管理する仕組み」）Django 認証は、「このリクエストを送ってきたのは誰か」「その人はログイン済みか」「その人にこの操作をさせてよいか」...
Python Python | Web フレームワーク：Django migration
概要（Django migration＝「モデルの変更履歴を DB に安全に反映する仕組み」）Django の migration（マイグレーション）は、一言でいうと、「models.py の変更を、...
Python Python | Web フレームワーク：Django ORM
概要（Django ORM＝「SQL を書かずに DB を触るための翻訳レイヤー」）Django ORM は、「データベース（SQL の世界）」と「Python オブジェクト（クラスとインスタンスの世...
Python Python | Web フレームワーク：URLconf
概要（URLconf＝「URL とビューを結びつける交通整理係」）Django の URLconf（URL configuration）は、「どの URL にアクセスされたときに、どのビューを呼ぶか」...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – マルチ catch
マルチ catch を一言でいうとマルチ catch は、「複数の例外型を、同じ 1 つの catch ブロックでまとめて処理できる構文」です。catch (IOException | SQLExce...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – ntry-with-resources 拡張
まず「元祖」try-with-resources をおさらいするtry-with-resources は、「使い終わったら必ず close() しなきゃいけないリソース（ファイル、ソケット、DB 接続...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – null 許容と switch
なぜ「null と switch」をちゃんと考えないといけないのかswitch は「値に応じて分岐する」構文ですが、その値が null になりうるかどうかを意識していないと、実行時にいきなり Null...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – instanceof の進化
instanceof の「進化」をざっくり俯瞰するinstanceof は、もともと「あるオブジェクトが、ある型のインスタンスかどうかを調べるための演算子」としてスタートしました。昔は「型チェック」と...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – パターンマッチング（instanceof）
パターンマッチング付き instanceof を一言でいうと「instanceof で型を調べたあと、すぐ下でキャストして変数に代入する」――この“二度書き”をまとめて一発で書けるようにした構文が、パ...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – sealed class
sealed class を一言でいうとsealed クラスは「このクラスを継承してよい“サブクラスの種類”を、あらかじめ限定する仕組み」です。継承を完全に禁止する final と違って、「継承は許す...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – レコード（record）
record を一言でいうとrecord は「フィールドを持つだけの“データ用クラス”を、最小限のコードで定義するための仕組み」です。equals / hashCode / toString / コン...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – テキストブロック
テキストブロックを一言でいうとテキストブロックは、"""（ダブルクォート3つ）で囲んで「複数行の文字列を、そのままの見た目で書ける」新しい文字列リテラルです（Java 15 以降で正式導入）。今までの...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – yield
yield を一言でいうとyield は、switch「式」の中で「この case ブロックから“この値を返す”」とコンパイラに伝えるためのキーワードです。return が「メソッドから値を返す」のに...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – switch 式（Java 14+）
switch 式とは何か（Java 14 以降の新しい switch）Java 14 以降では、switch が「文(statement)」だけでなく「式(expression)」としても使えるように...
Java Java | Java 詳細・モダン文法：言語仕様詳細 – var（ローカル変数型推論）
var を一言でいうとvar は「型を書かなくても、右辺からコンパイラが型を推論してくれるローカル変数宣言」のためのキーワードです。「型がなくなる」のではなく、「型を書く手間を省く」だけで、コンパイル...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – ES 仕様の更新追跡方法
何を追えばいいのか（ゴールのイメージ）まず、「ES 仕様の更新を追う」と聞くと、毎年の ECMAScript 版（ES2020, ES2021…）その中に入る新機能（Optional chaining...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Intl API
Intl API とは何か（まずイメージから）Intl（Internationalization）は、「言語や国ごとのルールに合わせて、数値・通貨・日付・文字列などをキレイに表示するための標準 API...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Reflect
Reflect とは何か（まずイメージから）Reflect は ES6 で追加された、「オブジェクトに対する基本操作を、“関数の形”でまとめて持っている道具箱」 です。これまでバラバラに存在していたプ...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Proxy
Proxy とは何か（まずイメージから）Proxy は、「あるオブジェクトの前に立って、そのオブジェクトへの操作を横取り・監視・カスタマイズできる“番人”」のような仕組みです。普通はこうです。cons...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – for…of の内部
for...of の「見た目」と「中身」は別物だと思ってみるfor...of は、表面上はとてもシンプルです。const arr = [10, 20, 30];for (const value of ...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Generator
Generator とは何か（まずイメージから）Generator（ジェネレータ）は、「少しずつ値を返しながら、一時停止・再開できる特別な関数」 です。普通の関数は、一気に最後まで実行されて「結果はこ...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Iterator
Iterator とは何か（まずイメージから）Iterator（イテレータ）は、「次の値をください」「もう終わりです」を順番に教えてくれる“値の自動販売機”のような仕組み です。自販機にコインを入れる...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Symbol
Symbol とは何か（まずイメージから）Symbol は、ES6 で追加された 「絶対にかぶらない“名前札”のような値」 です。string や number と同じ「プリミティブ型」の一種ですが、...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Nullish coalescing
Nullish coalescing とは何か（まずイメージから）Nullish coalescing（ヌリッシュ・コアレスシング）は?? という演算子で書く、「値が null または undefin...
JavaScript JavaScript | ES6+ 文法：その他の ES6+ 機能 – Optional chaining
Optional chaining とは何か（まずイメージから）Optional chaining（オプショナルチェイニング）は?. という記号で書く、「存在しないかもしれないプロパティに安全にアクセ...
Java Java | Java 詳細・モダン文法：日付・時刻 API – 日付計算の注意点
日付計算が「思ったより難しい」理由日付計算は、一見「足し算・引き算だけ」に見えますが、実際には月末の長さの違い、うるう年、タイムゾーン、夏時間（DST）、日付の境界の扱いなど、落とし穴だらけです。ja...
Java Java | Java 詳細・モダン文法：日付・時刻 API – Clock
Clock を一言でいうとClock は「“今”をどう決めるかをカプセル化するためのオブジェクト」です。Instant.now() や LocalDateTime.now() が、裏側で「どの時計を使...
Java Java | Java 詳細・モダン文法：日付・時刻 API – Instant
Instant を一言でいうとInstant は「世界共通の“ある一瞬”を、UTC 基準で表したもの」です。人間が「2025年1月18日 10時（日本時間）」と考えるのに対して、Instant は「1...
Java Java | Java 詳細・モダン文法：日付・時刻 API – OffsetDateTime
OffsetDateTime を一言でいうとOffsetDateTime は「日付＋時刻 ＋ UTC からのズレ量（オフセット）」をセットで表すクラスです。ZonedDateTime が「タイムゾーン...
Java Java | Java 詳細・モダン文法：日付・時刻 API – TimeZone の扱い
まず「タイムゾーンって何者か」を整理するタイムゾーンは、ざっくり言うと「その場所の“ローカルな時刻”と、世界共通の時刻（UTC）をどう対応づけるかのルール」です。日本（Asia/Tokyo）は「UTC...
Java Java | Java 詳細・モダン文法：日付・時刻 API – 不変オブジェクトとしての日時
「不変な日時」ってどういうことかまず言葉からいきます。LocalDate や LocalDateTime、ZonedDateTime など java.time のクラスは「不変（immutable）」...
Java Java | Java 詳細・モダン文法：日付・時刻 API – DateTime API 設計思想
なぜ新しい DateTime API が必要だったのかまず一番大事な背景からいきます。Java 8 で導入された java.time（DateTime API）は、「古い日付 API（java.uti...
JavaScript JavaScript | ES6+ 文法：新データ構造 – 実務利用判断
まずゴールをはっきりさせる：何を判断したいのかES6 の「新データ構造」と言われると、Map / SetWeakMap / WeakSetが一気に出てきて、「全部使えたほうがいいのかな？」と身構えがち...
JavaScript JavaScript | ES6+ 文法：新データ構造 – GC と Weak 構造
まず「GC」とは何か（やさしくイメージから）JavaScript の世界では、「もう使われなくなったデータを、自動で片付けてくれる仕組み」 が動いています。これを GC（Garbage Collect...
JavaScript JavaScript | ES6+ 文法：新データ構造 – size プロパティ
size プロパティとは何か（まずイメージから）size プロパティは、「そのコレクションの中に、今いくつ要素が入っているか」を教えてくれる数字 です。ES6 の新しいデータ構造では、MapSetに ...
JavaScript JavaScript | ES6+ 文法：新データ構造 – 反復処理
ES6 の反復処理とは何か（まずイメージから）ES6 以降の「新データ構造」（Map, Set, WeakMap, WeakSet）には、「反復処理しやすいように統一された仕組み」 が用意されています...
JavaScript JavaScript | ES6+ 文法：新データ構造 – Set による重複排除
Set で重複排除とは何か（まずイメージから）Set は「同じ値を 2 回入れようとしても、1 回分しか持たないコレクション」でしたね。この「同じ値は 1 つだけ」という性質を利用すると、配列に同じ値...
JavaScript JavaScript | ES6+ 文法：新データ構造 – Map vs Object
まずざっくりイメージ：Map と Object は「役割」が違う同じように「キーと値」を扱えるので、最初は「Map でも Object でもできるじゃん。どっち使えばいいの？」と感じると思います。ざっ...
JavaScript JavaScript | ES6+ 文法：新データ構造 – WeakSet
WeakSet とは何か（まずイメージから）WeakSet は、「オブジェクトだけを入れられる、弱い参照を持つ Set」 です。普通の Set と似ていますが、決定的に違う点がいくつかあります。1つ目...
JavaScript JavaScript | ES6+ 文法：新データ構造 – WeakMap
WeakMap とは何か（まずイメージから）WeakMap は、「キーをオブジェクトに限定した、”弱い紐づけ” をするための特別な Map」 です。普通の Map と似ていますが、決定的に違うのはここ...
JavaScript JavaScript | ES6+ 文法：新データ構造 – Set
Set とは何か（まずイメージから）Set は、ES6 で追加された「重複を許さない値の集まり（コレクション）」 です。配列：同じ値を何回入れてもいいSet：同じ値は 1 回しか入らないというイメージ...
JavaScript JavaScript | ES6+ 文法：新データ構造 – Map
Map とは何か（まずイメージから）Map は、ES6 で追加された「キーと値のペアを柔軟に保存できる専用のコレクション」 です。似たものに「オブジェクト {}」がありますが、Map には大きな違いが...
Java Java | Java 詳細・モダン文法：Optional – フィールドに Optional を持たない理由
そもそも Optional は「フィールド用」に設計されていないまず大前提として押さえておきたいのは、Optional は「戻り値用のコンテナ」として設計されている、ということです。「値があるかもしれ...
Java Java | Java 詳細・モダン文法：Optional – Optional の誤用例
なぜ「Optional の誤用」を意識する必要があるのかOptional は「null を安全に扱うための道具」ですが、使い方を間違えると、むしろコードが読みにくくなったり、バグの温床になったりします...
Java Java | Java 詳細・モダン文法：Optional – Optional.orElseThrow
Optional.orElseThrow を一言でいうとOptional.orElseThrow は「中身があればその値を返し、なければ“ここで失敗だ”と明示的に例外を投げる」ためのメソッドです。「こ...
Java Java | Java 詳細・モダン文法：Optional – Optional.filter
Optional.filter を一言でいうとOptional.filter は「中身が“あるときだけ”条件をチェックし、条件を満たさなければ空にしてしまう」ためのメソッドです。Stream の fi...
Java Java | Java 詳細・モダン文法：Optional – Optional.flatMap
Optional.flatMap を一言でいうとOptional.flatMap は「中身が“あるときだけ”、Optional を返す関数を適用し、その二重になった Optional を平らにして返す...
Java Java | Java 詳細・モダン文法：Optional – Optional.map
Optional.map を一言でいうとOptional.map は「中身が“あるときだけ”変換し、なければ何もしないで空のまま返す」ためのメソッドです。null チェックしてからメソッドを呼ぶ、とい...
Java Java | Java 詳細・モダン文法：Optional – null 排除設計
「null 排除設計」を一言でいうと「null 排除設計」は、“アプリケーションの中を null が自由に歩き回らないようにする設計”です。完全に null をゼロにするのは現実的ではありませんが、「...
Java Java | Java 詳細・モダン文法：Optional – Optional 設計思想
Optional が生まれた一番大きな理由Optional が Java に入ってきた一番の理由は、「null による事故を減らしたい」これに尽きます。Java の世界では長いあいだ、「値がないこと」...