index.html

---
layout: base
title: The web's scaffolding tool for modern webapps
---

<div class="content">

  <div class="jumbotron clearfix">
    <div class="container">
      <h2>The web's scaffolding tool for modern webapps</h2>

      <img src="/assets/img/illustration-home-inverted.png" alt="Yeoman and his fellow developers" class="illustration">
    </div>
  </div><!-- /.jumbotron -->

  <div class="container">
    <article class="main clearfix">

      <section class="one-line-install">
        <p><a href="/learning">Get started</a> and then <a href="/generators">find a generator</a> for your webapp. Generators are available for <a href="https://github.com/yeoman/generator-angular">Angular</a>, <a href="https://github.com/yeoman/generator-backbone">Backbone</a>, <a href="https://github.com/newtriks/generator-react-webpack">React</a>, <a href="https://github.com/yeoman/generator-polymer">Polymer</a> and over <a href="/generators">5600+ other projects</a>.

        <p><strong>One-line install using <a href="https://www.npmjs.com">npm</a>:</strong></p>

        <pre>npm install -g yo</pre>
      </section><!-- /.one-line-install -->

      <section>
        <input id="q" placeholder="Search the doc" />
      </section>
      <section class="content-chunk section-tools">
        <h1>What's Yeoman?</h1>

        <p>
          Yeoman helps you to kickstart new projects, prescribing best practices and tools to help you stay productive.
        </p>

        <p>
          To do so, we provide a generator ecosystem. A generator is basically a plugin that can be run with the `yo` command to scaffold complete projects or useful parts.
        </p>

        <p>
          Through our official Generators, we promote the "Yeoman workflow". This workflow is a robust and opinionated client-side stack, comprising tools and frameworks that can help developers quickly build beautiful web applications. We take care of providing everything needed to get started without any of the normal headaches associated with a manual setup.
        </p>

        <p>
          With a modular architecture that can scale out of the box, we leverage the success and lessons learned from several open-source communities to ensure that developers use it as intelligently as possible.
        </p>

        <p>
          As firm believers in good documentation and well thought out build processes, Yeoman includes support for linting, testing, minification and much more, so developers can focus on solutions rather than worrying about the little things.
        </p>

        <h2>Tools</h2>

        <p>
          The Yeoman workflow comprises three types of tools for improving your productivity and satisfaction when building a web app: the scaffolding tool (yo), the build tool (npm scripts, Gulp, Grunt etc) and the package manager (like npm and Yarn).
        </p>

        <ul class="basic-tools clearfix">
          <li>
            <a href="https://github.com/yeoman/yo" class="tool-logo yo"><img src="/assets/img/tool-yo.png" alt="YO"></a>
            <div class="tool-content"><a href="https://github.com/yeoman/yo"><strong>yo</strong></a> scaffolds out a new application, writing your build configuration (e.g Gulpfile) and pulling in relevant build tasks and package manager dependencies (e.g npm) that you might need for your build.</div>
          </li>
          <li>
            <span class="tool-logo gulp"><img src="/assets/img/gulp-logo.png" alt="Gulp, Grunt etc"></span>
            <div class="tool-content">The <strong>Build System</strong> is used to build, preview and test your project. <a href="https://docs.npmjs.com/cli/using-npm/scripts">npm scripts</a> are suggested, while <a href="http://gulpjs.com">Gulp</a> and <a href="http://gruntjs.com/">Grunt</a> are available as well.</div>
          </li>
          <li>
            <span class="tool-logo npm"><img src="/assets/img/npm-logo.png" alt="npm, Yarn, etc"></span>
            <div class="tool-content">The <strong>Package Manager</strong> is used for dependency management, so that you no longer have to manually download and manage your scripts. <a href="https://www.npmjs.com/">npm</a> and <a href="https://yarnpkg.com/">Yarn</a> are two popular options.</div>
          </li>
        </ul><!-- /.basic-tools -->

        <p>
          All three of these tools are developed and maintained separately, but work well together as part of our prescribed workflow for keeping you effective.
        </p>
      </section><!-- /.content-chunk -->

      <section class="content-chunk section-team">
        <h1>The Yeoman Team</h1>

        <ul class="team">
          <li>
            <a href="http://addyosmani.com/blog/">
              <img src="https://gravatar.com/avatar/96270e4c3e5e9806cf7245475c00b275?s=144" alt="Addy Osmani">
              <span class="member">Addy Osmani</span>
            </a>
          </li><li> <!-- since the li's are inline blocks, there cannot be white space between them as they will not fit in one row -->
            <a href="http://sindresorhus.com">
              <img src="https://gravatar.com/avatar/d36a92237c75c5337c17b60d90686bf9?s=144" alt="Sindre Sorhus">
              <span class="member">Sindre Sorhus</span>
            </a>
          </li><li>
            <a href="https://passy.me">
              <img src="https://gravatar.com/avatar/be451fcdbf0e5ff07f23ed16cb5c90a3?s=144" alt="Pascal Hartig">
              <span class="member">Pascal Hartig</span>
            </a>
          </li><li>
            <a href="https://github.com/stephenplusplus">
              <img src="https://gravatar.com/avatar/098cfe2d360e77c3229f2cd5298354c4?s=144" alt="Stephen Sawchuk">
              <span class="member">Stephen Sawchuk</span>
            </a>
          </li><li>
            <a href="https://github.com/SBoudrias">
              <img src="https://gravatar.com/avatar/368346708a485060d31f77677a21d2a5?s=144" alt="Simon Boudrias">
              <span class="member">Simon Boudrias</span>
            </a>
          </li><li>
            <a href="http://briantford.com">
              <img src="https://gravatar.com/avatar/721cc7667947af96cc416729fc497107?s=144" alt="Brian Ford">
              <span class="member">Brian Ford</span>
            </a>
          </li><li>
            <a href="http://eddiemonge.com">
              <img src="https://gravatar.com/avatar/08a01ffbfa6e039295208f023dec0dae?s=144" alt="Eddie Monge">
              <span class="member">Eddie Monge</span>
            </a>
          </li><li>
            <a href="http://www.paulirish.com">
              <img src="https://gravatar.com/avatar/ffe68d6f71b225f7661d33f2a8908281?s=144" alt="Paul Irish">
              <span class="member">Paul Irish</span>
            </a>
          </li><li>
            <a href="http://h3manth.com">
              <img src="https://gravatar.com/avatar/d32a6bf2b43bf62a7212f0c793d76319?s=144" alt="Hemanth.HM">
              <span class="member">Hemanth.HM</span>
            </a>
          </li><li>
            <a href="http://blog.revathskumar.com">
              <img src="https://gravatar.com/avatar/fb7edc7cc7a53c903af74d07dcecf9dc?s=144" alt="Revath S Kumar">
              <span class="member">Revath S Kumar</span>
            </a>
          </li><li>
            <a href="https://github.com/ragingwind">
              <img src="https://gravatar.com/avatar/687ac25540fe35fcb5e828f75c4a6079?s=144" alt="Jimmy Moon">
              <span class="member">Jimmy Moon</span>
            </a>
          </li><li>
            <a href="https://github.com/sleeper">
              <img src="https://gravatar.com/avatar/4605de69c4c3af3f48b8e829206cd4c2?s=144" alt="Frederick Ros">
              <span class="member">Frederick Ros</span>
            </a>
          </li><li>
            <a href="https://github.com/mklabs">
              <img src="https://gravatar.com/avatar/a23615915f0baf096b94cc9df93fc327?s=144" alt="Mickael Daniel">
              <span class="member">Mickael Daniel</span>
            </a>
          </li><li>
            <a href="http://ericbidelman.tumblr.com">
              <img src="https://gravatar.com/avatar/e7948aac7c52b26470be80311873a398?s=144" alt="Eric Bidelman">
              <span class="member">Eric Bidelman</span>
            </a>
          </li><li>
            <a href="https://github.com/silvenon">
              <img src="https://gravatar.com/avatar/6d95827ad2de5f374947b02983d4c85b?s=144" alt="Matija Marohnić">
              <span class="member">Matija Marohnić</span>
            </a>
          </li><li>
            <a href="https://github.com/kevva">
              <img src="https://gravatar.com/avatar/48fa294e3cd41680b80d3ed6345c7b4d?s=144" alt="Kevin Mårtensson">
              <span class="member">Kevin Mårtensson</span>
            </a>
          </li><li>
            <a href="https://github.com/arthurvr">
              <img src="https://gravatar.com/avatar/e34daab0d2e344219adb5234198269c5?s=144" alt="Arthur Verschaeve">
              <span class="member">Arthur Verschaeve</span>
            </a>
          </li><li>
            <a href="https://github.com/mischah">
              <img src="https://gravatar.com/avatar/57e80cd1ada0e75bb04da5bbcd155753?s=144" alt="Michael Kühnel">
              <span class="member">Michael Kühnel</span>
            </a>
          </li><li>
            <a href="https://github.com/zckrs">
              <img src="https://gravatar.com/avatar/2ad7eb39d40ec50b8a16f0924a664ad2?s=144" alt="Mehdy Dara">
              <span class="member">Mehdy Dara</span>
            </a>
          </li><li>
            <a href="https://github.com/ulisesGascon">
              <img src="https://gravatar.com/avatar/7c94524aed875befcc22e0e823870a62?s=144" alt="Ulises Gascon>
              <span class="member">Ulises Gascon</span>
            </a>
          </li>
        </ul>

      </section><!-- /.content-chunk -->
    </article><!-- /.main -->
  </div><!-- /.container -->

</div><!-- /.content -->