Angular Addicts # NgRx mit dem Page Object Model in Tests, Micro Frontends mit Vite und mehr

„Hey Angular Addict

Dies ist die 33. Ausgabe des Angular Addicts Newsletters, einer monatlichen Sammlung sorgfältig ausgewählter Angular-Ressourcen, die meine Aufmerksamkeit erregt haben. (Hier sind die 32., 31. und 30. Ausgabe)

? Veröffentlichungsankündigungen

? Ankündigung von NgRx 19: NgRx-Signalfunktionen, Aktionssignale und mehr!

Brandon Roberts kündigt die neueste Version von NgRx an, einige der neuen Funktionen:

• SignalStore führt die withProps-Funktion ein, um während der Erstellung statische Eigenschaften oder Observablen in einem SignalStore zu definieren.
• Neue signalMethod-Dienstprogrammfunktion, die Ihnen die Vorteile von rxMethod mit der Möglichkeit bietet, nur Signale zu verwenden.
• Der Entwicklungsmodus prüft die Funktion patchState, um die Unveränderlichkeit des Zustands während der Entwicklung sicherzustellen.
• NgRx Store unterstützt jetzt den Aktionsversand bei Signaländerungen.

„Winkelige Edelsteine ​​vom Dezember 2024.“

? Mein neuer Angular Coding Style

Kevin Kreuzer hat kürzlich eine große Codebasis mithilfe von Signalen und den neuen Angular-APIs neu geschrieben. In diesem Artikel erklärt er die neuen Codierungsstile und -muster, die während des Refactorings entstanden sind. Zu den wichtigsten Punkten gehören die Einführung eigenständiger Komponenten als Standard, der Übergang zur Verwendung von Signalen für die Reaktivität und die Abkehr von traditionellen Lebenszyklus-Hooks.

? Verwendung der Ressourcen-API von Angular mit dem NGRX Signal Store

Manfred Steyer zeigt, wie man die withProps-Funktion von SignalStore mit der Resource API nutzt. Sein Leitfaden umfasst auch die Verbindung vorlagengesteuerter Formulare mithilfe von linkedSignal und signalMethod.

? Verwendung des Designmusters „Page Object Model“ in Angular-Anwendungen

Francesco Borzìs Artikel diskutiert die Implementierung des Page Object Model (POM)-Entwurfsmusters in Angular-Anwendungen. Mit POM können sich Tests darauf konzentrieren, „was“ getan werden muss, während das Seitenobjekt „wie“ die Interaktion mit dem DOM übernimmt, was zu einem saubereren und besser wartbaren Testcode führt. Francesco stellt außerdem seine neue Bibliothek ngx-page-object-model vor, die die Verwendung von POM in Angular-Komponententests erleichtern soll und mit verschiedenen Test-Frameworks kompatibel ist.

? Richten Sie mit Vite in 15 Minuten eine Micro-Frontend-Architektur ein!

In seinem Artikel skizziert Meidi Airouche die Erstellung einer Micro-Frontend-Architektur mit Vite, die Vue.js-, Angular- und React-Komponenten in ein modulares Nachrichtenportal integriert. Das Projekt vereint:

• Vue.js-Header für die Navigation
• React Trending-Bereich für neueste Artikel
• Angular Highlights-Bereich für beliebte Inhalte

? Komponentenkommunikation in Angular beherrschen

Michał Grzegorczyk bietet einen umfassenden Überblick über verschiedene Methoden zur Erleichterung der Kommunikation zwischen Komponenten in Angular-Anwendungen. Zu den wichtigsten behandelten Themen gehören:

• Eingabe-, Ausgabe-, Setter- und ngOnChanges-Lebenszyklus-Hook
• @Injectable Services
• Komponenten-/Direkteinspritzung
• Vorlagenvariablen (#)
• Inhaltsprojektion (@ContentChild / contentChild() / @ContentChildren / contentChildren())
• Ansichts- und Abfrageliste (@ViewChild / viewChild() / @ViewChildren / viewChildren())
• Routing (Parameter, Abfragen, withComponentInputBinding(), Zustandsobjekte)

?‍?Über den Autor

Mein Name ist Gergely Szerovay, ich habe viele Jahre als Datenwissenschaftler und Full-Stack-Entwickler gearbeitet und arbeite als Frontend-Tech-Leiter mit Schwerpunkt auf Angular-basierter Frontend-Entwicklung. Im Rahmen meiner Rolle verfolge ich ständig, wie sich Angular und die Frontend-Entwicklungsszene im Allgemeinen weiterentwickeln. Um mein Wissen zu teilen, habe ich 2022 den monatlichen Newsletter und die Veröffentlichung von Angular Addicts gestartet, damit ich Ihnen jeden Monat die besten Ressourcen schicken kann, die mir in den Sinn kommen. Egal, ob Sie ein erfahrener Angular-Süchtiger oder ein Anfänger sind, bei mir sind Sie an der richtigen Adresse. Lassen Sie mich wissen, ob Sie als Autor aufgenommen werden möchten. Lasst uns gemeinsam Angular lernen! Hier abonnieren ?

Angular hat sich in den letzten Jahren sehr schnell weiterentwickelt, und im vergangenen Jahr haben sich mit dem Aufkommen der generativen KI auch unsere Softwareentwicklungsabläufe rasant weiterentwickelt. Um die Entwicklung der KI-gestützten Softwareentwicklung genau zu verfolgen, habe ich beschlossen, öffentlich mit der Entwicklung von KI-Tools zu beginnen und meine Fortschritte auf AIBoosted.dev zu veröffentlichen. Begleiten Sie mich auf dieser Lernreise: Abonnieren Sie hier ?

Folgen Sie mir auf Substack (Angular Addicts), Substack (AIBoosted.dev), Medium, Dev.to, Twitter oder LinkedIn, um mehr über Angular zu erfahren und wie man KI-Apps mit AI, Typescript, React und Angular erstellt!

?️Vorherige Ausgaben

Wenn Sie die vorherigen Ausgaben des Newsletters verpasst haben, können Sie sie hier lesen. Dies sind die neuesten 3 Ausgaben:

• Angular Addicts #32: Angular 19, neuer Styleguide RFC und mehr
• Angular Addicts #31: Die neue Ressourcen-API, Effektaktualisierungen und mehr
• Angular Addicts #30: Wann man Effekte verwendet, Angular DI-Funktionen, Request-Caching und mehr

? Senden Sie Ihre Angular-Ressource

Haben Sie in letzter Zeit einen interessanten Artikel, Tweet oder eine andere Ressource zum Thema Angular gefunden oder geschrieben? Lass es mich bitte hier in den Kommentaren wissen oder schick mir eine DM auf Twitter! Ich werde es vielleicht in der nächsten Angular Addicts-Ausgabe vorstellen!

Das obige ist der detaillierte Inhalt vonAngular Addicts # NgRx mit dem Page Object Model in Tests, Micro Frontends mit Vite und mehr. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!