It struck me how painful experience it was to test an Angular app. And then I realized it can be painless with Jest.
WebStorm is a great tool for building Angular applications. One of its useful features is running tests right in the IDE. In this blog post I’ll show you how to do it.
I’ve worked with Angular.js for a few years and despite the widespread criticism I think this is a fantastic framework. I’ve started with a great book Building your own Angular.js and read most of the framework’s source code. So I want to believe I have a solid knowledge of the Angular.js inner workings and a good grasp of the ideas used to built the framework. Now, I’m trying to get to the same level of understanding with the newer Angular and map the ideas between the versions. What I’ve found is that contrary to what is usually claimed on the internet Angular borrows many ideas from its predecessor.
Angular has many features that allow us to configure apps to be as fast and high preforming as possible. One of the critical features that enable responsive fast Angular apps is the ability to lazy load code with the Angular Router. This allows our initial bundles to remain small ensuring faster downloads and start up times for our app.
The Angular router has the amazing ability to load code on demand as the user routes between views on our apps. By splitting our features into stand alone Angular Modules we can lazy load the module when the user clicks the link to navigate to this feature.
Since angular 2 brought Rxjs as embedded library, it automatically moved Rxjs to mainstream. However Rxjs is fantastic and very powerful library, there is a trade-of related to that. Rxjs is not super new concept. I have seen it couple of years ago in C# community. It raised up, as some hyped library for data flows and then moved into shadow. I was reading about that and listen a lot conferences, because a lot of people were talking about that, at these times. Eventually I never really used it in real scenario. It was one of these libraries to show on presentation, to make wow effect. It shines when you are developing some ETL or building up “typeahead” like control. However it’s really hard to find some reasonable usage of that library. You need to be familiar with some functional language, unidirectional data-flow and reactive programming concepts to use it properly for your architecture.
Many organizations have large AngularJS 1.x applications deployed to production. These applications may be built by multiple teams from different lines of business. They may use different routers and state management strategies. Rewriting such applications all at once, or big bang migrations, is not just impractical, it is often impossible, and mainly for business reasons. We need to do gradually, and this is what this series of articles is about.
This post assumes that you at least have some working knowledge of Angular and Decorators.
If you have no prior knowledge on the subject, you can read the following articles:
- Make your Code Cleaner with Decorators
- Automagically Unsubscribe in Angular
- Decorators & metadata reflection in TypeScript: From Novice to Expert
This will be a short blog post, because there are not a lot of new features…
The most part of the work has been done on the official docs, which are now an Angular CLI app, and this migration takes some time. We can then expect to have nice new content when this will be done.
So, what are the new features? Let’s dive in!