Skip to content

Releases: yytypescript/book

2026-05-15 「using宣言」ページを新規追加、Node.js v26対応など

Choose a tag to compare

@suin suin released this 15 May 12:43
d1a4d3d

2026年5月15日の更新内容をお届けします。

✨ ハイライト

「using宣言」の解説ページを新規追加しました

「読んで学ぶTypeScript」リファレンスの「値・型・変数」カテゴリに、新ページ「using宣言」を追加しました。TypeScript 5.2から導入されたusing宣言とawait using宣言は、ファイルハンドルやデータベース接続などのリソースをスコープ脱出時に確実に解放するための機能ですが、これまで本書には体系的な解説がありませんでした。

新ページでは、リソースとリソースリークの基本から、Denoのファイル APIを使った手動クリーンアップとusing宣言の比較、DisposableSymbol.disposeawait usingAsyncDisposableSymbol.asyncDisposeまで丁寧に解説しています。さらに、C#のusing句やRustのDropトレイトといった他言語のRAIIパターンとの比較も交え、TypeScriptにおける明示的なリソース管理の位置づけが立体的にわかる構成にしています。(#1057 by @yo-goto

using宣言

チュートリアルをNode.js v26に対応しました

Node.js v26が新たなアクティブLTSとなったことを受けて、本書の各チュートリアルの前提条件を「Node.js v24以上」から「v26以上」に更新しました。「開発環境の準備」のHomebrewインストール手順もbrew install node@26に切り替えています。最新の安定版を使って、安心して学習を進められます。(#1116 by @suin

修正・改善

👥 コントリビューター

今回のアップデートに貢献してくださった方々です。ありがとうございます!


いつもサバイバルTypeScriptをご利用いただきありがとうございます。
ご意見・ご要望は GitHub Issues までお寄せください。

2026-04-17 「パッケージ」章を新設、Reactいいねボタンチュートリアルを最新Vite対応など

Choose a tag to compare

@suin suin released this 18 Apr 00:42
4b0edb3

2026年4月17日の更新内容をお届けします。

✨ ハイライト

「パッケージ」章を新規追加しました

「読んで学ぶTypeScript」リファレンスに、新章「パッケージ」を追加しました。TypeScript開発ではパッケージの利用がほぼ必須であるにもかかわらず、これまで本書にはパッケージに関する体系的な解説がありませんでした。今回の追加では、パッケージとは何かという概要から、npm・pnpm・Bun・Yarnといったパッケージマネージャーの比較、セマンティックバージョニング、package.jsonの読み方、ロックファイルの役割、node_modulesのホイスティングやファントム依存、サプライチェーン攻撃を防ぐ多層防御まで、全9ページで構成しています。実務でパッケージを扱うための基礎知識をひととおり身につけられる内容です。(#1091 by @suin

パッケージ

Reactいいねボタンチュートリアルを最新Vite環境に対応しました

「Reactでいいねボタンを作ろう」チュートリアルを、最新のVite 8 / React 19環境で最初から最後まで問題なく進められるよう全面的に更新しました。create-vite@9.0.4react-swc-tsテンプレートが廃止されたため、テンプレート名をreact-tsに変更し、ディレクトリ構成図やバージョン表記も新しい環境に合わせて刷新。さらに、新テンプレートのデフォルトCSSがダークモード対応で複雑なため、チュートリアル通りに進めるとレイアウトが崩れる問題にも対処し、最小限のスタイルに置き換える手順を追加しました。スクリーンショットも新環境のものに差し替えています。(#1099 by @suin

Reactでいいねボタンを作ろう

修正・改善

👥 コントリビューター

今回のアップデートに貢献してくださった方々です。ありがとうございます!


いつもサバイバルTypeScriptをご利用いただきありがとうございます。
ご意見・ご要望は GitHub Issues までお寄せください。

2026-01-23 satisfies演算子・this型の解説を全面改訂など

Choose a tag to compare

@suin suin released this 23 Jan 13:31
68c9e27

2026年1月23日の更新内容をお届けします。

✨ ハイライト

satisfies演算子の解説を初心者向けに書き直しました

「satisfies演算子」ページを全面改訂しました。従来の解説は型アノテーションとの差分から説明が始まっていたため、「なぜこの演算子が必要なのか」が分かりにくい状態でした。今回の改訂では「型チェックをしないと危険」→「型注釈すると安全だが推論は消える」→「satisfiesで両立できる」というストーリー重視の構成に変更。比較表や実用的なユースケース(設定ファイル、インライン型チェックなど)も追加し、satisfiesの価値が直感的に伝わるようになりました。(#1085 by @suin

satisfies演算子

メソッド戻り値のthis型ページを全面改訂しました

「メソッド戻り値のthis型とメソッドチェーン」ページを読みやすく書き直しました。いきなり30行以上のコード例から始まる従来の構成を見直し、シンプルなParent/Childクラスでthis型の基本動作を段階的に説明する形に変更。また「this型は型チェックのバイパスではなく、より正確な型情報を提供している」という誤解防止の説明を追加し、サンプルコードも実務で応用しやすい商品検索クエリビルダーに更新しました。(#1083 by @suin

メソッド戻り値のthis型とメソッドチェーン

修正・改善

👥 コントリビューター

今回のアップデートに貢献してくださった方々です。ありがとうございます!


いつもサバイバルTypeScriptをご利用いただきありがとうございます。
ご意見・ご要望は GitHub Issues までお寄せください。


What's Changed

  • 「型ガード関数」のサンプルコードから declare を除去しました。 by @suin in #1069
  • 分割代入引数「全体の既定値」のTypeScript例を分かりやすくしました。 (#1067) by @suin in #1070
  • Prettierチュートリアルのバージョン出力例に補足説明を追加しました。 by @suin in #1073
  • PageRefカードと前後要素との余白が適切に表示されるよう修正しました。 by @suin in #1074
  • PR・コミットメッセージを自動提案するCursorコマンドを追加しました。 by @suin in #1076
  • JSXのスタイル属性で二重中括弧になる理由の補足説明を追加しました。 by @suin in #1081
  • 「メソッド戻り値のthis型」ページを全面改訂しました。 by @suin in #1083
  • ReturnTypeページにinferドキュメントへのリンクを追加しました。 by @suin in #1084
  • 「satisfies演算子」の解説を初心者向けに書き直しました。 by @suin in #1085
  • 「列挙型の代替案」にconstアサーションへのリンクを追加しました。 by @suin in #1086
  • 2026年1月23日のリリースノートを作成しました。 by @suin in #1088

Full Changelog: 2026-01-13...2026-01-23

2026-01-13

Choose a tag to compare

@suin suin released this 12 Jan 21:44
71c26a2

What's Changed

  • チュートリアルを最新にしました。 by @suin in #1040
  • Next.jsチュートリアルのデモ動画をSVGに置換し、構成を改善しました。 by @suin in #1042
  • ESLintチュートリアルを最新化しました。 by @suin in #1045
  • OGP画像を新しいタイポグラフィに更新しました。 by @suin in #1046
  • 開発環境を新しくしました。 by @suin in #1048
  • 「オブジェクトのスプレッド構文」の解説を追加しました by @suin in #1051
  • interfaceとtypeの違いに「インデックス型への代入互換性」の解説を追加しました。 by @suin in #1049
  • 「AIに質問する」機能をWeb検索ベースに変更しました。 by @suin in #1050
  • .editorconfigを追加しました by @suin in #1053
  • 本文のtext-align: justifyを削除しました by @suin in #1054
  • 「JSX」にてReact固有の説明であることを明記しました by @suin in #1055
  • コードブロックの言語指定ガイドラインを追加しました by @suin in #1056
  • 未使用の changelog.config.js を削除しました。 by @suin in #1060
  • Prettierのチュートリアルで // prettier-ignore コメントが表示されるよう修正 by @suin in #1063
  • EditorConfigの説明の追加 by @tats-u in #570
  • プロジェクト参照チュートリアルをYarnからnpmに移行しました by @suin in #1064
  • 2026-01-13のリリースノートを追加しました。 by @suin in #1066

Full Changelog: 2025-11-18...2026-01-13

2023年7月のアップデート!「JSX」解説ページの追加、Dateの問題点についての解説の追加など

Choose a tag to compare

@suin suin released this 01 Aug 21:56
b4185d7

こんにちは、『サバイバルTypeScript』の執筆チームです。アップデートをお知らせします!

「JSX」について扱うページを追加しました。 by @suin in #749

CleanShot 2023-08-02 at 05 26 57 png

主に以下のトピックについて、詳しく解説しています。

  • JSXとECMAScriptの違い
  • JSX構文とHTML構文の違い
  • JSX構文の詳細(要素、テキスト要素、ループなど)
  • JSXのベストプラクティス
  • JSXとコンパイルの関連性

特にJSXについてはReactなどで使われていて、JavaScriptの拡張構文として非常に一般的ですが、その詳細な構文や適用例について詳しく説明しています。JSXを使うことで、JavaScriptのコード内にHTMLタグのような構文が埋め込み可能となり、より直感的かつ読みやすい形でUIのコードを表現することが可能となります。

また、忘れてはならないのが、JSXとはJavaScriptの構文を独自に拡張した言語であるため、直接ブラウザで解釈することはできません。そこでは「トランスパイル」という過程が必要となり、その手助けとなるツールとして、BabelやTypeScriptコンパイラーが使われます。その詳細な説明も合わせて解説しています。

さらに、JSX構文とHTML構文の微妙な違いや、JSXで扱う要素や属性、ジェネリクスについて、そして何がベストプラクティスなのかという部分にも踏み込んで解説しました。

JSXのページはこちらから

引き続き『サバイバルTypeScript』をよろしくお願い申し上げます!新版が皆さんのTypeScript学習の一助となりますように。

コンテンツのブラッシュアップ

  • 「TypeScriptの射程」のサーバーレスの実例にAzure Functionsも追加しました。 by @suin in #745
  • ビルトインAPIのDateの問題点を詳しくし、なぜこの問題が生まれたのかについてのコラムを追加しました。 by @suin in #751
  • 「インデックスアクセス型」にて配列型とタプル型を分けて解説するように変更しました。 by @suin in #753

軽微な修正

  • 誤植「シングルプロス」→「シングルプロス」 by @suin in #734
  • 「明確な割り当てアサーション」の「より安全なコードを書くには」の項のサンプルコードで非nullアサーションを使わないようにしました。 by @suin in #735
  • 文中でのメソッドの表記を統一しました。(例: then → Promise.prototype.then、month.toFixed → monthのtoFixedメソッド) by @jamashita in #741
  • 「関数宣言」に貼られたリンク先のページが「関数式」になっている誤りを訂正しました。 by @jamashita in #742
  • 「Vercelにデプロイしてみよう」を「Next.jsで猫画像ジェネレーターを作ろう」と整合するように修正しました。 by @suin in #744
  • 誤植「早期リータン」→「早期リターン」 by @suin in #750
  • 表記の修正をしました:「bool」→「boolean」「メソッドチェイン」→「メソッドチェーン」 by @jamashita in #754
  • 「薄れないTypeScriptの強み」で「2020年の今日でも」と陳腐化する表現になっていたところを経年により陳腐化しない表現に変更しました。 by @sontixyou in #756

執筆者向けのアップデート

  • Node.jsをv14からv18に、Docusaurusをv2.0からv2.4にアップグレードしました。 by @suin in #730
  • GitHub Actionsでyarn buildするようにしました。 by @suin in #736
  • faviconをDocusaurusのデフォルトアイコンからサバイバルTypeScriptのロゴに変更しました。 by @suin in #740

New Contributors

フルの変更履歴: 2023.6...2023.7

2023年6月のアップデート!「型定義ファイル」ページへの「型定義ファイルで登場するキーワード」の追加など

Choose a tag to compare

@suin suin released this 30 Jun 10:54
8293dc8

型定義ファイル (.d.ts)」ページに「型定義ファイルで登場するキーワード」セクションを新たに追加しました! (by @t-yng in #722)

新たに作成されたセクションでは、以下の内容を詳しく掘り下げています。

  • declare:JavaScript に存在する変数、関数、クラスなどを TypeScript が認識するためのキーワードとその活用方法
  • namespace:型名の衝突を回避するための名前空間の定義について
  • module:過去のキーワードとの混同及び現在の推奨事項
  • トリプルスラッシュ・ディレクティブ:TypeScript 独自のコンパイラへの指示機能とその使用例

これらのキーワードや概念は型定義ファイルを扱う上で欠かせないため、理解を深めるのに役立つでしょう。

型定義ファイルは TypeScript が JavaScript コードとスムーズに連携するための重要な道具であり、それらを適切に使用するためには、キーワードやディレクティブの理解が不可欠です。この新たなセクションは、これらの概念を理解し、型定義ファイルをより効率よく利用するための知識の一助となることでしょう。

新たに追加された「型定義ファイルで登場するキーワード」セクションを活用し、TypeScript のより深い理解を得ることをお勧めします。あなたのフィードバックはいつでも大歓迎です。お気づきの点や提案がありましたら、遠慮無くお知らせください。

素晴らしい TypeScript ライフを!🚀

新規ページの追加

  • 「型定義ファイル (.d.ts)」ページに「型定義ファイルで登場するキーワード」セクションを追加しました。 by @t-yng in #722

新バージョンへの追従

なし

コンテンツのブラッシュアップ

  • 「TypeScriptの学習リソース」ページの一部表現を改善しました。 by @yo-goto in #717
  • 型の表記ゆれを統一しました。(例:「文字列型」→「string型」) by @jamashita in #714

軽微な修正

  • 「ジェネリクスが使われている標準ライブラリ」ページからTypeScript公式リポジトリへのリンク切れを修正しました。 by @kyanagi in #720

執筆者向けのアップデート

なし

新規貢献者

フルの変更履歴: 2023.5...2023.6

2023年5月のアップデート!「TypeScriptの学習リソース」「await」の追加など

Choose a tag to compare

@suin suin released this 26 May 11:47
1bb77a3

What's Changed

「TypeScriptの学習リソース」のページを追加しました by @yo-goto in #693

CleanShot 2023-05-26 at 20 45 55 png

TypeScript学習リソースの紹介ページが追加されましたので、ぜひ役立ててください!🚀 このページでは、Microsoft公式の情報源やサードパーティの情報源など、様々なTypeScriptに関するリソースを探検できます。また、公式ドキュメントの構成要素や攻略方法もわかりやすく解説しています。✍️

学習や調査に役立つ情報が満載のこのページを活用し、TypeScriptスキルを磨いていきましょう!🎓🎉

リソースの詳細やリンクは、このページでご覧いただけます。良い学習を!📚

awaitのページが追加されました by @jamashita in #687

await解説ページが追加されました。このページでは、async/await構文を用いた非同期処理の簡潔な記述方法について詳しく解説しています。awaitPromiseを解決するまで実行を待機し、解決された値を返す機能を提供します。ただし、awaitは基本的にasync関数内でのみ使用できます。このページを通じて、async/awaitを活用した効果的なコーディングテクニックを学びましょう。

https://typescriptbook.jp/reference/asynchronous/await

新バージョンへの追従

  • 「コンポーネントテストの「ボタンをクリックするとON/OFFの表示が切り替わる」がtesting-library/user-event@14でFAILになる問題を解決しました by @suin in #716

コンテンツのブラッシュアップ

  • 非同期処理とawaitのページができたためリンク先を変更しました by @jamashita in #691
  • 「TypeScriptの学習リソース」のページをブラッシュアップしました by @yo-goto in #697
  • 「TypeScriptの特徴」をブラッシュアップしました by @suin in #712
  • 「TypeScriptの学習リソース」のページに「JavaScriptの学習リソース」のセクションを追加しました by @yo-goto in #706

軽微な修正

  • 誤植の修正: Regexp.prototype.match→String.prototype.match by @jamashita in #688
  • 誤植の訂正: swicth → switch by @tojimasan in #695
  • 誤植の修正:「値有無を確認する」→「値有無を確認する」 by @yoshi2no in #703
  • 「Reactでいいねボタンを作ろう」のサンプルコードで不要な「import logo from "./logo.svg";」の行を削除しました by @kamadakohei in #715
  • 誤植の修正:「.modules.css」→「.module.css」 by @YusukeOno in #713

執筆者向けのアップデート

  • プルリクエストを書きやすいように、PRのテンプレートにクローズするissueの番号を書く場所を追加しました by @t-yng in #694

New Contributors

Full Changelog: 2023.4...2023.5

初版

Choose a tag to compare

@suin suin released this 03 Oct 19:47
6bc30f9
GitBook: [master] one page modified