Angular Addicts # NgRx のテストでのページ オブジェクト モデルの使用、Vite を使用したマイクロ フロントエンドなど

?Angular Addict の皆さん

これは、私の注意を引いた厳選された Angular リソースを毎月まとめた Angular Addicts ニュースレターの第 33 号です。 （第32回、第31回、第30回はこちら）

?リリースのお知らせ

? NgRx 19 の発表: NgRx シグナル機能、アクションシグナルなど!

Brandon Roberts が、NgRx の最新バージョンといくつかの新機能を発表します。

• SignalStore では、作成時に SignalStore 内の静的プロパティまたはオブザーバブルを定義する withProps 機能が導入されました。
• 新しい signalMethod ユーティリティ関数。使用シグナルのみを使用できる機能を備えた rxMethod の利点が得られます。
• 開発モードでは、patchState 関数をチェックして、開発中の状態の不変性を確保します。
• NgRx ストアは、シグナル変更時のアクション ディスパッチをサポートするようになりました。

?2024年12月のAngular Gem

?私の新しい Angular コーディング スタイル

Kevin Kreuzer は最近、Signals と新しい Angular API を使用して大規模なコードベースを書き直しました。この記事では、リファクタリング中に出現した新しいコーディング スタイルとパターンについて説明します。重要なポイントには、標準としてのスタンドアロン コンポーネントの採用、反応性のためのシグナルの使用への移行、従来のライフサイクル フックからの移行が含まれます。

? NGRX シグナル ストアでの Angular のリソース API の使用

Manfred Steyer が、リソース API で SignalStore の withProps 機能を使用する方法を示します。彼のガイドには、linkedSignal と signalMethod を使用したテンプレート駆動型フォームの接続も含まれています。

? Angular アプリケーションでのページ オブジェクト モデル デザイン パターンの使用

Francesco Borzì の記事では、Angular アプリケーションでのページ オブジェクト モデル (POM) デザイン パターンの実装について説明しています。 POM を使用すると、ページ オブジェクトが DOM との対話が「どのように」行われるかを処理しながら、テストは「何を」行う必要があるかに重点を置くことができるため、よりクリーンで保守しやすいテスト コードが得られます。 Francesco は、Angular コンポーネント テストでの POM の使用を容易にするように設計され、さまざまなテスト フレームワークと互換性のある新しいライブラリ ngx-page-object-model も紹介します。

? Vite を使用して 15 分でマイクロフロントエンド アーキテクチャをセットアップします。

Meidi Airouche は、記事の中で、Vite を使用したマイクロフロントエンド アーキテクチャの作成、Vue.js、Angular、および React コンポーネントをモジュラー ニュース ポータルに統合する方法について概説しています。プロジェクトは以下を組み合わせます:

• ナビゲーション用の Vue.js ヘッダー
• 最新記事の React Trending セクション
• 人気コンテンツの Angular ハイライト領域

? Angular でのコンポーネント通信をマスターする

Michał Grzegorczyk は、Angular アプリケーションのコンポーネント間の通信を促進するためのさまざまな方法の包括的な概要を提供します。取り上げられる主なトピックは次のとおりです:

• 入力、出力、セッター、および ngOnChanges ライフサイクル フック
• @注入可能なサービス
• コンポーネント/ディレクティブの挿入
• テンプレート変数 (#)
• コンテンツ投影 (@ContentChild / contentChild() / @ContentChildren / contentChildren())
• リストの表示とクエリ (@ViewChild / viewChild() / @ViewChildren / viewChildren())
• ルーティング (パラメータ、クエリ、withComponentInputBinding()、状態オブジェクト)

?‍?著者について

私の名前は Gergely Szerovay です。私は長年データ サイエンティストおよびフルスタック開発者として働いており、Angular ベースのフロントエンド開発に重点を置いてフロントエンド テクノロジー リードとして働いてきました。私の役割の一環として、私は Angular とフロントエンド開発シーン全体がどのように進化しているかを常に観察しています。私の知識を共有するために、2022 年に Angular Addicts の月刊ニュースレターと出版物を開始し、毎月出会う最高のリソースをお届けできるようにしました。あなたが経験豊富な Angular Addict であっても、初心者であっても、私はあなたをカバーします。ライターとして参加したい方はお知らせください。一緒にAngularを学びましょう！ここから購読してください?

Angular はここ数年で非常に急速に進化しており、ここ 1 年で生成 AI の台頭により、ソフトウェア開発ワークフローも急速に進化しました。 AI 支援ソフトウェア開発の進化を綿密に追跡するために、私は AI ツールの公開を開始し、進捗状況を AIBoosted.dev で公開することにしました。この学習の旅に参加してください: ここから購読してください?

Angular の詳細と、AI、Typescript、React、Angular を使用して AI アプリを構築する方法を学ぶには、Substack (Angular Addicts)、Substack (AIBoosted.dev)、Medium、Dev.to、Twitter、または LinkedIn で私をフォローしてください!

?️以前の問題

ニュースレターの前号を見逃した場合は、ここで読むことができます。これらは最新の 3 号です:

• Angular Addicts #32: Angular 19、新しいスタイルガイド RFC など
• Angular Addicts #31: 新しいリソース API、エフェクトの更新など
• Angular Addicts #30: エフェクト、Angular DI 機能、リクエスト キャッシュなどを使用する場合

? Angular リソースを送信する

最近、Angular 関連の興味深い記事、ツイート、またはその他のリソースを見つけたり書いたりしましたか?こちらのコメント欄かTwitterのDMでお知らせください！次の Angular Addicts 号で取り上げるかもしれません!

以上がAngular Addicts # NgRx のテストでのページ オブジェクト モデルの使用、Vite を使用したマイクロ フロントエンドなどの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。