Learn Angular for free: top online resources you shouldn’t miss (2/2)
The “Learn Angular for Free” series comprises carefully curated free resources that assist you in acquiring proficiency in various programming techniques with Angular. The final segment of the article primarily emphasizes reactive development, forms, testing, and architecture. If you haven’t had the opportunity to read the first article, I highly recommend giving them a thorough read.
RxJS plays a vital role in Angular, enabling us to handle asynchrony, reactive programming, state management, and the composition of operations within our applications. While there is a perception that mastering RxJS can be challenging, I believe that learning RxJS itself is not overly complex. However, it does require a significant investment of time and patience. With a vast array of operators available in RxJS, it can be overwhelming initially, and choosing the right solutions may not be intuitive at first.
By exploring these video resources, you can gain valuable insights into RxJS and enhance your understanding of this powerful tool within the Angular ecosystem.
As mentioned earlier, the number of operators in RxJS is extensive, totaling over 100. However, we typically rely on a selected set of operators in everyday programming. Nonetheless, the more familiar we are with the capabilities of RxJS, the more effectively we can produce high-quality code. I have curated additional materials in this section that delve into RxJS operators.
The first featured resource by Joshua Morony focuses on the most commonly used RxJS operators. In the second material, Mike Brocchi and John Niedzwiecki shed light on 20 lesser-known operators that are often overlooked. Subsequently, the following three videos explore the distinctions between various transformation operators. Dmytro Mezhenskyi also discusses the zip operator and provides insights into RxJS schedulers. Lastly, Wojciech Trawiński’s article series showcases practical use cases for RxJS operators.
By exploring these resources, you will better understand specific RxJS operators and their applications. Remember that while a vast array of operators is available, focusing on a core set and mastering their usage will significantly benefit your coding skills.
Video – 20 RXJS Operators in 20 minutes | Mike Brocchi & John Niedzwiecki
by Mike Brocchi & John Niedzwiecki
RxJS best practices
As we explore the capabilities of RxJS, it is crucial to also familiarize ourselves with the best practices associated with it. I recommend watching Michael Hladky’s presentation at the ng-conf conference to gain insights into these practices. In his workshop-style talk, Michael demonstrates advanced patterns that can be applied in business applications. Additionally, Deborah Kurata’s presentation highlights that not all best practices are universally applicable, offering valuable insights into their context-dependent nature.
To further delve into best practices, I have included a video from NG-BE 2023 where Brecht Billiet proposes Reactive Patterns tailored explicitly for large business applications. Additionally, I have curated two articles on the subject. The first article, authored by Tomas Trajan, explores RxJS best practices, while the second article, by Brecht Billiet, offers valuable insights into practical methods for utilizing RxJS.
By engaging with these resources, you will better understand the best practices associated with RxJS. It is essential to consider both general guidelines and context-specific recommendations to make the most of RxJS in your applications.
Testing RxJS code is often considered a challenging aspect to master, but there are valuable resources available to aid in understanding this process. Kevin Kreuzer’s video provides insights into using marble tests for testing reactive code, offering a helpful approach in this regard. Furthermore, Joshua Morony’s comprehensive material demonstrates various techniques that can be employed to test reactive code in different components, such as dumb components, smart components, services, and more.
Signals – new feature Angular 16
In recent months, signals have emerged as a highly discussed topic among Angular developers. This feature was introduced as a developer preview in Angular version 16. I recommend starting with the first two videos created by Angular’s official YouTube account to delve into this exciting development. In these videos, members of the Angular Core Team share insights about the reactivity approach with Signals, the advantages they offer, the roadmap ahead, and the anticipated changes in upcoming Angular versions. Additionally, the second video demonstrates the practical usage of Signals within an application.
For further exploration, I suggest watching two speeches from the NG-BE 2023 conference, delivered by Paweł Kozłowski and Michael Hladky. These talks provide valuable insights and perspectives on Signals. Lastly, I have included a noteworthy post by Sander Elias that perfectly explains the reasons behind Angular’s introduction of Signals, their nature, and how they can be utilized. It’s important to note that the post was created shortly after the announcement of the Proof-of-Concept (PoC) of Signals, so there may be differences in content compared to the final version of Signals implementation.
Mastering forms is a crucial aspect when it comes to building major business applications. In this section, I have curated a selection of videos and articles that will introduce you to various aspects of forms in Angular.
Fireship and Decoded Frontend have created informative videos covering the basics of reactive and template forms, providing a solid foundation for understanding form handling in Angular. Joshy Morona’s video showcases the creation of dynamic forms based on JSON, offering insights into building dynamic and customizable form structures.
Additionally, I recommend two articles that delve into advanced form features. The first article discusses Typed Reactive Forms, a powerful feature from Angular version 14 that allows for type-safe form handling. The second article, written by Netanel Basal, demonstrates how to create multi-step forms using the Dependency Injection and Routing mechanisms in Angular, providing a structured approach for building complex form workflows.
I once came across a tweet stating that testing Angular applications is often more challenging than writing the code itself. To delve deeper into the mechanics of writing effective tests, I recommend watching the following videos:
Reiner Hahnekamp delivers a speech showcasing various testing techniques in Angular. He discusses their advantages and disadvantages and intertwines practical examples with testing theory, providing valuable insights into the subject. Shai Reznik’s two presentations focus on Angular’s Test-Driven Development (TDD) approach. Of particular interest is his ng-conf 2022 presentation, which showcases Conference Programming—a unique twist on Pair Programming involving the entire conference audience.
Maria Korneeva’s video explores the use of Jest in Angular’s unit tests. She provides practical guidance on harnessing the power of Jest for efficient unit testing in Angular applications. Jordan Powell’s material delves into Component Testing using Cypress.
The resources provided below will assist you in exploring the concept of state management and determining whether the usage of libraries like ngrx or rx-angular is necessary. It’s important to note that this is a vast topic, and definitive answers may be elusive as the decision relies on various factors, such as the application’s scale and the complexity of the state.
In the first video, Manfred Steyer explores lightweight architectures using the latest innovations in Angular. It provides valuable insights into designing scalable and efficient Angular applications. Tomas Trajan’s article presents a quick guide on building an epic Angular application with clean architecture. It offers practical tips and techniques to architect your Angular projects effectively. Then three books that talk about the use of Nx to create scalable Angular applications, about the use of monorepo in business solutions and the use of the Micro Frontends approach.
Together, these resources offer a well-rounded exploration of lightweight architectures, clean architecture principles, using Nx, monorepo strategies, and applying Micro Frontends in Angular. They serve as valuable references for developers seeking to enhance their architectural skills and design robust Angular applications.
“Learning by reading is good, but learning by doing is better.“
Engaging in problem-solving is an incredibly valuable approach to learning Angular. Thomas Laforge has developed a project that offers a hands-on experience, enabling you to enhance your Angular skills by tackling real-world challenges commonly encountered in your professional journey. Remember, learning by doing is an effective way to consolidate your knowledge and skills in Angular development.
Angular 16 has brought us a lot of good, many new opportunities. Make sure to explore the dedicated Signals section mentioned earlier. In addition, I wanted to put here some materials prepared by Minko Gechev, Angular Team, and Manfred Steyer, in which they listed all the news from the new version of Angular 16. These materials serve as valuable references to stay updated on the latest developments in this version of Angular.
Acknowledging the incredible contributors
I would like to thank all the creators who made this list possible. Each of you creates amazing content that allows us to become better programmers. In the second part of the article, the creators of the materials are (in alphabetical order):
- Alex Okrushko
- Brecht Billiet
- Brian Love
- Deborah Kurata
- Design Course
- Dmytro Mezhenskyi
- John Niedzwiecki
- Jordan Powell
- Joshua Morony
- Kevin Kreuzer
- Laith Academy
- Lars Gyrup Brink Nielsen
- Manfred Steyer
- Maria Korneeva
- Max Koretskyi
- Michael Hladky
- Mike Brocchi
- Mike Pearson
- Minko Gechev
- Netanel Basal
- Nitin Vericherla
- Pawel Kozlowski
- Pete Darwin
- Preston Lamb
- Rainer Hahnekamp
- Sander Elias
- Shai Reznik
- Thomas Laforge
- Tomas Trajan
- Wojciech Trawiński
- Victor Savkin
- Younes Jaaidi
Their dedication and hard work deserve our appreciation and gratitude. I encourage everyone to follow these talented authors, engage with their content, and support their ongoing efforts to empower and educate Angular programmers.