Angular today: a Progressive Web App in 2 minutes
npm install @angular/cli -g
ng new myapp --routing
ng add @angular/pwa
ng build --prod
That’s it. You have a real web app, working offline.
You also have out of the box (non-exhaustive list):
- a full development environment, without configuration needed,
- an ultra optimized production bundle, without configuration needed,
- an e2e & unit tests environment, without configuration needed,
- all what you need to create an app: components, dependency injection, routing, AJAX, state management, and so on, all in an official and homogeneous API.
ng add @angular/material
and you now have official and ready-to-use UI components.
Still think Angular is too complex?
Let’s be honest: there were some issues contributing to this idea.
As Google chose to keep the same name from version 1, we had first to speak about Angular 2 to discern versions. So now, many people don’t understand why Angular 6is already released.
But wait : what is the version of React? 16. Does anyone worry about this? No. It’s just how semantic versionning works.
So now it’s just Angular, and upgrades from Angular 2 to 4, and from Angular 4 to 5 are ultra smooth and usually just take a few minutes, as in any other framework. And since Angular 6, migrations are fully automated.
Other frameworks are lying to you
The idea that other frameworks are easier than Angular is built on a false promise: they just show you a small part of the whole picture. But you won’t get a real app with only what they present to you first.
Angular is honest : it includes all what you’ll need to do an app. And nothing is superfluous.
Vue.js is the better example of this. It’s presented as super easy as you would just have to do this:
Great. Does one, or even multiple components are an app? No.
You’ll need routing, dependency injection, AJAX and so on. As an app can’t tolerate any error (or it will crash), you’ll also need a tool to avoid errors (like TypeScript). You’ll also have hundred of components, so you’ll have to organize with oriented object programmation.
So let’s look at a real world Vue.js example:
Looks familiar? Yes, it’s exactly like Angular. In fact, Angular syntax is a little easier.
Same goes for React:
Is it an app? No. Do you think Facebook is built with React only? No.
You’ll need routing, dependency injection, AJAX and so on. And contrary to Vue.js and Angular, they are not included. You’ll have to find other libraries by yourself.
You’ll also need state management. And here goes Redux. At that point, React is not easy anymore. In fact, it’s far more complex to manage this problem in React than in Angular.
And you’ll have to put together and configure all of this by yourself.
So, definitively : no, React is not easier than Angular.
Modern and efficient tools in Angular
In this real world perspective, I’m even telling that Angular is easier than other frameworks.
Why? Because of the modern tooling choices Angular has made: ES6+, TypeScript and RxJS. These tools are all here for a good reason.
Welcome to PHP, Java and C# developers
Finally, the most important point: because of these tools, Angular is very similar to Java, C# or OOP PHP:
It is really easier for PHP / Java / C# developers to switch to Angular than to switch to React.
And it’s just the beginning: as software is switching to web, and as more and more websites and native apps are switching to Progressive Web Apps, there will be a huge wave of developers coming from another world.
One advantage of other frameworks like React or Vue.js is when you don’t have to create a full app but just some components.
Warning and conclusion
Like any post looking like “Framework A vs. framework B”, I suppose it will provoke an intense debate and strong reactions from people who prefer another framework, but I won’t answser to such comments. This post is not here to tell “X is better than Y”. Each tool has a different approach with advantages and disadvantages. Each person contributing to any project does a great job. That’s not the point.
For a practical demonstration, I’ve written a second post, “Angular is easy — Part 2: the demonstration”, where I show how to build a Progressive Web App with Angular in only 5 minutes and 10 steps.
By the same author
- Angular schematics extension for Visual Studio Code : graphic interface for Angular CLI commands
- @ngx-pwa/local-storage: Angular library for local storage
- typescript-strictly-typed: strict config for TypeScript and ESLint/TSLint
- Other popular Angular posts on Medium
- Follow me on Twitter
- Angular onsite trainings (based in Paris, so the website is in French, but my English bio is here and I’m open to travel)
Note for trolls: I don’t promote Angular because it’s my job, I could do React courses too, but I choose not to do it after testing both. ;)