From d6f6fbb9218ca75596f62c12993032da391351d8 Mon Sep 17 00:00:00 2001 From: Kathy Walrath Date: Mon, 2 Mar 2015 14:46:31 -0800 Subject: [PATCH 1/4] copy of js docs --- public/docs/dart/latest/_data.json | 29 +++ public/docs/dart/latest/api.jade | 14 ++ public/docs/dart/latest/help.jade | 33 ++++ public/docs/dart/latest/index.jade | 30 +++ public/docs/dart/latest/quickstart.jade | 243 ++++++++++++++++++++++++ public/docs/dart/latest/resources.jade | 20 ++ 6 files changed, 369 insertions(+) create mode 100644 public/docs/dart/latest/_data.json create mode 100644 public/docs/dart/latest/api.jade create mode 100644 public/docs/dart/latest/help.jade create mode 100644 public/docs/dart/latest/index.jade create mode 100644 public/docs/dart/latest/quickstart.jade create mode 100644 public/docs/dart/latest/resources.jade diff --git a/public/docs/dart/latest/_data.json b/public/docs/dart/latest/_data.json new file mode 100644 index 0000000000..155fe09c17 --- /dev/null +++ b/public/docs/dart/latest/_data.json @@ -0,0 +1,29 @@ +{ + "index": { + "icon": "home", + "title": "Angular Docs", + "menuTitle": "Docs Home", + "banner": "Angular 2 is currently in Alpha Preview. We reccomend using Angular 1.X for production applications." + }, + + "quickstart": { + "icon": "query-builder", + "title": "5 Min Quickstart" + }, + + "resources": { + "icon": "play-circle-fill", + "title": "Angular Resources", + "banner": "Angular 2 is currently in Alpha Preview. For Angular 1.X Resources please visit Angularjs.org." + }, + + "api": { + "icon": "book", + "title": "API Proposal" + }, + + "help": { + "icon": "chat", + "title": "Help & Support" + } +} \ No newline at end of file diff --git a/public/docs/dart/latest/api.jade b/public/docs/dart/latest/api.jade new file mode 100644 index 0000000000..e652be232b --- /dev/null +++ b/public/docs/dart/latest/api.jade @@ -0,0 +1,14 @@ +.l-main-section + h2 Developer Preview + + p. + The Angular 2.0 API is currently in active development and not production ready. + This page will showcase a preview of proposed methods to help further the discussion + in the development community. + + .l-sub-section + h3 Angular 1.X for Production + p. + If you're building a production app today, please + use Angular 1.X. + These versions of Angular are production ready and available today. diff --git a/public/docs/dart/latest/help.jade b/public/docs/dart/latest/help.jade new file mode 100644 index 0000000000..2ad2430887 --- /dev/null +++ b/public/docs/dart/latest/help.jade @@ -0,0 +1,33 @@ +.l-main-section + h2 Get Help Using Angular + + p. + We have an incredible community of developers who are passionate about solving problems. + We reccomend some of the following methods to get help with Angular. + + + .l-sub-section + h3 Angular Google Group + + ul + li Search the archive first, it's likely that your question was already answered. + li To avoid the spam moderation queue, don't include code directly in your email. (See #3) + li Linking to a live code example that demonstrates your problem or question will get you an answer faster. Use this template. + li If you get help, help others. Good karma rulez! + + a(href="https://groups.google.com/forum/#!forum/angular" class="button button-primary" md-button) View the Google Group + + .l-sub-section + h3 Angular Chat Room + + p Talk in real time with other Angular developers. + + a(href="http://webchat.freenode.net/?channels=angularjs&uio=d4" class="button button-primary" md-button) View the Chat Room + + + .l-sub-section + h3 Report an Issue + + p If your run into an issue or have a feature request, you can create a new issue on our github repostitory. + + a(href="https://github.com/angular/angular.js/issues" class="button button-primary" md-button) Report an Issue diff --git a/public/docs/dart/latest/index.jade b/public/docs/dart/latest/index.jade new file mode 100644 index 0000000000..1e87776524 --- /dev/null +++ b/public/docs/dart/latest/index.jade @@ -0,0 +1,30 @@ + +div.c4 + md-card + md-card-content + h3.text-headline.text-uppercase Quickstart + p.text-body Learn in 5 minutes + + footer + a(href="/docs/#{current.path[1]}/#{current.path[2]}/quickstart.html" class="button" md-button) View Quickstart + + +div.c4 + md-card + md-card-content + h3.text-headline.text-uppercase Resources + p.text-body Preview of v2.0 + + footer + a(href="/docs/#{current.path[1]}/#{current.path[2]}/resources.html" class="button button-primary" md-button) View Resources + + +div.c4 + md-card + md-card-content + h3.text-headline.text-uppercase API Preview + p.text-body Proposal for v2.0 API + + footer + a(href="/docs/#{current.path[1]}/#{current.path[2]}/api.html" class="button" md-button) View API + diff --git a/public/docs/dart/latest/quickstart.jade b/public/docs/dart/latest/quickstart.jade new file mode 100644 index 0000000000..6deedf14fe --- /dev/null +++ b/public/docs/dart/latest/quickstart.jade @@ -0,0 +1,243 @@ +// STEP 1 - Install Angular ########################## +.l-main-section + h2#section-install-angular 1. Install Angular + + p. + Angular is still unpackaged and in alpha. This quickstart does not + reflect the final build process for Angular. The following setup is for those who + want to try out Angular while it is in alpha. + + p. + For the sake of this quickstart we recommend using the + es6-shim GitHub repository. + This repository will provide a faster start. es6-shim includes Angular and dependencies to compile ES6 in incompatible browsers. + + p Clone the repository inside of aleady existing project. + + pre.prettyprint.linenums + code git clone https://github.com/davideast/concious.git es6-shim + + .l-sub-section + h3 A word on ES6 + p. + Angular builds on top of ES6, the new specification of the JavaScript language. + Not all ES6 features are available in all browsers. The following es6-shim + repository allows you to use ES6 in the browser today. + + p. + Angular is available on npm. Configuring Angular to run ES6 in the browser + requires a build process, detailed here. + + p. + The es6-shim package includes Angular and dependencies needed to compile + ES6 in the browser. Think of the es6-shim repository as package rather than a new project. + + + +// STEP 2 - Import Angular ########################## +.l-main-section + h2#section-transpile 2. Import Angular + + p. + Create a file named app.es6 at the root of the project. + The .es6 extension signifies that the file uses ES6 syntax. + Using the ES6 module syntax you can import the required modules from Angular2. + + pre.prettyprint.linenums + code import {Component, Template, bootstrap} from 'angular2/angular2'; + + p The above import statement will import the three modules from Angular. These modules load at runtime. + + + +// STEP 3 - Create a component ########################## +.l-main-section + + h2#section-angular-create-account 3. Create a component + + p. + Components are custom HTML elements. Angular uses components to empower HTML. + Components structure and repre.prettyprint.linenumssent the UI. This quickstart + demonstrates the process of creating a component. This component will have the tag of app. + + pre.prettyprint.linenums + code <app></app> + + p A component consists of two parts; the annotation section and the component controller. + + pre.prettyprint.linenums + code. + import {Component, Template, bootstrap} from 'angular2/angular2'; + + // Annotation Section + @Component({ + selector: 'app' + }) + @Template({ + inline: ` + <h1>Hello {{ name }}</h1> + ` + }) + // Component Controller + class AppComponent { + constructor() { + this.name = "Alice"; + } + } + + .l-sub-section + h3 Component Annotations + + p. + A component annotation provides meta-data about the component. + An annotation can always identified by its at-sign — @. + p. + The @Component annotation defines the HTML tag for the component. + The selector property specifies the tag. The selector property is a CSS selector. + + p. + The @Template annotation defines the template to apply to the + component. This component uses an inline template, but external templates are + available as well. To use an external template specify a url property + and give it the path to the html file. + + pre.prettyprint.linenums + code. + @Component({ + selector: 'app' + }) + @Template({ + inline: ` + <h1>Hello {{ name }}</h1> + ` + }) + + p. + The component created above has a HTML tag of <app></app> + and a template of <h1>Hello {{ name }}</h1>. + + .l-sub-section + h3 Component Controller + + p. + The component controller is the backing of the component's template. A component + controller uses ES6 class syntax. + + pre.prettyprint.linenums + code + class AppComponent { + constructor() { + this.name = "Alice"; + } + } + + p. + Templates read from their component controllers. Templates have access to any properties + or functions placed on the component controller. + + p. + The template above binds to a name property through the {{ }} + syntax.The body of the constructor assigns "Alice" to the name property. When the + template renders, Alice will appear instead of {{ name }}. + + + +// STEP 4 - Bootstrap ########################## +.l-main-section + h2#section-transpile 4. Bootstrap + + p The last step to load the component on the page. + + .l-sub-section + h3 The bootstrap function + p. + Angular provides a bootstrap function that renders a + component to the page. The bootstrap function takes a + component as a parameter. Any child components inside of the parent + component will render as well. + + pre.prettyprint.linenums + code bootstrap(AppComponent); + + + +// STEP 5 - Declare the HTML ########################## +.l-main-section + + h2#section-angular-create-account 5. Declare the HTML + + p. + Create an index.html file at the root of the project. + Include the es6-shim.js file in the head tag. + Now, declare the app component the body. The es6-shim must + load before any application code. + + pre.prettyprint.linenums + code. + <html> + <head> + <title>Angular 2 Quickstart</title> + <script src="/es6-shim/dist/es6-shim.js"></script> + </head> + <body> + + <!-- The app component created in app.es6 --> + <app></app> + + </body> + </html> + + .l-sub-section + h3 Load the component module + p. + The last step is to load the module for the app component. + The es6-shim file comes packaged with the System library. + Most browsers today do not support ES6 module loading. System + provides module loading functionality to these browsers. + + p. + To load the needed modules, System needs to know where to + load the files from. The paths property in System specifies + the location of the files. + + p Tell System about three paths: + ol + li Angular - The Angular framework. + li Runtime assertions - Optional assertions for runtime type checking. + li The app component created above - The component to display on the page. + + pre.prettyprint.linenums + code. + <html> + <head> + <title>Angular 2 Quickstart</title> + <script src="/es6-shim/dist/es6-shim.js"></script> + </head> + <body> + + <!-- The app component created in app.es6 --> + <app></app> + + <script> + // Rewrite the paths to load the files + System.paths = { + 'angular2/*':'/es6-shim/angular2/*.js', + 'rtts_assert/*': '/es6-shim/rtts_assert/*.js', + 'app': 'app.es6' + }; + + // Kick off the application + System.import('app'); + </script> + </body> + </html> + + p Run the root of your project on a local server. + + + +// WHAT'S NEXT... ########################## +.l-main-section + h2#section-transpile Great Job! Next Step... + + p Learn some template syntax for extra-credit. diff --git a/public/docs/dart/latest/resources.jade b/public/docs/dart/latest/resources.jade new file mode 100644 index 0000000000..53d5a2302e --- /dev/null +++ b/public/docs/dart/latest/resources.jade @@ -0,0 +1,20 @@ +.l-main-section + h2 Victor Savkin's blog posts + ul + li Change Detection + li Functional programming + li Dependency Injection + +.l-main-section + h2 David East's Intro Todo App + ul + li Building a Todo App (video) + +.l-main-section + h2 More Videos + ul + li ng-europe playlist of videos on Angular 2 and future of Angular + li Hejlsberg's talk on TypeScript from December + li Coming soon: playlist of video from ng-conf 2015 + + From 8a998d2eb15211d124cfd0f798fb7bbb5e3d0d61 Mon Sep 17 00:00:00 2001 From: Kathy Walrath Date: Mon, 2 Mar 2015 14:50:14 -0800 Subject: [PATCH 2/4] fix typo in js _data.json file --- public/docs/js/latest/_data.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/docs/js/latest/_data.json b/public/docs/js/latest/_data.json index 155fe09c17..ef0ce55dad 100644 --- a/public/docs/js/latest/_data.json +++ b/public/docs/js/latest/_data.json @@ -3,7 +3,7 @@ "icon": "home", "title": "Angular Docs", "menuTitle": "Docs Home", - "banner": "Angular 2 is currently in Alpha Preview. We reccomend using Angular 1.X for production applications." + "banner": "Angular 2 is currently in Alpha Preview. We recommend using Angular 1.X for production applications." }, "quickstart": { @@ -26,4 +26,4 @@ "icon": "chat", "title": "Help & Support" } -} \ No newline at end of file +} From b892275c2bc08ac461b4458ee32bebc02b538095 Mon Sep 17 00:00:00 2001 From: Kathy Walrath Date: Mon, 2 Mar 2015 18:42:31 -0800 Subject: [PATCH 3/4] Latest Dart info (still needs work) --- public/docs/dart/latest/_data.json | 6 +- public/docs/dart/latest/api.jade | 3 +- public/docs/dart/latest/help.jade | 2 +- public/docs/dart/latest/quickstart.jade | 279 +++++++++++------------- 4 files changed, 131 insertions(+), 159 deletions(-) diff --git a/public/docs/dart/latest/_data.json b/public/docs/dart/latest/_data.json index 155fe09c17..710417c4f1 100644 --- a/public/docs/dart/latest/_data.json +++ b/public/docs/dart/latest/_data.json @@ -3,7 +3,7 @@ "icon": "home", "title": "Angular Docs", "menuTitle": "Docs Home", - "banner": "Angular 2 is currently in Alpha Preview. We reccomend using Angular 1.X for production applications." + "banner": "Angular 2 is currently in Alpha Preview. We recommend using AngularDart 1.X for production applications." }, "quickstart": { @@ -14,7 +14,7 @@ "resources": { "icon": "play-circle-fill", "title": "Angular Resources", - "banner": "Angular 2 is currently in Alpha Preview. For Angular 1.X Resources please visit Angularjs.org." + "banner": "Angular 2 is currently in Alpha Preview. For AngularDart 1.X please visit angulardart.org." }, "api": { @@ -26,4 +26,4 @@ "icon": "chat", "title": "Help & Support" } -} \ No newline at end of file +} diff --git a/public/docs/dart/latest/api.jade b/public/docs/dart/latest/api.jade index e652be232b..f39b9e7df7 100644 --- a/public/docs/dart/latest/api.jade +++ b/public/docs/dart/latest/api.jade @@ -10,5 +10,4 @@ h3 Angular 1.X for Production p. If you're building a production app today, please - use Angular 1.X. - These versions of Angular are production ready and available today. + use AngularDart 1.X. diff --git a/public/docs/dart/latest/help.jade b/public/docs/dart/latest/help.jade index 2ad2430887..20a37e8028 100644 --- a/public/docs/dart/latest/help.jade +++ b/public/docs/dart/latest/help.jade @@ -3,7 +3,7 @@ p. We have an incredible community of developers who are passionate about solving problems. - We reccomend some of the following methods to get help with Angular. + We recommend some of the following methods to get help with Angular. .l-sub-section diff --git a/public/docs/dart/latest/quickstart.jade b/public/docs/dart/latest/quickstart.jade index 6deedf14fe..36edf1c728 100644 --- a/public/docs/dart/latest/quickstart.jade +++ b/public/docs/dart/latest/quickstart.jade @@ -1,144 +1,143 @@ +p. + These instructions assume that you already have the Dart SDK + and any tools you like to use with Dart. + If not, go + download Dart. + Then return here. + // STEP 1 - Install Angular ########################## .l-main-section h2#section-install-angular 1. Install Angular p. - Angular is still unpackaged and in alpha. This quickstart does not - reflect the final build process for Angular. The following setup is for those who - want to try out Angular while it is in alpha. - - p. - For the sake of this quickstart we recommend using the - es6-shim GitHub repository. - This repository will provide a faster start. es6-shim includes Angular and dependencies to compile ES6 in incompatible browsers. - - p Clone the repository inside of aleady existing project. + In a new directory, create a pubspec.yaml file. + Add angular2 and browser as dependencies, + and add the angular2 transformer: + [PENDING: if the transformer isn't working in time, + remove it and use reflection in Dartium instead. + Perhaps require Dart 1.9.] pre.prettyprint.linenums - code git clone https://github.com/davideast/concious.git es6-shim - - .l-sub-section - h3 A word on ES6 - p. - Angular builds on top of ES6, the new specification of the JavaScript language. - Not all ES6 features are available in all browsers. The following es6-shim - repository allows you to use ES6 in the browser today. - - p. - Angular is available on npm. Configuring Angular to run ES6 in the browser - requires a build process, detailed here. - - p. - The es6-shim package includes Angular and dependencies needed to compile - ES6 in the browser. Think of the es6-shim repository as package rather than a new project. + code. + name: hello_world + version: 0.0.1 + dependencies: + angular2: ">=2.0.0-alpha.6 <3.0.0" + browser: any + transformers: + - angular2 + p. + In the same directory, run pub get + to install the angular2 and browser packages + (along with the packages they depend on): + pre.prettyprint.linenums + code. + > pub get + Resolving dependencies... (7.3s) + + angular2 2.0.0-alpha.6 + + browser 0.10.0+2 + + path 1.3.3 + + stack_trace 1.2.3 + Changed 4 dependencies! + p. + PENDING: Create template? Link to pub/pubspec docs? + Is browser really needed? + TODO: make this an invisible note. // STEP 2 - Import Angular ########################## .l-main-section h2#section-transpile 2. Import Angular p. - Create a file named app.es6 at the root of the project. - The .es6 extension signifies that the file uses ES6 syntax. - Using the ES6 module syntax you can import the required modules from Angular2. + Under the same directory, create a web directory. + Create a file under web named main.dart. + Edit web/main.dart to import the angular2 library: pre.prettyprint.linenums - code import {Component, Template, bootstrap} from 'angular2/angular2'; - - p The above import statement will import the three modules from Angular. These modules load at runtime. + code import 'package:angular2/angular2.dart'; - -// STEP 3 - Create a component ########################## +// STEP 3 - Define a component ########################## .l-main-section - h2#section-angular-create-account 3. Create a component + h2#section-angular-create-account 3. Define a component p. - Components are custom HTML elements. Angular uses components to empower HTML. - Components structure and repre.prettyprint.linenumssent the UI. This quickstart - demonstrates the process of creating a component. This component will have the tag of app. + A component is a custom HTML element. + In this step, you create a component that has the tag <app>. + The Dart code for a component consists of a class + with annotations that describe the component. - pre.prettyprint.linenums - code <app></app> - - p A component consists of two parts; the annotation section and the component controller. + p. + Update web/main.dart to contain the following code, + which defines the app component: pre.prettyprint.linenums code. - import {Component, Template, bootstrap} from 'angular2/angular2'; + import 'package:angular2/angular2.dart'; - // Annotation Section - @Component({ - selector: 'app' - }) + @Component( + selector: 'app' + ) @Template({ - inline: ` - <h1>Hello {{ name }}</h1> - ` + inline: '<h1>Hello {{ name }}</h1>' }) - // Component Controller class AppComponent { - constructor() { - this.name = "Alice"; - } + String name = 'Alice'; } .l-sub-section - h3 Component Annotations + h3 Annotations p. - A component annotation provides meta-data about the component. - An annotation can always identified by its at-sign — @. - p. - The @Component annotation defines the HTML tag for the component. - The selector property specifies the tag. The selector property is a CSS selector. + The @Component annotation defines the HTML tag for the component. [PENDING: component controller?] + The selector property specifies the tag. The selector property is a CSS selector. [PENDING: huh?] p. The @Template annotation defines the template to apply to the component. This component uses an inline template, but external templates are - available as well. To use an external template specify a url property - and give it the path to the html file. + available as well. To use an external template, specify a url property + and give it the path to the HTML file. pre.prettyprint.linenums code. - @Component({ - selector: 'app' - }) + @Component( + selector: 'app' + ) @Template({ - inline: ` - <h1>Hello {{ name }}</h1> - ` + inline: '<h1>Hello {{ name }}</h1>' }) p. - The component created above has a HTML tag of <app></app> - and a template of <h1>Hello {{ name }}</h1>. + The annotations above specify an HTML tag of <app></app> + and a template of <h1>Hello {{ name }}</h1>. + + p TODO: make double-mustaches work in text (they do work in listings) .l-sub-section - h3 Component Controller + h3 The template and the component controller p. - The component controller is the backing of the component's template. A component - controller uses ES6 class syntax. + A template has access to all the public properties and methods + of its component controller. + [PENDING: Do we really want to use the term "component controller"? + If so, set it up beforehand. + In the original text, what does "the backing" mean, and is it + important that we keep it?] pre.prettyprint.linenums - code + code. class AppComponent { - constructor() { - this.name = "Alice"; - } + String name = 'Alice'; } - p. - Templates read from their component controllers. Templates have access to any properties - or functions placed on the component controller. - p. The template above binds to a name property through the {{ }} syntax.The body of the constructor assigns "Alice" to the name property. When the - template renders, Alice will appear instead of {{ name }}. + template renders, Alice appears instead of {{ name }}. + [TODO: fix double mustaches] @@ -146,20 +145,20 @@ .l-main-section h2#section-transpile 4. Bootstrap - p The last step to load the component on the page. - - .l-sub-section - h3 The bootstrap function - p. - Angular provides a bootstrap function that renders a - component to the page. The bootstrap function takes a - component as a parameter. Any child components inside of the parent - component will render as well. - - pre.prettyprint.linenums - code bootstrap(AppComponent); - + p. + At the bottom of web/main.dart, + add a main() function + that calls Angular's bootstrap() function. + The argument to bootstrap() is the name of the app class + you defined above: + pre.prettyprint.linenums + code. + main() { + bootstrap(AppComponent); + } + p. + [PENDING: change/remove line numbers. They should start at 12.] // STEP 5 - Declare the HTML ########################## .l-main-section @@ -167,77 +166,51 @@ h2#section-angular-create-account 5. Declare the HTML p. - Create an index.html file at the root of the project. - Include the es6-shim.js file in the head tag. - Now, declare the app component the body. The es6-shim must - load before any application code. + Create a file named web/index.html that contains + the following code, + which loads main.dart and instantiates the app component: pre.prettyprint.linenums code. - <html> - <head> - <title>Angular 2 Quickstart</title> - <script src="/es6-shim/dist/es6-shim.js"></script> - </head> - <body> - - <!-- The app component created in app.es6 --> - <app></app> - - </body> - </html> - - .l-sub-section - h3 Load the component module - p. - The last step is to load the module for the app component. - The es6-shim file comes packaged with the System library. - Most browsers today do not support ES6 module loading. System - provides module loading functionality to these browsers. - - p. - To load the needed modules, System needs to know where to - load the files from. The paths property in System specifies - the location of the files. - - p Tell System about three paths: - ol - li Angular - The Angular framework. - li Runtime assertions - Optional assertions for runtime type checking. - li The app component created above - The component to display on the page. - - pre.prettyprint.linenums - code. - <html> + <!doctype html> + <html> <head> <title>Angular 2 Quickstart</title> - <script src="/es6-shim/dist/es6-shim.js"></script> </head> - <body> + <body> + <app></app> + <script type="application/dart" src="main.dart"></script> + <script src="packages/browser/dart.js"></script> + </body> + </html> + p. + [PENDING: When I select a bunch of code, it looks like I select the line #s too, making me fear that they'll get copied. But pasting doesn't include them. Fix!] - <!-- The app component created in app.es6 --> - <app></app> +// STEP 5 - Build and run ########################## +.l-main-section - <script> - // Rewrite the paths to load the files - System.paths = { - 'angular2/*':'/es6-shim/angular2/*.js', - 'rtts_assert/*': '/es6-shim/rtts_assert/*.js', - 'app': 'app.es6' - }; + h2#section-angular-run-app 5. Build and run your app - // Kick off the application - System.import('app'); - </script> - </body> - </html> - - p Run the root of your project on a local server. + p. + You have many options. + One is to run the pub serve + command in the directory + that contains your app's pubspec.yaml file: + pre.prettyprint.linenums + code. + > pub serve + Serving helloworld on http://localhost:8080 + p. + In the browser, go to the index file—for example, + localhost:8080/web/index.html. + [PENDING: This isn't working right now. Fix!] // WHAT'S NEXT... ########################## .l-main-section h2#section-transpile Great Job! Next Step... - p Learn some template syntax for extra-credit. + p. + Learn some template syntax for extra credit. + [PENDING: really?] From c1fd3477fe7e8ab12a801ab40b3d1d8076dffe48 Mon Sep 17 00:00:00 2001 From: Kathy Walrath Date: Mon, 2 Mar 2015 18:43:37 -0800 Subject: [PATCH 4/4] fix a couple of js quick start typos --- public/docs/js/latest/quickstart.jade | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/docs/js/latest/quickstart.jade b/public/docs/js/latest/quickstart.jade index 6deedf14fe..253710693c 100644 --- a/public/docs/js/latest/quickstart.jade +++ b/public/docs/js/latest/quickstart.jade @@ -57,7 +57,7 @@ p. Components are custom HTML elements. Angular uses components to empower HTML. - Components structure and repre.prettyprint.linenumssent the UI. This quickstart + Components structure and represent the UI. This quickstart demonstrates the process of creating a component. This component will have the tag of app. pre.prettyprint.linenums @@ -89,7 +89,7 @@ h3 Component Annotations p. - A component annotation provides meta-data about the component. + A component annotation provides metadata about the component. An annotation can always identified by its at-sign — @. p. The @Component annotation defines the HTML tag for the component.