can-boilerplate

Get a head start on your CanJS project.

npm install can-boilerplate
6 downloads in the last day
9 downloads in the last week
29 downloads in the last month

can-boilerplate NPM Version Build Status Coverage Status Dependency Status

Get a head start on your CanJS v2.x project.

How it can help you:

  • Get started quickly with customized Development and Production environment "shell" files
  • Avoid feeling overwhelmed with a folder structure that's simple and light but not hindering
  • Save time with compilers and optimizers that do not require the use of a command line

Getting Started

This plugin requires Node.js ~0.10. Temporarily, it also requires Xcode and a Unix-based OS.
To install, type this at the command line:

npm install can-boilerplate -g

After that, you can generate a project any time with:

canbp

That's it. ☺︎

It currently comes packed with:

Roadmap Features:

  • 0.7.x speed up loading of tool dependencies somehow
  • 0.7.x add source map support to grunt-myth
  • 0.8 add DocumentJS (and YUIDoc?)
  • 0.9 possibly add hooks to Yeoman
  • 1.0 test on Windows
  • 1.1 possibly add StealJS

"Installing" a Project

Run either the *.bat (Windows) or *.command (Mac) file in client/private/tools/ to install the build tools and all client-side dependencies. Optionally, you can manually run npm install within client/.

Compiling a Project

Run either the *.bat (Windows) or *.command (Mac) file in client/private/tools/. Optionally, you can manually run grunt compile within client/ to skip all menus and prompts.

Compile example

Project Folder Structure

├── client/
│   ├── node_modules/
│   ├── private/
│   │   ├── components/
│   │   │   └── example/
│   │   │       ├── helpers/
│   │   │       ├── media/
│   │   │       │   ├── backgrounds-embedded/
│   │   │       │   ├── chrome-embedded/
│   │   │       │   ├── icons-embedded/
│   │   │       │   └── textures-embedded/
│   │   │       ├── models/
│   │   │       ├── example.js
│   │   │       ├── example.less
│   │   │       └── example.mustache
│   │   ├── media/
│   │   │   ├── backgrounds/
│   │   │   ├── backgrounds-embedded/
│   │   │   ├── chrome/
│   │   │   ├── chrome-embedded/
│   │   │   ├── fonts/
│   │   │   ├── icons/
│   │   │   ├── icons-embedded/
│   │   │   ├── textures/
│   │   │   └── textures-embedded/
│   │   ├── models/
│   │   │   └── example/
│   │   │       └── example.js
│   │   ├── test/
│   │   │   ├── func.js
│   │   │   ├── test.html
│   │   │   └── unit.js
│   │   ├── vendors/
│   │   ├── index.html
│   │   ├── index.production.html
│   │   ├── init.js
│   │   └── init.less
│   ├── public/
│   ├── tools/
│   │   ├── tools.bat
│   │   └── tools.command
│   ├── bower.json
│   ├── Gruntfile.js
│   └── package.json
├── server/
└── README.md

client/public/ stores your compiled/minified production-ready files.
client/private/ stores your source code.

client/private/vendors/ (bower components) and client/node_modules/ are gitignore'd. They're only added when the project is installed.

client/private/media/*/ stores media referenced from your CSS. Folders included in production build.
client/private/media/*-embedded/ stores media compiled into the production CSS file (using Less' data-uri()). Folders excluded in production build.

Any empty folders will be excluded from the production build.
Any empty files in any media/ folder will be excluded from the production build.

FAQ

  1. Why not just set the \

npm loves you