Broman

Broman is a dangerously suggestful methodology for seeding your projects with the following technologies:

• AngularJS
• Font Awesome
• Foundation
• HTML5 Boilerplate
• jQuery
• Modernizr

And written without html, css, or javascript using:

• CoffeeScript
• Jade
• Stylus

So what does this buy me?

The bro is perfect for people who want to get started developing without the headache of setting up a development environment every time. The project has already configured the basics of compilation, watcher, and a server tasks.

It also comes with a biased folder structure that accommodates both small and large projects.

Quick start

1. Install node - windows users will have to add nodejs to environment path
2. Install npm - windows users will have to add npm to environment path
3. Install grunt; run npm install -g grunt-cli
4. Install bower; run npm install -g bower
5. Install npm depedencies; run npm install -d
6. Install bower dependencies; run bower install
7. Compile, run, watch, develop; run grunt

Folder structure concept

After you execute the grunt command, along with installing the dependencies for npm and bower, your project will look a lot different. Orly?

See below for folder structure intended by the creator:

broman/
├── dist/ (website files to be distributed - do not touch)
├── src/ (website files to be edited)
│   ├── app/
│   │   ├── feature-a/
│   │   │   ├── controller/
│   │   │   ├── directive/
│   │   │   ├── filter/
│   │   │   ├── model/
│   │   │   ├── service/
│   │   │   ├── style/
│   │   │   ├── test/
│   │   │   ├── _feature-a.jade (partials are "_" prefixed file names)
│   │   │   └── feature-a.jade (pages are non prefixed file names)
│   │   ├── layout/ (generic layout)
│   │   │   ├── controller/
│   │   │   │   ├── footer-controller.jade
│   │   │   │   └── header-controller.jade
│   │   │   ├── _footer.jade
│   │   │   └── _header.jade
│   │   ├── shared/ (shared features)
│   │   │   ├── component/ (generic components)
│   │   │   │   └── component-a/
│   │   │   │       ├── directive/
│   │   │   │       ├── service/
│   │   │   │       ├── style/
│   │   │   │       └── _component.jade
│   │   │   ├── filter/
│   │   │   │   └── test/
│   │   │   ├── model/
│   │   │   │   └── test/
│   │   │   └── service/
│   │   │       └── test/
│   │   ├── app.coffee
│   │   └── index.jade (html5 boilerplate port)
│   ├── asset/ (site static content)
│   ├── img/ (site images)
│   ├── font/ (site fonts)
│   └── style/
│       ├── components/ (generic css only components)
│       │   └── foundation/ (foundation overrides)
│       ├── mixin/
│       ├── app.styl
│       ├── base.styl (tag customization excluding font)
│       ├── font.styl (font family additions)
│       ├── icon.styl
│       ├── typography.styl (font styles)
│       └── variable.styl (website colors, etc)
│
├── vendor/
│   └── bower/ (managed by bower - do not touch)
├── .bowerrc
├── .gitignore
├── bower.json
├── Gruntfile.coffee
├── package.json
└── README.md