typescript-action VS Angular

While learning about GitHub Actions, I came across the GitHub Actions Org, and they have a bunch of templates for building custom GitHub actions. So, I started searching for a template that has TypeScript support, ensuring type safety to write bug-free code. I found the typescript-action template that includes support for tests, linter, versioning, and more.

This is the template I used for my TypeScript action https://github.com/actions/typescript-action

I found the GitHub actions documentation easier to read than Azure, so I would recommend starting writing and testing your extensions on GitHub by using the official template actions/typescript-action. The mentioned template provides a good starting point; I won't repeat the steps here. Play with it, write some simple stuff, and then return here for the next steps.

GitHub maintain a set of repos called actions. One of which is called cache.

To get started quickly with a JavaScript action, I recommend using the official templates from GitHub for JavaScript and TypeScript.

On the TypeScript side, setup was much easier. There was already a template from GitHub that took care of the basics. Most of the time spent here was updating dependencies and getting my editor to play nicely with it—18 minutes, about 10% of the total.

Now that you know how to create your own GitHub Actions, why not give it a try? Head to the GitHub Marketplace and start exploring the existing Actions, or create your own and share it with the community. With GitHub Actions, the possibilities are endless, so start building and see what you can accomplish

Your build most likely fails because your tests fail. Most CI pipelines today, like Jenkins, Circleci, GitLab, TeamCity, Bamboo, and GitHub Actions, are configured to automatically cause the build process to fail when tests fail.

/** * https://github.com/angular/angular/blob/75a186e321cb417685b2f13e9961906fc0aed36c/packages/core/src/render3/reactivity/untracked.ts#L15 * * packages/core/src/render3/reactivity/untracked.ts * **/ export function untracked(nonReactiveReadsFn: () => T): T { const prevConsumer = setActiveConsumer(null); try { return nonReactiveReadsFn(); } finally { setActiveConsumer(prevConsumer); } }

source: https://github.com/angular/angular/issues/46542

Besides the dangers, mentioned by Angular docs (infinite loops, change detection errors), there is another thing, that might be quite nasty: effects are executed in a reactive context, and any code you call in effect, will be executed in a reactive context. If that code reads some signals, they will be added as dependencies to your effect. Here Alex Rickabaugh explains the details.

In June 2023, the Angular team raised a new RFC to implement control flow syntaxes within Angular. They gave the following rationale for introducing control flow syntax:

For scheduling, I use awesome code I found in the Angular source code.

Just to give you more context, I led the migration of several AngularJS applications to the newer Angular Framework. My client finally decided to make that move following the AngularJS deprecation announcement (stay up to date please 🙏)️.

Link — angular/CONTRIBUTING.md

Angular v17 was released some months ago with a ton of new features, a brand new logo and the new blog angular.dev.