Lars Gyrup Brink Nielsen

More than 6,000 views and 800 hours watched across 33 videos in 2021.

I organize the Danish in-person meetup AarhusJS.

An Angular Router-connected NgRx component store.

1 year in, This is Learning has: - 2 publications - 2 Open Learning courses - A talk show - Live coding - A public Discord server for all software developers - A private Discord server for public tech contributors This is Learning is a community for public tech contributors where we learn in public and share what we learn. We provide several opportunities for you to publish your content or contribute to open source projects.

Live coding livestream covering Angular-specific topics. 9 videos as of November 2021.

A live coding livestream covering different topics related to Nrwl's Nx build framework. 17 videos as of November 2021.

Lars introduces GitHub Actions and GitHub action workflows and answers the following questions. What can GitHub workflows automate? What can trigger GitHub action workflows? Which types of GitHub Actions can we pick from when implementing our own that are either project-specific or published on GitHub Marketplace? Finally, a CI workflow for an Angular project is demonstrated.

Surprising to some, calling TestBed.compileComponents is unnecessary unless you're Google.

Angular Ivy is the latest rendering engine and compiler introduced in Angular. Ivy helps frontend developers to make their Angular applications faster, better optimized, and more robust. This easy-to-follow guide will help you get to grips with the new features of Angular Ivy and show you how to migrate your Angular apps from View Engine to Ivy. You'll begin by learning about the most popular features of Angular Ivy with the help of simple stand-alone examples and realize its capabilities by working on a real-world application project. You'll then discover strategies to improve your developer workflow through new debugging APIs, testing APIs, and configurations that support higher code quality and productive development features. Throughout the book, you'll explore essential components of Angular, such as Angular Component Dev Kit (CDK), Ahead-of-time (AOT) compilation, and Angular command line interface (CLI). Finally, you'll gain a clear understanding of these components along with Angular Ivy which will help you update your Angular applications with modern features. By the end of this Angular Ivy book, you will learn about the core features of Angular Ivy, discover how to migrate your Angular View Engine application, and find out how to set up a high-quality Angular Ivy project.

This compatibility matrix helps Angular library authors and application developers to get a quick overview of the versions that are compatible across all major and minor versions of Angular CLI, Angular, Node.js, TypeScript, and RxJS.

We learn how to reason about style binding evaluation through style binding precedence rules with simple examples sprinkled with a few style binding caveats. We end this topic by reviewing a demo application to visualize Angular Ivy's style evaluation. After that, we learn how to enable and configure strict template type checking. We see examples of all violations and how they appear inline in our code editor as well as during compilation. Finally, we learn how to use strict template type checks with the AsyncPipe.

Introducing the ModuleTeardownOptions#destroyAfterEach option for the Angular testbed.

An Open Learning course by This is Learning. Get started with NgRx through this free, text-based open source virtual course. Each of its 12 chapters cover different topics ranging in difficulty from beginner to expert.

An Open Learning course by This is Learning. Get started with RxJS through this free, text-based open source virtual course. Each of its 6 parts cover different topics ranging in difficulty from beginner to intermediate. Contribute to improve the course.

Demonstrating the "grep" and "invertGrep" test filtering options of Angular CLI's Protractor builder.

Brief introduction to Blazor discussing: - Razor components - The 2 Blazor hosting models: - Blazor WebAssembly - Blazor Server - Their trade-offs - The trade-offs of Blazor vs. JavaScript frameworks

We learn how to reason about style binding evaluation through style binding precedence rules with simple examples sprinkled with a few style binding caveats. We end this topic by reviewing a demo application to visualize Angular Ivy's style evaluation. After that, we learn how to enable and configure strict template type checking. We see examples of all violations and how they appear inline in our code editor as well as during compilation. Finally, we learn how to use strict template type checks with the AsyncPipe.

Lars introduces GitHub Actions and GitHub action workflows and answers the following questions. What can GitHub workflows automate? What can trigger GitHub action workflows? Which types of GitHub Actions can we pick from when implementing our own that are either project-specific or published on GitHub Marketplace? Finally, a CI workflow for an Angular project is demonstrated.

This is Learning is the place to share what you learn. Welcome!

Angular Versions Action enables library maintainers to ensure cross-version compatibility with multiple major and minor versions of Angular.

Using a GitHub Actions workflow running 50 jobs per workflow run, Node.js, and SonarCloud, Lumberjack maintains end-to-end compatibility across several versions of Angular and TypeScript in a single codebase.

Abstract: In this lightning talk, we'll discuss what sets Angular apart by looking at its strong points and how it differs from other frontend frameworks. Event description: We're getting together with experts from the industry to discuss the pros and cons of the top 3 most popular frameworks - React.js , Angular and Vue.js - Which one is the best? You’ll see a representative of each framework fight their corner through lightning talks, followed by a very unique Q&A debate. Which is better for your next app or project? Which offers the best performance? Which is the most reliable? Which one is suitable for small or large size applications? It’s the ultimate showdown. We're going to battle it out, and you can get involved. Whether you are at the start of your career wondering which framework to learn, or you're already established - this event will give you the chance to get an insight of the 3 frameworks and potentially inspire you beyond your existing knowledge and preferences.

Spectacular is an integration testing library for Angular. It aims to test Angular-specific software artifacts in a real context. Spectacular's Feature testing API integrates well with Angular Testing Library and Angular Component Harnesses.

Santosh Yadav hosted an episode of his talk show, Tech Talks with Santosh, where we discussed Angular testing for 2½ hours. In this presentation, we discuss testing fundamentals, testing frameworks, unit tests, integration tests, end-to-end tests, Angular testing, testing strategies, testing techniques, component testing, presentational component testing, Storybook, visual regression testing, snapshot testing, and how to test an extensible base class. We walk through real world testing examples and explore Angular's testing APIs, TestBed and RouterTestingModule. We mention various testing libraries for Angular and present Spectacular, an integration testing library for Angular. Finally, we discuss Test-Driven Development, adding test coverage to an existing codebase and how we can convince ourselves and stakeholders of the value of unit testing.

Lumberjack is a versatile Angular logging library, specially designed to be extended and customized. It provides a few simple log drivers (logging mechanisms, transports, log drivers) out-of-the-box. It's easy to enable bundled log drivers or create and use custom log drivers. I'm one of the maintainers of Lumberjack. As part of it, we built what is probably the most elaborate CI workflow of any 3rd party Angular library. With Lumberjack version 2.x, we maintain compatibility with at least 3 major versions of Angular. Using GitHub Actions, we have proven this end-to-end in multi-faceted workflow matrices.

Introducing the new major version of Lumberjack, a free and open source logging library for Angular.

Over a period of 2 years, Lars went from internal knowledge sharing to managing tech publications, being an open-source software maintainer, and becoming a Microsoft MVP. Get inspired by his journey and get his best tips.

Spectacular is a testing library for Angular. Spectacular contains testing utilities for Angular pipes, configuration Angular modules, bootstrap listeners, and application initalizers. Spectacular has a feature testing API which enables Angular testing across a whole feature without having to bring in an end-to-end testing framework. I'm the creator and one of the maintainers of Spectacular.

I was a stand-in host for Santosh in this episode where I interviewed Anuradha Kumari about accessibility on the web and its importance.

nxworker is a collection of Nx plugins and utilities for Nx workspaces. I'm the creator and one of the maintainers of nxworker.

In my public GitHub repositories, I demonstrate and experiment with various technologies such as Angular, Nx, and Stryker mutation testing. These are usually companion repositories to articles or events.

Where there's smoke, there's fire. Use this top-level integrated test suite for any Angular application.

Add and configure Stylelint. Then automate Stylelint workflows in your Nx workspace.

How to set up a new Nx workspace using angular-eslint or migrate an existing Nx workspace from ESLint or TSLint.

Our guest tells us about mutation testing, how Stryker came to be and how Stryker improves performance with mutation switching and coverage analysis.

I founded the This is Learning publication. Free, open and honest software education. Inclusive software development publication free from conflict of interest. This publication is all about sharing software development knowledge for free and not at all about money or KPIs. Cross-posts are welcome.

I founded the This is Angular publication. Free, open and honest Angular education. Inclusive Angular publication free from conflict of interest. This publication is all about sharing Angular knowledge for free and not at all about money or KPIs. Cross-posts are welcome. Part of This is Learning.

Part 3 of a series about structuring Nx workspaces.

Angular versions action is a GitHub Action that can replace versions of Angular and its related dependencies in a GitHub workflow. This is useful to ensure end-to-end compatibility between multiple major versions of Angular. We use this for the Lumberjack logging library for Angular. I'm one of the maintainers of Angular versions action.

Part 2 of a series about structuring Nx workspaces.

Our guest tells us about his full-stack framework for rapid application development called Nawah. Its philosophy is that configuration gets us 80% of the way.

Part 1 of a series about structuring an Nx workspace.

We learn how to reason about style binding evaluation through style binding precedence rules with simple examples sprinkled with a few style binding caveats. We end this topic by reviewing a demo application to visualize Angular Ivy's style evaluation. After that, we learn how to enable and configure strict template type checking. We see examples of all violations and how they appear inline in our code editor as well as during compilation. Finally, we learn how to use strict template type checks with the AsyncPipe.

Learn how to test route guards in isolated unit tests. Also learn how to test route guards in practice with RouterTestingModule.

Lars stops in for his second ZLS appearance to talk Deno and to do live pair-programming on some simple server stuff in Deno.

Lars Gyrup Brink Nielsen, from inDepthDev​ and The Deep Dive Dev Podcast joins to talk reactive programming, UX versus Data engineering, NgRx Store and Component Store. We also share war stories of past glories and many other good things.

What's the state of reactivity in frontend frameworks in 2020? Our guests share what motivated them to create their own frameworks and which ideas drove their design and APIs.

Brandon Roberts and Lars Gyrup Brink Nielsen discuss the recently published official Angular Roadmap.

What's the experience like for a React developer to start developing Angular applications? What's it like coming from Angular to React? Which were the most difficult parts to learn? How are the frameworks different? A panel of guests share their experiences.

In the first episode, we have our guest Lars Gyrup Brink Nielsen talking about mono-repo in the frontend. We discuss the advantages of a monorepo, different solution and how Nx is different. We discussed: 1. What a monorepo os. 2. Difference between a monorepo and the single-project approach. 3. Different solutions like Lerna, Nx, and Angular monorepos. 4. How Nx is different. 5. The shell library patterns.

Builders and schematics originally came from the Angular CLI, but can be used outside of Angular project, for example as plugins to the Nx CLI. Santosh Yadav tells us about his experience with creating builders and how they are related to schematics and Nx plugins.

In this episode, we bust myths about Angular's AsyncPipe. To understand the limitations of the AsyncPipe, we have to discuss change detection, dirty checking, change detection strategies, view data structures, NgZone and the application tick. With this common understanding, we can talk about the limitations of AsyncPipe and advanced optimization techniques to address them. Michael Hladky tells Matt Vaughn and Lars Gyrup Brink Nielsen about coalescing and scheduling and how he created rendering strategies for these in his library, RxAngular.

Learn how to stub the ActivatedRoute for shallow routed component tests. Also learn to use the RouterTestingModule for integrated routed component tests.

Learn how to implement shallow and integrated routing component tests with the RouterTestingModule. Explore the Location service and its dependencies.

Learn how to extract presenters from presentational components. We discuss stateful and stateless presenters, component-to-presenter ratios and when to use a component or a pipe instead of a presenter.

In the final part of this tutorial, we create the seatmap data access, seat listing feature, shared buttons UI, and shared formatting utilities library. Finally, we compare our approach with the full Nx toolchain.

A quick introduction to the Deno CLI. It's a batteries included executable with everything you need to develop, lint, test, and run Deno code.

In Part 4 of this tutorial, we create the check-in data access and check-in feature shell libraries. We create the check-in desktop application, review and verify how much our tool automated and finally create the mobile check-in application.

In Part 3 of this tutorial, we create the passenger info and flight search feature libraries. We use the generate project tool to create the mobile booking application and its test project. Finally, we create a mobile version of the flight search component template.

In Part 2 of this tutorial, we'll set up our custom generate project tool and create the shared and booking data access libraries with NgRx. To honor the flow of dependencies, we extract a shared environments library.

In this step-by-step tutorial, we set up an Nx-style monorepo workspace with the Angular CLI. In this first part, we create an application project, an end-to-end test project, and a feature shell library.

Component and directive features will enable new architectural patterns for Angular applications. The features option gives us reusable logic without inheritance or classes so that we can mix multiple traits into our components and directives.

Presentational components encapsulate presentation and UI behaviour. They can be stateful or stateless and are connected to the application state through their data binding API.

Learn how to create and consume a custom component harness using Angular CDK. With a step-by-step case study, we run it in unit tests and end-to-end tests.

Extract workspace libraries to get tiny Angular application projects. We'll create assets, styles, and environments libraries for an Nx workspace. Step-by-step commands and instructions.

Quantum-entangled rubber duck debugging using real-life subjects. A theory by Michael Hladky.

AOT everywhere, dynamic globalisation, strict mode, Bazel, and much more.

AOT, faster tests, stronger types, and component harnesses.