This week felt like an Angular roller-coaster. In the end, I seem to be able to make Angular apps, but I definitely still don’t understand Angular.
There are at least four different reasons for this situation: prerequisite expectations, inconsistent documentation, instructional style, and an off-week for my brain.
For those that have read my previous posts, I’m finally starting to link to the projects that I’ve completed. This week’s post and my week one post have a results section at the very end that highlights and links to these projects. I should have week two and week three done next weekend.
I could while away the hours
conferrin’ with the flowers
consultin’ with the rain
And my head I’d be scratchin’
While my thoughts were busy hatchin’
If I only had a brain.
Learning Angular
Prerequisite Expectations
I had a really hard time this week just wrapping my mind around the basics. If you’ve read my previous entries, you know my tendency is to try to fill in the gaps on my own. So when the initial readings failed to bring any light, yet alone enlightment, I went in search of other resources.
The vast majority of Angular resources expect the user to have significantly more JavaScript or jQuery front end experience then I, or my bootcamp peers, have. There are so many examples contrasting how something would be done in either vanilla JS or jQuery and focusing on the differences between those examples and how the same task is done in Angular. But noobs just don’t have enough experience in either to really grok the differences. Strangly, a lot of these resources just never really explain the Angular code.
One exception was the Code School course “Shaping up with Angular.JS“. Unfortunately, even in that course, when the topic of Promises was introduced it was promptly mentioned that they’re jQuery-like and if the student isn’t familiar with jQuery Promises then the student should go do the Code School jQuery course that includes a level on Promises.
Inconsistent/Incomplete Documentation
So far, I’ve been able to grok most JavaScript and jQuery documentation, but I’m finding that when I need Angular documentation, I find it lacking.
A great example was for an assignment in which we were supposed to add support for cookies. I spent many hours trying to add cookie support to my quotes project, but no matter what I did, I couldn’t get it to work. When I mentioned it to our instructor at the next class, I was told that it was because my html page is a static webpage, in other words, that the page needed to be coming from a server. In all of the resources that I went through, I don’t remember that being mentioned even once!
(Of course, the assignment should not have included cookie functionality if we were not realistically capable of including it.)
Instructional Style
By and large, I’m normally a pretty quick study. Sometimes, if something’s presented in a detailed way, I need to find an alternate presentation at the 30,000 ft level; and sometimes, if something’s presented from the high-level conceptual perspective, then I need to find an alternate presentation at the detail level. But typically, I pick stuff up pretty quickly, or am able to quickly find the appropriate auxiliary resources to fill in the gaps.
But not with Angular! With Angular I’m finding that I really need to be on a vomit comet, moving rapidly between details and a high-level conceptual perspective.
Unfortunately, most resources I’ve found haven’t gone back and forth between the detailed and high-level.
The end result is that I’ve become oddly proficient, but without really understanding what I’m doing or why I’m doing it.
Off-week
To make matters worse, my brain just seemed to be having an off week. Things that I stared at earlier in the week and completely missed have been jumping out at me today.
For example, one of the things that cost me a lot of time when I was trying to make cookies work, was whether or not I was supposed to have an angular-cookies.js file. In looking at the official documentation today, both the $cookies and $cookieStore documentation include the statement, “Requires the ngCookies
module to be installed.” To make matters worse, the ngCookies documentation actually starts off by showing how to include the “angular-cookies.js file in the html and where to get the file. How the heck did I miss those!!!
Clearly, my brain wasn’t working anywhere close to its normal levels. At this point, my brain seems to have returned to normal operational parameters; (and not to mix too many analogies, but) I’m really hoping my brain stays in gear this week!
Results
Based on my understanding of what was presented this week, it strikes me more like Angular uses a “model-service-controller-view” approach (as opposed to the espoused MVC approach); I’ve seen Angular refereed to as the MVW (aka Model-View-Whatever) approach, and this definitely seems more accurate than calling it MVC.
- “The facebook Friend Machine”
: A static, facebook-like, listing of friends, with various search capabilities. - Quote Book
: A listing of quotes that can be filtered. New quotes can be also added and old quotes removed; but only until refresh. (This is the assignment that I couldn’t upgrade to support cookies.) - Week 4 Assessment - To Do Page
: Just a basic page that shows tasks. New tasks can be added and existing tasks can be marked complete. We still haven’t addressed cookie or local storage, but should cover them next week. This should make this and the quotes page more useful.