getting-started.tmpl.html

<div ng-controller="GuideCtrl" class="doc-content">
  <md-content>
    <p>
      <h2><em>New to AngularJS?</em> Before getting into AngularJS Material, it might be helpful to:</h2>
    </p>
    <p>
      <ul>
        <li>
          Watch videos about <a
            href="https://egghead.io/courses/angularjs-fundamentals" target="_blank"
            title="AngularJS Framework">AngularJS Fundamentals</a>
        </li>
        <li>
          Read the
          <a href="https://material.io/archive/guidelines/" target="_blank"
             title="Material Design">Material Design </a> specifications for components,
          animations, styles, and layouts.
        </li>
      </ul>
    </p>
    <h2>How do I start with AngularJS Material?</h2>
    <ul style="margin-bottom: 2em;">
      <li>
        Get jump started with a free 30-minute video course: <a
          href="https://egghead.io/courses/introduction-to-angular-material" target="_blank"
          title="AngularJS Framework">Introduction to AngularJS Material</a>
      </li>
      <li>
        <a href="https://stackblitz.com/edit/angularjs-material-blank?file=app%2Fapp.template.html"
           target="_blank" title="Blank AngularJS Material StackBlitz Demo">
          Start with a blank application on StackBlitz</a>
      </li>
      <li>
        Test drive AngularJS Material examples on
        <a href="https://codepen.io/team/AngularMaterial/"
           target="_blank" title="AngularJS Material CodePen Examples">
          CodePen</a>
      </li>
      <li>
        Checkout our
        <a href="https://github.com/Splaktar/angularjs-angular-material-hybrid-demo" target="_blank"
           title="AngularJS Material, Angular Material, TypeScript, Angular CLI repository">
        AngularJS Material + Angular Material + TypeScript + Angular CLI</a> repository
      </li>
      <li style="margin-bottom: 30px;">
        Checkout the <a href="https://github.com/angular/material-start/tree/typescript" target="_blank"
           title="Material Start - Typescript and SystemJS">AngularJS Material + TypeScript + SystemJS</a>
        repository
      </li>
      <li>Use the "Edit on CodePen" button on any of our Demos<br/>
        <img
            src="https://cloud.githubusercontent.com/assets/210413/11568997/ed86795a-99b4-11e5-898e-1da172be80da.png"
            style="width:75%; margin: 10px 30px 0 0" alt="Image with arrow to Edit on CodePen button">
      </li>
    </ul>
    <h3>Our CodePen Community</h3>
    <p>
      You can also visit our
      <a href="https://codepen.io/team/AngularMaterial/" target="_blank"
         title="Codepen Community">CodePen Community</a> to explore more
      <a href="https://codepen.io/team/AngularMaterial/pens/public/" target="_blank">samples</a>,
      <a href="https://codepen.io/team/AngularMaterial/collections/public/" target="_blank">collections</a>, and ideas.
    </p>
    <br/>

    <h3>Installing the AngularJS Material Libraries</h3>

    <p>
      You can
      <a href="https://github.com/angular/bower-material/#installing-angularjs-material"
         target="_blank">install the AngularJS Material library</a>
      (and its dependent libraries) in your local project using
      <a href="https://www.npmjs.com/" target="_blank">NPM</a>.
    </p>

    <p>
      AngularJS Material also integrates with some additional, optional libraries which you may elect
      to include:
    </p>

    <ul style="margin-bottom: 2em;">
      <li>
        <a href="https://docs.angularjs.org/api/ngMessages">ngMessages</a>
        - Provides a consistent mechanism for displaying form errors and other messages.
          <strong>Required</strong> for some AngularJS Material components like
          <code>md-input</code>.
      </li>
      <li>
        <a href="https://docs.angularjs.org/api/ngSanitize">ngSanitize</a>
        - The ngSanitize module provides functionality to sanitize HTML content in Material
        components.
      </li>

      <li>
        <a href="https://docs.angularjs.org/api/ngRoute">ngRoute</a>
        - Provides a clean routing system for your application.
      </li>
    </ul>

    <br/>

    <h3>Unsupported Integrations</h3>
    <p>
      AngularJS Material has known integration issues with the following libraries:
    </p>
    <ul style="margin-bottom: 2em;">
      <li>
        <a href="https://docs.angularjs.org/api/ngTouch">ngTouch</a>
        - AngularJS Material conflicts with ngTouch for click, tap, and swipe support on touch-enabled
        devices.
      </li>

      <li>
        <a href="http://legacy.docs.ionic.io/v1.0">Ionic v1</a>
        - Has built-in touch support that interferes with AngularJS Material's mobile gesture features.
          Ionic v1 is no longer officially supported by the Ionic team.
      </li>
    </ul>

    <br/>
    <h2>Contributing to AngularJS Material</h2>
    <ul style="margin-bottom: 2em;">
      <li>
        Start by reading our <a href="https://github.com/angular/material#contributing">Contributor
        Guidelines</a>.
      </li>
      <li>
        For bug reports, search our
        <a href="https://github.com/angular/material/issues?q=is%3Aissue+is%3Aopen"
           target="_blank" title="AngularJS Material GitHub Issues">GitHub Issues</a>
        for existing issues that match your bug.
      </li>
      <li style="margin-left: 40px">If none are found, please open a new issue.</li>
      <li>For questions and troubleshooting, search the
        <a href="https://groups.google.com/forum/#!forum/ngmaterial"
           target="_blank" title="AngularJS Material Forums">AngularJS Material Forums</a>
        for related discussions.
      </li>
      <li style="margin-left: 40px">If none are found, please post a new question.</li>
      <li>StackOverflow's
        <a href="https://stackoverflow.com/questions/tagged/angularjs-material" target="_blank"
           title="AngularJS Material tag on StackOverflow">
          [angularjs-material] tag</a> is another good resources for solving problems.
      </li>
      <li>
        You can also ask questions in our
        <a href="https://gitter.im/angular/material" target="_blank" title="Gitter Chat">
          Gitter Chat</a>.
      </li>
    </ul>
  </md-content>
</div>