A basic website for a fictitious coffeehouse based on Bootstrap running on Generic Hipster Coffee

First time installation

Install latest node.js

Install gulp-cli globally

npm install -g gulp-cli

Install all packages from package.json locally

npm install

Development

To develop with automatic compilation and browser refreshing run

gulp

And see the result on http://localhost:3000/

Build

To build everything once (in /dist/ folder)

gulp build

CSS (Sass preprocessor)

index.css is compiled from src/scss/index.scss by Sass.

HTML (Twig templates)

HTML is generated from Twig.js templates (JavaScript impementation of Twig templating language) in src/templates.

Start templates that are not pages with _. Typically these are templates used for include or extend.

Documentation for Twig.

Warning: Twig.js doesn't implement 100% of Twig.

There are some data about our coffees to be available in all templates, use templates/data.json for that.

Static files (JavaScript, images, …)

Folders and files from /src/static/ are just copied directly to /dist/ folder.

Libraries

This website is made with Bootstrap 4 beta.

Not necessary components are commented out to reduce final 'index.css' file size. If you need some other components, go to /src/index.scss or /src/_custom-bootstrap-variables.scss and uncomment it.

See gulpfile.js for supported browsers.

Deployment

Upload everything in /dist/ folder to the server. If you want to to deploy a new version, please contact me at danko.vktr at gmail.com.

Surge.sh

You can use surge.sh free service for that.

1. Install surge client npm install --global surge.
2. Run surge manually once in /dist: you will create an account with surge.sh.
3. Set your own domain in gulpfile.js (replace https://my-first-website.surge.sh).
4. From now on run gulp deploy whenever you want to publish a new version.