When you create a component using Angular CLI
ng generate component command, it creates spec file which uses TestBed. It means that for every created component I have to manually change it to use shallow-render. And if a project has dozens or hundreds of components the amount wasted time on this manual work is huge.
StackOverflow is an amazing resource, every developer is using it every day. Moreover, it can motivate to learn something new. I’ve recently found a question: Meaning of NgRx createAction method’s return type signature. It sparked my interest as I was using action creators for quite a while but was never eager to understand how they actually work.
Those who worked with NgRx before version 8 were used to create actions in the following way:
I’m going to use Angular example, however the scenario is applicable for any other framework.
Let’s say we have a service:
To test this service with Jasmine you would usually write a setup code similar to this:
The first problem is on line 3:
let http: any . …
I’m sure that many of you, who are reading this post, had the situation: you have a great sunny morning, birds are singing, you come to the office, pull the latest from the master and application is broken and that’s it — your morning is ruined 😡.
There is a great tool to eliminate this problem — husky. Husky makes adding git hooks as easy as it can be.
Hooks are programs you can place in a hooks directory to trigger actions at certain points in git’s execution. — from git documentation.
With husky you just need to provide a…
Decorators in the TypeScript is very powerful concept. They provide a way to apply Aspect Oriented Programming to your Angular application. They allow to extract cross-cutting concerns and apply them without modifying the existing code.
Basically a decorator is just a function which allows to execute a piece of code before and/or after the target function. Netanel Basal has a very good article explaining the basics of the decorators. In this short post I’d like to show another example where decorators could be useful.
The use case. We had an existing REST API, that accepts dates as strings in the…
As my background is C#, there was something missing in TypeScript (or at least I didn’t know how to do) - extension methods.
Extension methods enable you to “add” methods to existing types without creating a new derived type, recompiling, or otherwise modifying the original type.
Let’s image you have an Angular application with many calls to api using HttpClient which uses RxJs and returns Observable. Most of the calls will have the same structure: you handle success and error responses in subscribe method:
response => ... handle success,
err => // handle error
Wouldn’t it be…
Recently whilst working on a project, I came across a problem — how to implement the use of multiple check boxes in a form?
The requirements were the following:
If you want to skip the explanation, you can play with the code straight away in stackblitz.
Idea - we should create a group component which holds ngModel or formControlName and then children components (checkboxes), which update the group component’s value. …
Full Stack developer.