anchor.diff:        #[b typings.json] provides additional definition files for libraries that the TypeScript
         compiler doesn't natively recognize.
       li.
  -      #[b systemjs.config.js] provides instructions for loading application and library modules.
  -      (We use SystemJS here, but you could also use webpack for the same purpose.)
  -
  -  p.
  -    Learn more about all these configuration files in the
  -    #[a(href="guide/npm-packages.html") Npm Package Configuration] guide, the
  -    #[a(href="#{_tsconfigUri}") TypeScript Configuration] guide, and in the
  -    #[a(href="#systemjs") SystemJS] section later in this guide.
  +      #[b systemjs.config.js] provides information to a module loader about where to find
  +      application modules, and registers all the necessary packages. It also
  +      contains other packages that will be needed by later documentation examples.
   
     p.
       Create each of these files in your project directory. Populate them by pasting in text from
  
positive.code:     in JavaScript and #{_docsFor == 'ts' ? 'Dart' : 'TypeScript'}. Use the language selector in the
      banner to switch development languages for this guide.
  .l-main-section
  h1 Our destination
  
  aside.is-right
    :marked
  
negative.code: 
  +makeExample('app/app.component.ts')
  
  :marked
    Components are the basic building blocks of Angular applications. A component controls a portion
    of the screen&mdash;a *view*&mdash;through its associated template.
  
    Every Angular app has at least one *root component*, conventionally named `AppComponent`, that
    hosts the client user experience.
  
    The QuickStart application has the same essential structure as any other Angular component:
  
      * **An import statement**. Importing gives your component access to
      Angular's core [`@Component` decorator function](../latest/api/core/index/Component-decorator
      .html).
      * **A @Component #{_decorator}** that associates *metadata* with the
          `AppComponent` component class:
  
          - a *selector* that specifies a simple CSS selector for an HTML element that represents
            the component
          - a *template* that tells Angular how to render the component's view.
      * **A component class** that controls the appearance and behavior of a view
      through its template. Here, we only have the root component, `AppComponent`.
  
    The `AppComponent` class is the root of the application. Since you don't need any
    application logic in the simple QuickStart example, it's empty. In a real application, the
    component class would define properties and application logic.
  
    You *export* the `AppComponent` class so that you can *import* it elsewhere in your
    application.
  
  
  +ifDocsFor('ts')
    .l-main-section
    h1#ngmodule Step 3: Create the application's root module
    :marked
      You compose Angular applications into closely related blocks of functionality with [Angular
      Modules](guide/ngmodule.html). Angular itself is split into separate Angular Modules. This
      makes it possible for you to keep payload size small by only importing the parts of Angular
      that your application needs.
  
      Every application requires at least one module: the _root module_, named `AppModule` by convention.
  
      Create the file `app/app.module.ts` with the following content:
  
    +makeExample('app/app.module.ts')(format='.')
  
    :marked
      You're passing metadata to the `NgModule` decorator function:
  
      * `imports` - the _other_ modules that export things that we need in _this_ module.
  
      * `declarations` - components and directives that belong to _this_ module.
  
      * `bootstrap` - the _root component_ that Angular should _bootstrap_ when it
      starts the application.
  
      This module definition imports the application's single component, `app.component.ts`, and
      adds it to both the `declarations` and `bootstrap` arrays.
  
      Since the QuickStart application is a web application that runs in a browser, your root module
      needs to import the
      [`BrowserModule`](../latest/api/platform-browser/index/BrowserModule-class.html)
      from `@angular/platform-browser` to the `imports` array.
  
      This is the smallest amount of Angular that is needed for a minimal application to run in the
      browser.
  
      The QuickStart application doesn't do anything else, so you don't need any other modules. In a real
      application, you'd likely import [`FormsModule`](../latest/api/forms/index/FormsModule-class
      .html) as well as [`RouterModule`](../latest/api/router/index/RouterModule-class.html) and
      [`HttpModule`](../latest/api/http/index/HttpModule-class.html). These are introduced in the
      [Tour of Heroes Tutorial](../tutorial/).
  
  .l-main-section
  h1#main Step !{step++}: Add #[code #[+adjExPath('main.ts')]]
  
  block create-main
    :marked
  