| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | block includes | 
					
						
							|  |  |  |   include ../_util-fns | 
					
						
							| 
									
										
										
										
											2015-08-08 13:55:53 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  | // #docregion intro | 
					
						
							|  |  |  | - var langName = current.path[1] == 'ts' ? 'TypeScript' : 'JavaScript' | 
					
						
							| 
									
										
										
										
											2015-12-21 06:30:36 -08:00
										 |  |  | figure | 
					
						
							|  |  |  |   img(src="/resources/images/devguide/intro/people.png" alt="Us" align="left" style="width:200px; margin-left:-40px;margin-right:10px" ) | 
					
						
							| 
									
										
										
										
											2015-11-28 20:43:09 -08:00
										 |  |  | :marked | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |   This is a practical guide to Angular for experienced programmers who | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  |   are building client applications in HTML and #{langName}. | 
					
						
							| 
									
										
										
										
											2016-01-18 00:32:36 -08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2015-11-28 20:43:09 -08:00
										 |  |  |   We are on a journey together to understand how Angular works and, more importantly, | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |   how to make it work for us.  This overview begins the journey. | 
					
						
							| 
									
										
										
										
											2015-11-28 20:43:09 -08:00
										 |  |  |   <br clear="all"> | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  | // #enddocregion intro | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | // #docregion how-to-read-1 | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  | <a id="learning-path"></a> | 
					
						
							| 
									
										
										
										
											2015-11-28 20:43:09 -08:00
										 |  |  | :marked | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |   # Organization | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |   The documentation is divided into major thematic sections, each | 
					
						
							|  |  |  |   a collection of chapters devoted to that theme. | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  | // #enddocregion how-to-read-1 | 
					
						
							|  |  |  | // #docregion how-to-read-2 | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  | - var top="vertical-align:top" | 
					
						
							|  |  |  | table(width="100%") | 
					
						
							|  |  |  |   col(width="15%") | 
					
						
							|  |  |  |   col | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |   tr(style=top) | 
					
						
							|  |  |  |     td <b>QuickStart</b> | 
					
						
							|  |  |  |     td | 
					
						
							|  |  |  |       :marked | 
					
						
							|  |  |  |         The foundation for every chapter and sample in this documentation. | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |   tr(style=top) | 
					
						
							|  |  |  |     td <b>Tutorial</b> | 
					
						
							|  |  |  |     td | 
					
						
							|  |  |  |       :marked | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |         A step-by-step, immersive approach to learning Angular that | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |         introduces the major features of Angular in an application context. | 
					
						
							|  |  |  |   tr(style=top) | 
					
						
							|  |  |  |     td <b>Basics</b> | 
					
						
							|  |  |  |     td | 
					
						
							|  |  |  |       :marked | 
					
						
							|  |  |  |         The essential ingredients of Angular development. | 
					
						
							|  |  |  |   tr(style=top) | 
					
						
							|  |  |  |     td <b>Developer Guide</b> | 
					
						
							|  |  |  |     td | 
					
						
							|  |  |  |       :marked | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |         In-depth analysis of Angular features and development practices. | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |   tr(style=top) | 
					
						
							|  |  |  |     td <b>Cookbook</b> | 
					
						
							|  |  |  |     td | 
					
						
							|  |  |  |       :marked | 
					
						
							|  |  |  |         Recipes for specific application challenges, mostly code snippets with a minimum of exposition. | 
					
						
							|  |  |  |   tr(style=top) | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |     td <b>API Reference</b> | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |     td | 
					
						
							|  |  |  |       :marked | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |         Authoritative details about each member of the Angular libraries. | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  | :marked | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |   # Learning path | 
					
						
							|  |  |  |   We don't have to read the guide straight through.  Most chapters stand on their own. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |   We recommend a learning path for those new to Angular. | 
					
						
							| 
									
										
										
										
											2016-03-06 15:12:22 +01:00
										 |  |  |   Most of that path runs through the *Basics* section: | 
					
						
							| 
									
										
										
										
											2015-12-11 15:37:35 -08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |   1. Read the [Architecture](architecture.html) overview to get the big picture. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |   1. Try the [QuickStart](../quickstart.html). The QuickStart is the "Hello, World" of Angular 2. | 
					
						
							|  |  |  |   It shows us how to set up the libraries and tools we'll need to write *any* Angular app. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |   1. Take the *Tour of Heroes* [Tutorial](../tutorial), which picks up from where the QuickStart leaves off | 
					
						
							|  |  |  |   and builds a simple data-driven app. | 
					
						
							| 
									
										
										
										
											2015-12-11 15:37:35 -08:00
										 |  |  |   Simple, yes, but with the essential characteristics we'd expect of a professional application: | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |   a sensible project structure, data binding, master/detail, services, dependency injection, navigation, and remote data access. | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |     Return to the *Basics* section and continue in the suggested order: | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2015-12-11 15:37:35 -08:00
										 |  |  |   1. [Displaying Data](displaying-data.html) explains how to get information on to the screen. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2015-12-11 15:37:35 -08:00
										 |  |  |   1. [User Input](user-input.html) covers the basics of responding to user behavior. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2015-12-11 15:37:35 -08:00
										 |  |  |   1. [Forms](forms.html) handle user data entry and validation within the UI. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2015-12-11 15:37:35 -08:00
										 |  |  |   1. [Dependency Injection](dependency-injection.html) is the way we build large, maintainable applications | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |   from small, single-purpose parts. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |   1. [Template Syntax](template-syntax.html) is a comprehensive study of Angular template HTML. | 
					
						
							| 
									
										
										
										
											2015-11-28 20:43:09 -08:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2015-12-11 15:37:35 -08:00
										 |  |  |   With this foundation, we can read and understand any chapter in the guide. | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  | // #enddocregion how-to-read-2 | 
					
						
							|  |  |  | // #docregion the-rest | 
					
						
							|  |  |  | :marked | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |   # Code samples | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |   Every chapter includes code snippets that we can reuse in our own applications. | 
					
						
							| 
									
										
										
										
											2016-01-18 00:32:36 -08:00
										 |  |  |   These snippets are excerpts from a sample application that accompanies the chapter. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							|  |  |  | block example-links | 
					
						
							|  |  |  |   :marked | 
					
						
							|  |  |  |     Look for a link to a running version of that sample near the top of each page, | 
					
						
							|  |  |  |     such as this [live example](/resources/live-examples/architecture/ts/plnkr.html) from the [Architecture](architecture.html) chapter. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     The link launches a browser-based code editor where we can inspect, modify, save, and download the code. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | :marked | 
					
						
							|  |  |  |   A few early chapters are written as tutorials and are clearly marked as such. | 
					
						
							|  |  |  |   Most chapters are *not* tutorials. | 
					
						
							| 
									
										
										
										
											2016-01-18 00:32:36 -08:00
										 |  |  |   They highlight key points in code rather than explain each step necessary to build the sample. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  |   We can always get the full source by way of the #{_liveLink}. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |   # Reference pages | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-01-18 00:32:36 -08:00
										 |  |  |   The [Cheat Sheet](cheatsheet.html) lists Angular syntax for common scenarios. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  |   The [Glossary](glossary.html) defines terms that Angular developers should know. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							|  |  |  |   The [API Reference](../api/) is the authority on every public-facing member of the Angular libraries. | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-02-05 23:27:06 -08:00
										 |  |  |   # Feedback | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-01-18 00:32:36 -08:00
										 |  |  |   We welcome feedback! Leave a comment by clicking the icon in upper right corner of the banner. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							|  |  |  |   Post *documentation* issues and pull requests on the | 
					
						
							| 
									
										
										
										
											2016-01-18 00:32:36 -08:00
										 |  |  |   [angular.io](https://github.com/angular/angular.io) github repository. | 
					
						
							| 
									
										
										
										
											2016-05-18 13:43:02 -07:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2016-01-18 00:32:36 -08:00
										 |  |  |   Post issues with *Angular 2 itself* to the [angular](https://github.com/angular/angular) github repository. | 
					
						
							| 
									
										
										
										
											2016-02-25 09:03:50 -08:00
										 |  |  | // #enddocregion the-rest |