Book Review: Responsive Web Design with AngularJS

This is the 2nd in my series of book reviews (my previous post was the 1st book review, also an AngularJS book). This time I am reviewing another newly released book: Responsive Web Design with AngularJS by Sandeep Kumar Patel. And like the first review, this isn’t a book I can make myself recommend (sorry!).

I was looking forward to seeing what this book had to offer. Since moving from being a java developer to a front-end developer 2 years ago, I’ve spent most of my time programming JavaScript, and not enough learning css & responsive design (which is one reason I’ve started this review series, as I plan to include design books in my reviews). I also wondered, having used AngularJS a lot, what I could have missed in regards to it supporting responsive design. So when I saw a book called Responsive Web Design with AngularJS, I had to check it out.

The book is short, just 5 chapters, and only 3 of them really focus on the topic of responsive design. Below are some thoughts about each chapter.

-Chapter 1: Introduction to Responsive Single Page Application and AngularJS

First, notice the small grammatical error in the chapter title. Those grammatical errors are littered throughout the book. Not a huge deal, but I do expect better editing from a professionally published book. And I thought some of the editing issues had an affect on the material. Moving on…there isn’t much to say about this chapter. The author describes the meaning of SPA, and gives a quick overview of the features of AngularJS. While obviously not a tutorial, the overview isn’t bad.

-Chapter 2: The AngularJS Dynamic Routing-Based Approach

I’m not sure about you, but my first thought was “what the heck does the Angular router have to do with responsive design”? Turns out (at least in my opinion) the answer is nothing. The author builds a service using $provider (why?) to determine the device type (tablet, mobile, desktop) based on width, then within the router, serves 1 of 3 templates. Thus there is a completely different template (and css file) for each of the 3 device types. While I’m fairly new to responsive design, this doesn’t sound like RD to me. Does it? My opinion on the book takes a hit…let’s see what happens in the next chapter.

-Chapter 3: The AngularJS Directive-Based Approach

This chapter begins by talking about the shortcomings of the approach from the previous chapter. Good. Though it makes we wonder why a chapter was devoted to the previous topic if it wasn’t a good approach. Just to have something to talk about maybe? Anyway, in this chapter, 3 custom directives are made: one for responsive images, responsive text, and responsive item lists. I’m honestly not sure the ideas in this chapter are any better. Each of the 3 directives has some duplicate code that is used to determine the device type. The directives attach a $watcher to the $window, listening for windowResize events. The code is listening for changes to the window’s width, so that it can change the layout of the page if needed. Seems a bit messy to me, and I don’t like having this device type logic in 3 separate places. Maybe this is a good idea, and those of you with more RD experience can correct me. But I don’t see my adopting ideas from this chapter, either.

-Chapter 4: The AngularJS-Based Breakpoints for Layout Manipulation

Again, maybe it’s my lack of RD knowledge, but the design in this chapter feels downright dirty (wrong) to me. Basically, the author sets up an event-based approach to setting breakpoints for changing the page’s layout. I won’t give away all the author’s tips, but basically a couple of watchers are set up this time, and when the width changes and drops below (or goes above) one of the pre-defined breakpoints, an event is broadcast. Then listeners for this event will catch it and modify the layout accordingly. Again, not something that feel’s right to me. This feels like an abuse of the pub/sub system.

-Chapter 5: Debugging and Testing Responsive Applications

This chapter had a promising title, but it was really just a collection of debugging tools and plugins you can use. There were some I had not heard of, which is good. But there isn’t really enough explanation into how to use any of them (though that info could easily be found on the website for most of the tools mentioned)

After reading this book, I don’t feel like I know any more about proper RD with Angular than I did before I read it. I guess I did learn a few ideas that I would NOT want to repeat in my applications, though. I believe my preference is to choose a CSS framework that will take care of most of the RD logic for me, so that I’m not littering my code with hard coded device widths and conditional logic. For those of you more experienced in RD than I am…what are you thoughts?

Also, I plan to read a proper Responsive Design book soon. Anyone have any recommendations? I would prefer something published in the last 12 months. My first thought is to read this one.

3 thoughts on “Book Review: Responsive Web Design with AngularJS

  1. Pingback: Book Review: Responsive Web Design with AngularJS - Reader

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s