AngularJS: Up and Running
Shyam Seshadri
Brad Green
Introduction
I remember the very first time I was introduced to AngularJS. It was called Angular, and it was an open source library built as a hobby by one of my fellow engineers, Misko. At that point, we had spent months struggling to develop Google Feedback (the project we were developing) in an efficient and maintainable manner. We had written over 18,000 lines of code, a lot of which were untested, and were frustrated with our inability to continue adding features quickly. Misko Hevery, the engineer I mentioned, made a bold statement that he could reproduce everything we had developed in the past six months within two weeks. I should mention that we were all Java engineers at that point, with a complete lack of JavaScript knowledge.
After what we expected to be an entertaining two weeks of watching Misko struggle, scramble, and fail, it wasnt done. But one more week later, he had replicated what took us six months. What had been an 18,000-line codebase had dropped to a mere 1,500 lines, and almost every single piece of functionality was modular, reusable, and testable. Misko was on to something!
Brad Green, this books coauthor, saw the beginning of something amazing there, and decided with Misko to build a team around the core idea of making it simple to build web applications. Google Feedback, which I was leading, became the first project to ship with AngularJS, and really helped us understand what was important from a web developers perspective in a JavaScript framework.
What started as a side project quickly took off into one of the leading JavaScript frameworks (or meta-framework, as I call it) on the Web. There are a lot of reasons why AngularJS is awesome, and a super community of helpful developers and contributors is just one of them. The more recent releases have all incorporated features from the open source community around AngularJS. Thousands of developers rely on AngularJS daily, and thousands more start using it every month. And each developer makes AngularJS better through his or her experience.
I am excited to present this book, and look forward to learning from your experiences.
Who Should Read This Book
This book is for anyone who is looking to get started with AngularJS, whether as a side project, as an additional tool, or for their main work. It is expected that readers are comfortable with JavaScript before starting this book, but a basic knowledge of JavaScript should be sufficient to learn AngularJS. The book will cover everything from getting started with AngularJS, to advanced concepts like directives. We will take it step by step, so relax and have fun learning with us.
Why We Wrote This Book
When we wrote the first book on AngularJS, there was no easy way to learn it. The documentation was (and still is to some extent) confusing. With this book, the aim is to present a step-by-step guide on getting started with AngularJS. AngularJS is layered, with some very simple and powerful concepts, and some advanced and hard-to-get features. This book aims to walk developers through each of these in an organized, step-wise fashion, adding complexity bit by bit.
At the end of the book, you should be able to quickly get started with an AngularJS project, and really understand how to develop large, maintainable, and performant applications.
A Word on Web Application Development Today
JavaScript has come a long way from being just a scripting language (or hack, as it was affectionately called) that was only used to do minor validations to becoming a full-fledged programming language. jQuery did a lot of ground work in ensuring browser compatibility and giving a solid, stable API to work across all browsers and interact with the DOM. As applications grew in complexity and size, jQuery, which is a DOM manipulation layer, became insufficient by itself to provide a solid, modular, testable, and easily understandable framework for developing applications. Each jQuery project would look completely different from another.
AngularJS (and quite a lot of other MVC frameworks for JavaScript) tackles this very problem of providing a layer on top of jQuery, and on top of the DOM, to think in terms of application structure and maintainability, while reducing the amount of boilerplate code you would end up writing. The best part about using a framework in a consistent manner is that a new developer coming in has a sense of the structure, the layout, and how to develop right off the bat. We want a framework where we can spend time worrying about our look and feel, and our core functionality, without having to worry about the boilerplate and cruft.
Some of the concepts that are currently at the center of web application development and thus also at the core of AngularJS are:
- Data-driven programming, where the aim is to manipulate the model, and let the framework do the heavy lifting and UI rendering.
- Declarative programming, which entails declaring your intent when you are performing an action, instead of imperative programming, where the actual work is performed in a separate file/function and not where the effect is needed.
- Modularity and separation of concerns, which is the ability to separate your application into smaller, reusable functional pieces, each responsible for one and only one thing.
- Testability, so that we can ensure that what we as developers write actually does what it is supposed to.
- And much more.
With the help of frameworks like AngularJS, we can focus on developing amazing New Age web applications with immense complexity in a manageable and maintainable fashion.
Navigating This Book
This book aims to walk a developer through each part of AngularJS, step by step. Each chapter that introduces a new concept will be immediately followed by a chapter on how we can unit test it. The book is roughly organized as follows:
- , is an introduction to AngularJS as well as the concepts behind it. It also covers what it takes to start writing an AngularJS application.
- , starts introducing some built-in AngularJS directives, and the concept of controllers.
- , digs into unit testing AngularJS projects with Karma and Jasmine.
- , covers forms and how best to leverage AngularJS when working with them.
- , introduces the concept of AngularJS services, some common built-in AngularJS services, and how to create your own.
- , involves server communication in AngularJS using
$http
and advanced $http
concepts like interceptors and transformers. - , then digs into unit testing of services and mocking server requests using
$httpBackend
. - , introduce AngularJS filters as well as how to unit test them.
- , covers routing in an SPA using the optional
ngRoute
module. - , introduces some basic concepts of directives and how to create them.
- , covers unit testing of directives.
- , involves advanced directive creation concepts like compile, transclusion, controllers, and require. It also provides some examples of third-party widget integration as a directive.
- , covers end-to-end testing of an AngularJS application using Protractor and WebDriver.
- , brings everything together into best practices, guidelines, and useful tools.
The entire code repository is hosted on GitHub, so if you dont want to type in the code examples from this book, or want to ensure that you are looking at the latest and greatest code examples, do visit the repository and grab the contents.
If youre like us, you dont read books from front to back. If youre really like us, you usually dont read the Introduction at all. However, on the off chance that you will see this in time, here are a few suggestions: