Since Angular 14, "inject" function can now be used in components, services, directives, pipes constructors. This allows both interesting and frightning injection patterns, let's dive into them.

Whatever framework you are using, and even without frameworks, component testing is a challenging topic as there is no one-size-fits-all approach. Jest and Cypress are gaining traction but do you also feel that something is missing in between? What if we could isolate and test our components in Cypress (with or without Storybook)?

Most web apps get their value from interacting with HTTP APIs. This is generally done using HTTP clients like the native fetch function, Axios or Angular's HttpClient. Once you set up an HTTP client on a web app then sooner or later, you will need to extend its capabilities in order to handle different topics like User Experience (e.g. pending requests indicator), performance (e.g. caching), resilience (e.g. automatic retry), and security (e.g. authentication). Luckily, most HTTP clients can be easily extended using interceptors so you won't have to wrap them or implement your own client. Even though implementing an interceptor can sound quick and easy, handling edge cases, testing and maintenance can get expensive. Wouldn't it be better if someone else could handle these issues for us?

API Gateways are a nice place, if not THE right place for handling request validation and responding with human readable and uniform error responses. Implementing the validation manually for every API would be a mess... but wait, what if this could be done automatically by simply feeding our OpenAPI Specification to a gateway like Express Gateway.

Express Gateway is an API Gateway built on Express.js. It has the advantage of being simple and minimalist but also flexible and highly extensible thanks to JavaScript plugins. This recipe will show you how to quickly setup Express Gateway as an API Gateway.

Life is too short. When searching for something, we can’t afford to type a whole word or sentence in a search field, or filling all the fields then hitting our old keyboard’s half-broken enter key to finally be able to see the first results... or nothing at all because our search criteria were too restrictive. Don’t look at me like that! We can probably agree that most of us, if not all, are used to features like typeahead and live search results. We get frustrated every time we have to submit a search form.

OpenAPI Specification (formerly known as Swagger) is a format that allows you to describe and document your HTTP API or ReSTful API from the interface to the authentication schemes and the permissions required for each route. A wide range of tools can use the OpenAPI Specification format to help you manage the lifecyle of your APIs from designing them to securing them while improving API consumers Developer eXperience.

Stale or long-lived branches, conflicts & huge code reviews can cause technical and human issues in your team. In this talk, Younes demonstrates some alternative and sometimes extreme approaches promoting single-branch development with techniques like Limbo, Timeboxed TDD and Test && Commit || Revert.

Angular modules can bring some complexity to your app. Choosing the right modules architecture is tricky... but wait, do we really need modules?

One of my favorite things about Angular is how the template is just a simple HTML file. This is really great; especially if you care about Collective Ownership. With some basic HTML knowledge, anyone can contribute to the application’s development: other teams, external web designers… or even the Client or Product Owner! Why not!? In other words, using HTML templates reduces the TTFC (Time To First Commit) which is the average time it takes for someone new in your team to make his first change.

An introduction to the Angular CLI by the Angular team.

Angular Modules, or NgModules are the main modularity system in Angular. They are fundamental for architecturing & structuring our apps and libraries in a performant, readable and scalable way.

Angular apps, like any other kind of apps, can get big. One way of optimizing our apps is to avoid loading modules that we don't need immediately. This is called lazy-loading. You can learn more about it in the official documentation.

Controlling the behavior of a whole application or page can quickly get tricky if we don't split it into smaller chunks. In Angular, these chunks are called components. Every component is reusable and allows us to control the display and behavior of some part of the application or page. This official documentation gives a nice introduction on how components work.

Unsurprisingly, the official TypeScript documentation contains one of the best introductions to TypeScript.