Flat and responsive website template, designed and coded by Maxim Orlov.
www.ziomarie.com
./
├── .editorconfig
├── gulpfile.js
├── package.json
├── README.md
|
├── gulp_tasks/ * gulp tasks
| ├── config/ * gulp tasks config
│ | ├── paths.js
│ | └── aliases.js
│ |
| └── task.js
|
├── screenshots/ * responsive test screenshots
|
├── dev/ * site source
│ ├── images/ * image sources
| │
│ ├── pug/ * templates
| | ├── blocks/ * blocks library
| │ | └── block.pug
| │ ├── helpers/ * helper mixins
| │ ├── vendor/ * third-party code
| │ ├── layouts/ * page layouts
| │ └── pages/ * main pages templates
| │
│ ├── js/ * source js
| | ├── vendor/ * vendor scripts library
| | ├── lib/ * site scripts library
| │ ├── head.js * head scripts
| │ └── body.js * body scripts
| │
| ├── sass/ * sass preprocessor styles
| | ├── blocks/ * blocks library
| │ | └── block.sass
| │ ├── helpers/ * mixins and vars
| │ ├── vendor/ * third-party code
| │ ├── custom.sass
| │ ├── noscript.sass
| │ └── screen.sass
| │
│ ├── helpers/ * helper files
| | ├── favicon.ico
| | └── .htaccess
| │
│ ├── fonts/ * font sources
| │
│ └── data/ * configs and data for templates
│
└── build/ * built source
├── index.html
├── page.html
|
└── static/ * static assets
├── css/ * minified styles
|
├── images/ * minified images
│
├── js/ * minified assembled js
|
└── fonts/ * @font-face-ready webfonts
This project has an .editorconfig file at the root. It describes indent style, trailing whitespaces etc. See more details here
If you haven’t used Gulp before, be sure to check out the Getting Started guide, also check these recips
Before start you need to have installed npm , as well as gulp globally.
A few simple steps to start:
package.json
by running: npm install
.dev/data/config.json
See Site configuration sectionThis boilerplate uses Pug templates with external data configs.
Main settings can be found in dev/data/config.json
file. And they’re available for usage in templates with config.key-name
Here comes groups ofgulp tasks with some explanations
Remove placeholders from work directories.
Gulp: gulp cleanup
Dev task with static server.
Gulp: gulp dev
Build task.
Gulp: gulp build
Regenerate and build project by running all tasks.
Gulp: gulp rebuild
Run server without watching for changes.
Gulp: gulp server
This project uses BrowserSync as static server with enabled and configured live reload option.