Open terminal and go to /builder folder. Install all node dependencies:
npm install
Then go to /site folder and install php dependencies:
composer install
You'll also need imagemagick and GraphicsMagick.
This bootstrap supports simple website with static content, as multilingual websites with dynamic content. Everything is made for just doing HTML, CSS and Javascript. No PHP.
You'll need 4 subdomains:
- dev: your website
- manage: the CMS
- services: to get dynamic content from the CMS
- uploads: to get pictures from the CMS
You have a site/config.php where you have several parameters:
All static content are in site/dev/json folder. If you have a multilingual website, json files will be in a folder named as the language. You'll need multiple json files:
- 404.json
- global.json: for all global content such as analytics ID, facebook page link...
- old.json: for the page for old browsers
- routes.json: for routing
Then all pages will be linked thanks to the URL. For example, if the user go to /en/works, the bootstrap will look for two files:
- json/en/works/content.json
- json/en/works.json
All content json files are optionnal.
Bootstrap will you Cockpit CMS. For now, just collections are used.
Data can be retrieved thanks to services subodmain. If you have a collection named blog and a multilingual article with title article in english, you'll have to call:
services.domain/en/blog/article-in-english
Pictures are uploaded in manage/uploads by default. But in your website, you'll have to get it thanks to uploads subdomain, followed by the name or path of the picture.
We use gulp for building everything.
Just run gulp
in builder folder to run gulp.
You can configure everything via the builder/config.json files. You can list sources et destination files for each tasks.
We use coffeescript, but it's working with a full javascript app.
We use scss for the CSS.
Sprites automatically generated and can be displayed through the mixin @include sprite('filename')
.
Favicons can be generated thanks to gulp favicons
.
Everything is minimised with gulp dist
.