How hard can Angular (4/5/6) be?
With 3 days of theory followed by a whole day of tutorials, I could finally come up with a basic version of my Angular 5 Application. It is a Simple Checklist in which you can add and delete your to-do’s , basically covering the CRUD operations.
AngularFire and AngularFirestore libraries do what they’re supposed to do and they just nail it! :)
Using Angular CLI was pretty easy and quite handy to generate files and I love how they have used the elements of Ember CLI (Oh, I love Ember.js!)
I even wrote an alias for building the app in production mode and for deploying it to Firebase (yeah, call me lazy!) and called it ngfireDeploy (ngf TAB + ENTER and boom!).
Oh! Did I mention I was building a PWA? I love PWA’s and I personally think they are going to outsmart the native apps. Talk about installable web applications, push notifications, offline persistence of data and more importantly a native app like feel bundled in smaller file sizes. What more could you ask for?
Have a look at my Lighthouse score below to know how I am “progressing” with my Progressive Web App ;)
Yes, I am working on the optimization part :) Going through this Udemy course to understand how the Browser consumes and parses the HTML, CSS and JS to finally paint those pixels. Does it not sound like magic? It did, for me before going through this course though!
Coming to data persistence, using the new Firestore queries were a breeze and relying on webpack to compile my SASS automatically was a real blessing. I am planning to use these more often now.
All in all, the learning curve for understanding the basic nitty gritties of Angular5 (and yes TypeScript) wasn’t that steep. May be this has to do with my familiarity with EmberJS.
As a bonus, I switched from Brackets to VS Code. Now I know why people use VS Code for Angular. :D (Although I have to admit, I did configure the keyboard shortcuts in VSCode to mimic that of Brackets.)
Few Fun Facts:
- Do you know LinkedIn uses EmberJS to fire up it’s UI?
- Turns out Angular CLI was directly borrowed “as-is” from Ember CLI. (Do not quote me on that, we already have enough framework wars! :P )
Anyway, have a look at my Simple Checklist app and let me know if there’s any feedback you want to provide or any suggestions you guys have to offer, to someone like me who has just begun his Angular Journey!
Till then, Keep Learning and Keep on Hacking! :) (DevTips Fan, anyone?)
PS: If this post was helpful to you, please leave a clap or two :)
Cheers!
