This is a mix work in progress from 2 projects:
A starting point for meteorjs applications, includes Iron Router, Bootstrap 3, Font Awesome, LESS and Coffeescript.
- File Structure
- Coffeescript
- LESS
- Iron Router
- Accounts-Entry
- Bootstrap 3.1.1
- Font Awesome 4.1.0
Just run meteor
We have a common file structure we use across all of our meteorjs apps. The structure keeps view-dependent files together (.html
, .less
, .coffee
).
.meteor
client
├── accounts
├── compatibility
├── router
└── stylesheets
└── lib
├── bootstrap.css
└── font-awesome.css
├── global.less
├── mixins.less
└── variables.less
└── views
└── dashboard
├── dashboard.html
└── dashboard.less
└── home
├── home.html
├── home.less
└── home.coffee
├── footer.html
├── header.html
├── index.html
└── loading.html
collections
└── user.coffee
packages
public
├── fonts
└── favicon.ico
server
├── views
├── accounts.coffee
└── publications.coffee
Includes 4 LESS variables to make responsive design super easy. Each variable (xs
, sm
, md
, lg
) coincides with Bootstrap media queries.
h1 {
font-size: 24px;
@media @lg {
font-size: 36px;
}
}
Search engines rely on <title>
and <meta>
tags to read page titles and descriptions. You can specify these for each page in your app by including the following in the corresponding page's .coffee
file. (Sample included in home.coffee)
Tempate.home.rendered = ->
document.title = "My New Meteor App"
$("<meta>", { name: "description", content: "Page description for My New Meteor App" }).appendTo "head"
work in progress