I finally got around to deploying the AngularJS version of omregn.nu.
Omregn.nu is a web app for converting units. The web app exists in an extremely crowded space and is by no means anything new. Omregn.nu has one thing going for it though, it’s mobile friendly.
However, all of that doesn’t matter; the main purpose of omregn.nu has been to learn AngularJS and routing by AngularJS.
Refactoring from jQuery to AngularJS
The first version of omregn.nu was written in jQuery using a classic paradigm:
- Change in input field causes
- JavaScript to calculate resulting values and
- jQuery updates the frontend.
Basic and event driven.
I wanted to do more though, and I’ve been wanting to work with routing and canonical urls for a while. Enter routing with AngularJS and a head-first dive into thinking in MWC.
The model is king
With AngularJS, I needed to get rid of all the event hooks, thinking differently about where values come from. With AngularJS, the model, the M in MWC, is king. You have to focus on updating the model and just make the frontend follow suit.
I also had to get into routing and the intricacies of ngRoute, keeping the url-bar and to current unit and value into sync. My hope is that at some point, it’s going to become SEO awesome.
Deep SEO
Check this out:
This is Google hitting deep and dynamic content – score!
I am definitely going to work further on this – preferably hitting the Knowledge Graph with a vengeance at some point. I don’t think I could have done this without AngularJS routing.
Hit me at @mocdotcom if you have any questions.