havanese

havanese is an opinionated workflow to build front-end websites with pug, js and (s)css.

"The pug's friendly nature is best paired with other stable, happy-go-lucky breeds such as poodles, Havanese, Maltese, beagles, Labrador retrievers and several others." Source

Getting started

Install havanese with yarn:

yarn add havanese

Add dev and build commands to your package.json:

{
  "scripts": {
    "dev": "havanese dev",
    "build": "havanese build"
  },
}

Now to setup your project:

• Create a page in pages/index.pug
• Create a javascript file to go with it: pages/index.js
• Import all javascript and css in the js file.

Example:

//- index.pug

html
  body
    div
      h2 nog een subtitel joh, fantastisch
      p met wat text

// index.js

import "pages/global.css";
console.log("Hello world");

/* global.css */

body {
  background-color: hotpink;
  margin: 0;
  padding: 0;
}