eggs-genny is a robust webapp-building Yeoman generator. The terriblly punny name comes from this line that I wrote when I initialized the repo:

An EGGS-ellent Yeoman GENNY-erator for building modern web apps.

In case you don't know what Yeoman is, it essentially like builds you out a "template" project or project skeleton. It can also do other cool stuff like installing dependencies for you. It's fucking dope, saves you a shit load of time, and there are literally a bunch of prebuilt ones. You can also write your own, obviously, which is how eggs-genny was born.

To learn all about Yeoman and how to get up and running with eggs-genny, take a look at the (hilarious and thorough) wiki.

Quick Install

This presumes you've installed a Yeoman generator before. If not, check out the wiki. eggs-genny is on npm, so installing it is a breeze:

npm install -g generator-eggs-genny

If that didn't work try running it with sudo in front of the command.

Now just cd into your little rag-tag project and run:

yo eggs-genny

This is where shit gets real. Answer some questions and in no time you'll have a web app with your name on it, customized to exactly how you like it.

You can also optionally skip the bower and npm installs by adding --skip-install to the end of the command, like so:

yo eggs-genny --skip-install

That's it. You're done! Although if you'd like, I just read about this command so for lol's you could try it out:

npm star generator-eggs-genny

Options Overview

eggs-genny gives you a lot of options to customize your project's setup. It starts by asking some procedural stuff, such as the name and description of your application. eggs-genny is always growing, but as of writing this here are the options that eggs-genny provides to customize what your project will use:

Preprocessors (CSS & JS)

• Less
• Sass
• CoffeeScript

CSS Frameworks/Tools

• Bootstrap CSS
• Skeleton
• Animate.CSS
• Lesslie

JS Frameworks/Tools

• jQuery
• Underscore
• Angular
• React
• GSAP

In addition, you will be prompted about whether or not you would like to use CoffeeScript, as well as what GSAP plugins you need if you are using GSAP.

You will also be asked if you use Sublime Text, because if you do eggs-genny is going to hook you up with a sweet project file to get you started.

Another prompt you will be met with is whether or not you would like eggs-genny to add & link up some default Apple touch icons for you to use, as well as Windows 10 tile icons.

Running Tasks

Currently, eggs-genny builds you a great task-running system based on Gulp. It can do wonderful things such as provide you a local file server, compile your pre-processed stylesheets, and make your code production-ready.

Default Task

The default task in Gulp is run simply by running gulp after eggs-genny is done building your project. This sets up a server at the address localhost:6969 so that you can locally test your app. It also tells gulp to watch all of your main style, script and HTML files for any changes, and to LiveReload the page should any changes occur.

Compile Tasks

Compilation of CoffeeScript, Less or Sass files happens automatically as part of the default task. However if you would like to run these tasks independently, they can be done as follows:

gulp compile-css


gulp compile-coffee

Build Task

To produce a production-ready version of your code (which is generated into the /build directory of the project by default), simply run the following command:

gulp build

This task has a lot of moving parts, but as a quick overview this task will:

• compile CSS and CoffeeScript

• concatenate all CSS files (all the ones in the app/lib/ plus whichever ones you've created)

• concatenate all scripts (again, all of the app/lib scripts plus whatever one's you've added)

• minify all files

• perform some optimizations (such as uncss and ng-annotate)

• move all files to the build/ directory, while doing things like image minification along the way

Eventually, the plan is to offer a Grunt option, as well as a solution that moves away from these build tools entirely and instead relying purely on npm & it's modules directly.

Contribute

Wanna help a brother out? Feel free to make suggestions here or on Twitter, or better yet create a pull request and help build eggs-genny!

Created by Dave Lunny in the beautiful year 2015.