Professional AngularJS

A comprehensive guide to AngularJS, Google's open-source client-side framework for app development.

Most of the existing guides to AngularJS struggle to provide simple and understandable explanations for more advanced concepts. As a result, some developers who understand all the basic concepts of AngularJS struggle when it comes to building more complex real-world applications. Professional AngularJS provides a thorough understanding of AngularJS, covering everything from basic concepts, such as directives and data binding, to more advanced concepts like transclusion, build systems, and automated integration testing. In addition to explaining the features of AngularJS, this book distills real-world experience on how these features fit together to enable teams to work together more effectively in building extraordinary apps.

• Offers a more thorough and comprehensive approach to AngularJS
• Includes pointers to other advanced topics
• Lets you build a simple application from scratch, explaining basic building blocks along the way for quick hands-on learning

INTRODUCTION xxv

CHAPTER 1: BUILDING A SIMPLE ANGULARJS APPLICATION 1

What You Are Building 1

What You Will Learn 3

Step 1: Scaffolding Your Project with Yeoman 4

Step 2: Creating Watchlists 9

Step 3: Configuring Client-Side Routing 19

Step 4: Creating a Navigation Bar 23

Step 5: Adding Stocks 26

Step 6: Integrating with Yahoo Finance 32

Step 7: Creating the Stock Table 36

Step 8: Inline Form Editing 40

Step 9: Formatting Currency 44

Step 10: Animating Price Changes 46

Step 11: Creating the Dashboard 49

Production Deployment 53

CHAPTER 2: INTELLIGENT WORKFLOW AND BUILD TOOLS 57

What Can Tooling Do for Me? 57

What Is Bower? 58

What Is Grunt? 60

What Is Gulp? 73

What Is Yeoman? 84

CHAPTER 3: ARCHITECTURE 95

Why Is Architecture Important? 95

Controllers, Services, and Directives 96

The ModelService Paradigm 102

Exposing API Using Controllers 108

Organizing Your Code with Modules 109

Directory Structure 113

Best Practices for Structuring User Authentication 127

CHAPTER 4: DATA BINDING 131

What Is Data Binding? 131

What Data Binding Can Do for You 134

CHAPTER 5: DIRECTIVES 157

What Is a Directive? 157

A Deeper Understanding of Directives 167

Changing Directive Templates at Runtime 179

CHAPTER 6: TEMPLATES, LOCATION, AND ROUTING 185

Part I: Templates 187

Part II: The $location Service 196

Part III: Routing 200

CHAPTER 7: SERVICES, FACTORIES, AND PROVIDERS 217

A Brief Overview of Dependency Injection 218

Building Your Own Services 221

Common Use Cases for Services 232

Utilizing Built-In Providers 236

CHAPTER 8: SERVER COMMUNICATION 243

Why Will I Learn? 243

Introduction to Promises 244

Services for HTTP Requests 246

Consuming the Twitter REST API 262

Scaffolding a REST API with StrongLoop LoopBack 264

Using Web Sockets with AngularJS 270

Using Firebase with AngularJS 273

CHAPTER 9: TESTING AND DEBUGGING ANGULARJS APPLICATIONS 277

AngularJS Testing Philosophy 277

DOM Integration Tests 292

Debugging AngularJS Apps 309

CHAPTER 10: MOVING ON 315

Using Angular-UI Bootstrap 316

Hybrid Mobile Apps with the Ionic Framework 325

Integrating Open Source JavaScript with AngularJS 331

AngularJS and ECMAScript 6 341

Conclusion 343

APPENDIX: RESOURCES 345

INDEX 347

About the authors

Valeri Karpov is a NodeJS Engineer for MongoDB and maintains numerous MongoDB-related open-source JavaScript modules. He's been developing AngularJS applications since 2010, including MongoDB's internal continuous integration framework and BookaLokal's mobile site.

Diego Netto is a software consultant and open source evangelist. Founder of an independent consultancy agency, Diego helps startups and enterprise companies leverage the power of open source technologies to deliver intuitive products.

Visit us at wrox.com where you have access to free code samples, Programmer to Programmer forums, and discussions on the latest happenings in the industry from around the world.

Your comprehensive guide to coding complex apps with AngularJS

It's an exciting time to be a web developer—and JavaScript language skills are in very high demand. AngularJS is quickly becoming the leading next-generation client-side web framework, enabling individuals, small teams, and large corporations to build and test phenomenally sophisticated browser-based applications.

Professional AngularJS covers everything from building your first AngularJs application to more advanced topics, like transclusion, build systems, and automated integration testing. If you have basic programming knowledge and want to write web apps that display complex data in a browser UI or mobile web apps that are fast and effectively mimic native applications, this is the indispensable guide you'll turn to again and again.

Professional AngularJS:

• Lets you build a simple application, www.stockdog.io, from scratch explaining basic building blocks along the way for quick and easy hands-on learning
• Takes a close look at advanced ways of binding data to templates in AngularJS
• Explains AngularJS architecture and demonstrates how it fits together
• Details the difference between services, factories, and providers—and tells you when to use what
• Covers the techniques available for testing and debugging AngularJS applications
• Demonstrates many popular tools used with AngularJS including Yeoman, RequireJS, Browserify, Mocha, Jasmine, Bootstrap, Ionic, Moment, and Mongoose.