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 wasn’t 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 book’s 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 developer’s 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:

The entire code repository is hosted on GitHub, so if you don’t 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 you’re like us, you don’t read books from front to back. If you’re really like us, you usually don’t read the Introduction at all. However, on the off chance that you will see this in time, here are a few suggestions:

  • You can skip Chapter 1 if you have already worked on AngularJS in the past.
  • Chapter 2 digs into ng-repeat and all the various ways you can use and optimize it.
  • Chapters 3, 7, 9, and 12 cover unit testing of controllers, services, filters, and directives, so if you want to know more about those, jump to those chapters directly.
  • Chapter 14 is where you want to jump to in case you are interested in end-to-end testing using Protractor.
  • Chapters 11 and 13 are essential if you really want to understand directives and leverage the power that it provides.
  • If you want to look at a full-fledged AngularJS application that uses routing, authorization, and more, check out the last example in Chapter 10.

This book uses AngularJS version 1.3.11 for all its code examples, and Karma version 0.12.28 for the unit tests.

Online Resources

The following resources are a great starting point for any AngularJS developer, and should be always available at your fingertips:

Conventions Used in This Book

The following typographical conventions are used in this book:

Italic
Indicates new terms, URLs, email addresses, filenames, and file extensions.
Constant width
Used for program listings, as well as within paragraphs to refer to program elements such as variable or function names, databases, data types, environment variables, statements, and keywords.
Constant width bold
Shows commands or other text that should be typed literally by the user.
Constant width italic
Shows text that should be replaced with user-supplied values or by values determined by context.

Tip

This element signifies a tip or suggestion.

Note

This element signifies a general note.

Warning

This element indicates a warning or caution.

Using Code Examples

Supplemental material (code examples, exercises, etc.) is available for download at https://github.com/shyamseshadri/angularjs-up-and-running.

This book is here to help you get your job done. In general, if example code is offered with this book, you may use it in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing a CD-ROM of examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation does require permission.

We appreciate, but do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: “AngularJS: Up and Running by Shyam Seshadri and Brad Green (O’Reilly). Copyright 2014 Shyam Seshadri and Brad Green, 978-1-491-90194-6.”

If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at .

Safari® Books Online

Note

Safari Books Online is an on-demand digital library that delivers expert content in both book and video form from the world’s leading authors in technology and business.

Technology professionals, software developers, web designers, and business and creative professionals use Safari Books Online as their primary resource for research, problem solving, learning, and certification training.

Safari Books Online offers a range of plans and pricing for enterprise, government, education, and individuals.

Members have access to thousands of books, training videos, and prepublication manuscripts in one fully searchable database from publishers like O’Reilly Media, Prentice Hall Professional, Addison-Wesley Professional, Microsoft Press, Sams, Que, Peachpit Press, Focal Press, Cisco Press, John Wiley & Sons, Syngress, Morgan Kaufmann, IBM Redbooks, Packt, Adobe Press, FT Press, Apress, Manning, New Riders, McGraw-Hill, Jones & Bartlett, Course Technology, and hundreds more. For more information about Safari Books Online, please visit us online.

How to Contact Us

Please address comments and questions concerning this book to the publisher:

O’Reilly Media, Inc.
1005 Gravenstein Highway North
Sebastopol, CA 95472
800-998-9938 (in the United States or Canada)
707-829-0515 (international or local)
707-829-0104 (fax)

We have a web page for this book, where we list errata, examples, and any additional information. You can access this page at http://bit.ly/angularjs-up.

To comment or ask technical questions about this book, send email to .

For more information about our books, courses, conferences, and news, see our website at http://www.oreilly.com.

Find us on Facebook: http://facebook.com/oreilly

Follow us on Twitter: http://twitter.com/oreillymedia

Watch us on YouTube: http://www.youtube.com/oreillymedia

Content Updates

April 2, 2015

  • Fixed all the errata reported so far.
  • Updated all the code examples for AngularJS 1.3 version.
  • Added a new section to Chapter 2 on the bind-once feature introduced in AngularJS 1.3.
  • Added a new section to Chapter 4 on the new ngMessages module, which describes how to handle errors in your forms in a cleaner, modular fashion.
  • Added a new section to Chapter 4 on ngModelOptions, which allows you to be more precise and performant with the ngModel directive.
  • Added a new section to Chapter 6 on working with the optional ngResource module.
  • Added a section to Chapter 7 on testing AngularJS services, which was not covered previously.
  • Updated Chapter 15 with some additional information and thoughts.

Acknowledgments

I’d like to thank Misko Hevery, Igor Minar, and the entire AngularJS team for building AngularJS, and for continuing to make it more awesome with every release (and thinking of hilarious release names such as curdling-stare, insomnia-induction, and tofu-animation, to name a few). I’d also like to thank my untiring reviewers, Brad Green, Brian Holt, Ross Dederer, and Jesse Palmer, who willingly waded through pages and pages multiple times and never missed a single detail. You guys are amazing.

I’d also like to thank my team at Fundoo Solutions (Abhiroop Patel, Pavan Jartarghar, Suryakant Sharma, and Amol Kedari) who helped me test all the code examples and give me feedback on the order in which I introduced content.

Finally, I don’t think this book would have happened without my mom, dad, and grandmom, who ensured that I was well-fed, caffeinated at the right times, and motivated to sit and write for long stretches. And this book would definitely not have finished on time without the support of my loving wife, Sanchita, who was a great sport and didn’t complain while I typed away at this book during our wedding and honeymoon!

And finally, thank you to the amazing AngularJS community for all their contributions, feedback, and support, and for teaching us how to use and make it better.

Get AngularJS: Up and Running now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial