JavaScript
JavaScript | 1 日 90 分 × 7 日アプリ学習：ランダム表示アプリ（初級編）
2026-01
Excel VBA Excel VBA 逆引き集 | 実務テンプレ完全版（超再利用部品） – 重複検査ツール
ねらい：人の目では見落とす「重複」を、VBAで一網打尽にする重複検査は、地味だけど実務ではかなり重要な仕事です。顧客マスタの二重登録、案件IDの重複、メールアドレスの重複、請求書番号の重複…。どれも「...
Excel VBA Excel VBA 逆引き集 | 実務テンプレ完全版（超再利用部品） – 採番自動ツール
ねらい：番号ルールを「人の勘」から「VBAの型」に変える現場で一番モメやすいのが「番号」です。伝票番号案件番号申請番号問い合わせIDこれを人が手入力で振っていると、同じ番号を二重に使ってしまう飛び番・...
Excel VBA Excel VBA 逆引き集 | 実務テンプレ完全版（超再利用部品） – 監査ログツール
ねらい：Excelマクロの「誰が・いつ・何をしたか」を残す“監査ログ”の型を作るマクロが便利になればなるほど、あとからこういうことを聞かれる場面が増えます。誰がこのファイルをいつ更新したのか。このボタ...
Excel VBA Excel VBA 逆引き集 | 実務テンプレ完全版（超再利用部品） – エクセル方眼自動整形
ねらい：どんなシートでも一発で「方眼紙レイアウト」にそろえる「エクセル方眼」は好き嫌いが分かれますが、社内の帳票や申請書が全部エクセル方眼で作られている現場も多いですよね。問題は、毎回「列幅を 1.2...
JavaScript JavaScript | 1 日 90 分 × 7 日アプリ学習：ミニ総合アプリ（初級編）
1日目のゴールと今日やること1日目のテーマは「入力 → 一覧表示 → 削除 → 条件分岐までを一つのミニアプリでつなげる」ことです。今日やるのは、超シンプルだけど“アプリっぽさ”がちゃんとあるもの：テ...
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（オプショナルチェイニング）は?. という記号で書く、「存在しないかもしれないプロパティに安全にアクセ...
Next.js Next.jsで学ぶReact講座 | Reactの基本操作 – 入力した文字をそのまま画面にリアルタイム表示するフォーム
このテーマのゴールここで目指すのは、「入力欄に打ち込んだ文字が、そのままリアルタイムで画面に表示されるコンポーネント」を自分で作れるようになることです。これは一見シンプルですが、React でフォーム...
Next.js Next.jsで学ぶReact講座 | Reactの基本操作 – ボタンを押すと「表示／非表示」が切り替わるテキスト
このテーマのゴールここで身につけたいのは、「ボタンを押すとテキストが表示されたり消えたりする」コンポーネントを自分で作れるようになることです。この小さな動きの中に、React の重要ポイントがぎゅっと...
Next.js Next.jsで学ぶReact講座 | Reactの基本操作 – ボタンを押すと増えるカウンター
このテーマのゴールここでやりたいのは、「ボタンを押すと数字が増える」カウンターコンポーネントを通して、React の state とイベント処理の超基本を体で覚えることです。画面に数字が表示されていて...
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 | 1 日 90 分 × 7 日アプリ学習：フォーム送信シミュレーター（初級編）
1日目のゴールと今日やること1日目のテーマは「フォーム送信の仕組みを“JavaScript で自由にコントロールできるようになる”」ことです。フォーム送信シミュレーターは、「入力 → 確認画面 → 擬...
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 と似ていますが、決定的に違うのはここ...