architecture-next-steps.md

次のステップ: ツールとテクニック

基本的なAngularの構成ブロックを理解したあと、 Angularアプリケーションの開発と提供に役立つ機能とツールの詳細を学ぶことができます。

• ツアー・オブ・ヒーローズチュートリアルを通じて、基本的な要素を組み合わせてうまく設計されたアプリケーションを作る方法を実感することができます。
• 用語集 では Angular 特有の単語や使い方を知ることができます。
• 開発の段階や関心のある分野に応じて、キーとなる機能を深く学ぶためにドキュメントを活用してください。

アプリケーションの設計

• 目次にある メインコンセプト セクションには、インタラクティブなアプリケーションを作るためにアプリケーションのデータをコンポーネントのテンプレートに接続する方法を解説するいくつかのトピックがあります。
• NgModules ガイドでは、Angular アプリケーションのモジュール構造について詳しい情報を提供します。
• ルーティングと画面遷移 ガイドでは、異なるビューの間を遷移するようなシングルページアプリケーションの作り方について詳しく説明します。
• 依存性の注入 ガイドでは、それぞれのコンポーネントクラスが機能を提供するためのサービスやオブジェクトを取得できるようなアプリケーションの作り方について詳しく説明します。

レスポンシブプログラミング

テンプレート構文および関連トピックには、コンポーネントデータをビュー内の必要なときに必要な場所に表示する方法、およびユーザーからの応答可能な入力を収集する方法の詳細が含まれています。

さらにこれらのページやセクションには、Angular アプリケーションでのいくつかの基本的なテクニックが記載されています。

• ライフサイクル・フック: ライフサイクル・フックインターフェースを実装することで、コンポーネントの作成から破棄まで、コンポーネントの存続期間中の重要な瞬間に触れることができます。
• Observable とイベント処理: コンポーネントやサービスで observable を使用して、ユーザーインタラクションイベントや非同期操作結果など、あらゆるタイプのメッセージをパブリッシュして購読する方法です。
• Angular elements: フレームワークに依存しない形で新たな HTML 要素を定義するウェブ標準技術である Web Components を使って、コンポーネントを custom elements としてパッケージする方法です。
• フォーム: HTML ベースの検証とダーティーチェックを使用して、複雑なデータ入力シナリオをサポートします。
• アニメーション: Angularのアニメーションライブラリを使用して、アニメーションテクニックやCSSの詳細な知識なしに コンポーネントの動作をアニメートできます。

クライアントとサーバーのインタラクション

Angular は、ほとんどのロジックやデータがクライアント側にあるシングルページアプリケーション向けのフレームワークを提供します。 ほとんどのアプリケーションはデータを取得、保存するために HttpClient を使ってサーバーにアクセスする必要があります。 いくつかのプラットフォームやアプリケーションでは、PWA (Progressive Web App) モデルによってユーザー体験を改善させたいかもしれません。

• HTTP: HTTP クライアントを使用してサーバーと通信してデータを取得、保存し、サーバー側のアクションを呼び出します。
• サーバーサイドレンダリング: Angular Universal は、サーバーサイドレンダリング(SSR)によってサーバー上に静的アプリケーションページを生成します。これにより、パフォーマンスを向上させ、モバイルデバイスや低パワーのデバイスで最初のページをすばやく表示し、Webクローラを手助けするために、Angular アプリケーションをサーバー上で実行できます。
• Service WorkersとPWA: service worker を使用してネットワークへの依存を減らしユーザー体験を大幅に改善します。
• Web workers: CPU を使う処理をバックグラウンドスレッドで走らせる方法について学びます。

開発サイクルのサポート

• CLIコマンドリファレンス: Angular CLIは、プロジェクトの作成、アプリケーションおよびライブラリコードの生成、およびテスト、バンドル、デプロイなどのさまざまな進行中の開発タスクの実行に使用するコマンドラインツールです。
• コンパイル: Angularは、開発環境用のジャストインタイム（JIT）コンパイルと、本番環境用の事前（AOT）コンパイルを提供します。
• テスティングプラットフォーム: Angular フレームワークとやり取りするアプリケーションの部品において、ユニットテストを実行します。
• デプロイメント: Angular アプリケーションをリモートサーバーにデプロイする方法を学びます。
• セキュリティガイドライン: 一般的な Web アプリケーションの脆弱性やクロスサイトスクリプティングなどの攻撃に対する Angular の組み込みの保護機能について説明します。
• 国際化: Angular の国際化(i18n)ツールを使用して、アプリケーションを複数の言語で利用できるようにします。
• アクセシビリティ: アプリケーションをすべてのユーザーにとって使いやすくしましょう。

ファイル構造、設定、依存

• ワークスペースとファイル構成: Angularワークスペースとプロジェクトフォルダの構造を理解する。
• ビルドとサーブ: 開発時、ステージング、およびプロダクションなど、プロジェクトのさまざまなビルドおよびプロキシサーバー構成を定義する方法を学びます。
• npmパッケージ: Angular フレームワーク、Angular CLI、Angularアプリケーションで使用されるコンポーネントは、npmパッケージとしてパッケージ化され、npmレジストリを介して配布されます。 Angular CLIはデフォルトの package.jsonファイルを作成します。このファイルは、うまく機能し、多くの一般的なアプリケーションシナリオを共同でサポートするパッケージのスターターセットを指定します。
• TypeScript の設定: TypeScript は Angular アプリケーション開発における主要な言語です。
• ブラウザのサポート: アプリケーションを幅広いブラウザに対応させます。

Angular の拡張

• Angular ライブラリ: 再利用可能なライブラリの使い方、作り方を学びます。
• Schematics: CLI の自動生成機能をカスタマイズしたり拡張したりする方法を学びます。
• CLI builders: アプリケーションのビルドやテストなどの複雑なタスクを実行するように CLI の機能をカスタマイズ、拡張する方法を学びます。

@reviewed 2022-02-28