keldLundgaard / sandbox-website

Sandbox Website

The build system is based on this repository.

Workflow:

1. Make html structure using pug
2. Write styling in Sass
3. Write js in ES2015 compiled by Webpack
4. Have an auto-refreshing browser preview using Browsersync

Collaboration guide

Members are welcome to form this repository and submit pull requests. What you need to know:

Element	Source	How to interact
Static pages	src/*.pug	Every pug file in the src/ folder becomes a page.
CSS/SASS	src/css/*.scss	The styles.scss is the main file that imports sub files
Javascript	src/js/main.js	You can add js directly or use npm style modules using ES2015

After making your local edits run the production build and push.

Opening this website locally

Run the development environment:

git clone https://github.com/actuallymentor/sandbox-website.git
npm install
npm start # This will open the preview on your browser

Any changes you make to the code will be instantly reflected in the browser due to the browsersync integration.

To make the final build version:

npm run build

The final build version is compiled to the docs/ folder.