Angular: Elephant in my room
Mar 31, 2016UPDATE: 2016-04-02
Learned some more and it turns out, the way you can think about components for your app in Angular 1.x is by splitting them into directives. Its a way to abstract what’s otherwise a generic html and js into a higher level which can be inserted to your page either as element, attribute, class or comment.
–
When I first encountered Angular, it wasn’t the most pleasant experience. Mainly because I needed to suddenly use it while in the middle of a project and between trying to meet the deadline and learning new technology, there just wasn’t enough time. The second encounter was when I ported a PhoneGap mobile app from Angular to React, this one went well as I’ve had more experiences with React.
Those two happened few years now so I’ve been meaning to explore Angular specially with 2.x already in beta which is more component oriented than 1.x. So over the last couple of days I’ve been refreshing and as always with new technology, the best way to learn is to experience it. So I’ve decided to port my Consul-UX project to Angular 1.5.x. And to my surprise, the React implementation took me every night for a week while it only took me few hours to port it to Angular. Given, I’ve already developed the mental model of how to organize things in the app, still, this is my very first complete Angular app! I even made my first Angular PR to the angular-tooltips project.
But, that’s not to say that one is better than the other. There are things that I missed from React while I was porting it while there are also places where Angular shines. For me, its just a matter of right technology for the right team and job, get your ego out of it! That said, here are the nice and not so nice things about Angular that I’ve experienced so far:
The good
- Its really fast to prototype since it integrates seamlessly with existing markup.
- Batteries included, it comes with a whole lot of utilities ranging from filters, localization, form validation to making ajax calls and whole lot more. You just really concentrate on the building the app.
- Angular puts it into perspective that React is just V in MVC, the more I worked on it the more I realized it really is a full-blown framework. Think of it as Rails or Django but for frontend.
- It comes with a set of opinions that covers your use-case 90% of the time. They did the thinking, so you don’t have to.
The somewhat bad
- Coming from React, I’ve developed this habit of thinking of an app as small pieces of components composed together. At least in Angular 1.5.x, this thinking gets in my way due to its higher level MVC structure. You think of a view and what controller handles it, though I have a feeling Angular 2.x will fix this. Or maybe I just don’t know enough yet.
- It feels magical at times, I’m used to having control over everything in the app while in Angular sometimes It gets magical. Again, maybe I just need more experience with it.
- Templates are still requested over the network, I wonder if webpack has some plugin for that.
- I missed the uni-directional data flow that Reflux offers, specially with Redux, I miss the series of events that occurred on my app.
- I don’t like that certain flow, conditions or formatting can happen in two places, the view and the controller. In React, JSX is part of the component so everything is in one place while on Angular I have to jump back and forth.
That’s it so far, again don’t be so religious about it. Learn to embrace each framework’s advantage and disadvantage, at the end of the day, these are just tools to get the job done. Don’t be afraid to always be learning, read books, watch videos, read code (specially the framework itself). I’m definitely going to be exploring Angular 2.x anytime soon, and will surely use Angular on a project.