szalishchuk / generator-spa

Yeoman generator for fast Single Page Application prototyping with PhoneGap integration.
MIT License
4 stars 1 forks source link

generator-spa Build Status

Features

Grunt tasks

What is Grunt?

In one word: automation. The less work you have to do when performing repetitive tasks like minification, compilation, unit testing, linting, etc, the easier your job becomes. After you've configured it, a task runner can do most of that mundane work for you—and your team—with basically zero effort.

generator-spa will install grunt for you, so you don't even have to know what grunt is to use it. But be sure to check out it's Getting Started guide.

Installation manual

Done! By this point you should have application running on your 80 port.

Build webapp for production

$ grunt build:webapp:production

Builds web application's assets for these to become suitable for distribution. Basically we squeeze down all of the javascript files with templates into a single file called package.js. The very same thing happens to less files, they end up being a part of the one and only package.css file. We also smartly process the index.html file for it to include dependencies based on new environment and copy everything we've generated to the target directory.

By the end of the day we get the following structure:

-dist
--webapp
---images
----*all images from app/images*
---scripts
----package.js
---styles
----package.css
---index.html

These assets can be used for production deployment on an ftp or cloud service, and will be hosted by the application server of your choice. They will be also used as a code base for a phonegap application, in fact, if you run any task for building a mobile application, it will run this task first to get all of the assets and only then do it's own magic.

A generator for Yeoman.

Getting Started

What is Yeoman?

Trick question. It's not a thing. It's this guy:

Basically, he wears a top hat, lives in your computer, and waits for you to tell him what kind of application you wish to create.

Not every new computer comes with a Yeoman pre-installed. He lives in the npm package repository. You only have to ask for him once, then he packs up and moves into your hard drive. Make sure you clean up, he likes new and shiny things.

$ npm install -g yo

Yeoman Generators

Yeoman travels light. He didn't pack any generators when he moved in. You can think of a generator like a plug-in. You get to choose what type of application you wish to create, such as a Backbone application or even a Chrome extension.

To install generator-spa from npm, run:

$ npm install -g generator-spa

Finally, initiate the generator:

$ yo spa

Getting To Know Yeoman

Yeoman has a heart of gold. He's a person with feelings and opinions, but he's very easy to work with. If you think he's too opinionated, he can be easily convinced.

If you'd like to get to know Yeoman better and meet some of his friends, Grunt and Bower, check out the complete Getting Started Guide.

License

MIT License