お問い合わせ

コース概要

Angular 17の紹介

  • Angularとは何か?
  • AngularとReactとVueの比較
  • Angular 17の機能とアーキテクチャの概要
  • 開発環境の設定

はじめに

  • Angular CLIを使用して新しいAngular 17プロジェクトの作成
  • プロジェクトの構造とファイルの確認
  • アプリケーションの実行と配信
  • 補間と式を使用してデータの表示

コンポーネント

  • Angular 17におけるコンポーネントの役割の理解
  • コンポーネントの作成と使用
  • 入力(inputs)と出力(outputs)を使用してコンポーネント間のデータ伝達
  • コンポーネントライフサイクルフックの使用

ディレクティブ

  • 構造型ディレクティブと属性型ディレクティブの違いの理解
  • ngIf、ngFor、ngSwitchなどの組み込みディレクティブの作成と使用
  • カスタムディレクティブの作成と使用

パイプ

  • Angular 17におけるパイプの目的の理解
  • date、currency、jsonなどの組み込みパイプの作成と使用
  • カスタムパイプの作成と使用

サービス

  • Angular 17におけるサービスの役割の理解
  • サービスの作成と使用
  • プロバイダーを使用して依存性の注入

モジュール

  • Angular 17におけるモジュールの役割の理解
  • モジュールの作成と使用
  • モジュールのインポートとエクスポート

データバインディング

  • 単方向バインディングと双方向バインディングの違いの理解
  • プロパティバインディング、イベントバインディング、バナナボックス構文の作成と使用
  • テンプレート参照変数の使用

ルーティング

  • Angular 17におけるルーティングの役割の理解
  • ルートの作成と設定
  • routerLinkとrouter.navigate()を使用してルート間のナビゲーション
  • ルートパラメータ、クエリパラメータ、フラグメントの使用

フォーム

  • テンプレート駆動型フォームとリアクティブフォームの違いの理解
  • フォームコントロール、フォームグループ、フォーム配列などを使用してフォームの作成と検証
  • required、minLength、maxLengthなどの組み込みバリデーターの使用
  • カスタムバリデーターの作成と使用

HTTPクライアント

  • Angular 17におけるHTTPクライアントの役割の理解
  • HTTPリクエストの作成と使用によるバックエンドサービスとの通信
  • observableを使用して非同期データストリームを処理する
  • インターセプターを使用してHTTPリクエストまたはレスポンスを変更または処理する

新しい宣言的な制御フロー

  • 新しいテンプレート制御ブロック構文と、それが条件付きレンダリング、ループ処理、空のコレクションの処理といった一般的なタスクをどのように簡素化するかの説明
  • @if、@else、@switch、@case、@default、@for、@emptyなどの新しいブロックを使用する例の紹介
  • 新しい構文と以前の構文(*ngIf、*ngSwitch、*ngForなど)の比較
  • 新しい制御ブロックがシグナルによるゾーンレスアプリケーションをサポートする方法について言及

デフェッロードブロック

  • デフェッロードの概念と、それがWebアプリケーションの性能とユーザーエクスペリエンスをどのように向上させるかの説明
  • ブロックの内容とその依存関係の遅延読み込みを可能にする新しい@defer制御ブロックの紹介
  • コンポーネント、ディレクティブ、パイプ、アニメーション、スタイルなどの読み込みを含む、@deferブロックを使用する異なるシナリオの例の紹介
  • @deferブロックが新しいビュー遷移APIとどのように連携するかについて言及

ビュー遷移API

  • ビュー間のアニメーションや遷移をカスタマイズできるビュー遷移APIの目的と利点の説明
  • ビュー遷移APIの使用を可能にする新しいwithViewTransitionsディレクティブの紹介
  • withViewTransitionsディレクティブをフェード、スライド、ズーム、フリップなどの異なる遷移タイプと併せて使用する例の紹介
  • ビュー遷移APIがAngularルーターとブラウザ履歴とどのように連携するかについて言及

その他の機能と改善

  • Angular 17が提供するその他の機能と改善点のいくつかを簡単に要約します。例えば:
  • @Component.stylesに文字列を渡すサポート
  • Angularのアニメーションコードが遅延読み込み可能であること
  • TypeScript 5.2のサポート
  • コアシグナルAPIが安定版になったこと
  • Node.js v16のサポートが削除され、最小サポートバージョンがv18.13.0になったこと
  • Esbuildがデフォルトビルダーとなり、デフォルト開発サーバーがViteを使用すること

要求

  • HTML、CSS、JavaScriptに関する理解
  • TypeScriptとRxJSの使用経験
  • Web開発経験

対象読者

  • Angular 17を使用して動的かつレスポンシブなWebアプリケーションを作成する方法を学びたい開発者
  • Angularの以前のバージョンからスキルをアップグレードしたい開発者
  • Angular 17の新機能や改善点を探索したいプログラマー
 28 時間

参加者の人数


参加者1人あたりの価格

お客様の声 (2)

今後のコース

関連カテゴリー