coderfin / static-site

An example of a static site using gh-pages

#Create A Static Site Using Harp and GitHub Pages

This repository demonstrates an example of how to create a static site that can be hosted on GitHub using GitHub Pages.

##Dependencies

• Node 5.6.0+
• NPM 3.6.0+

##Steps ####harp.js

1. Create and clone a GitHub repo
2. cd path/to/repo and npm init
3. Create a directory with the same name as your repo within your repo
   • example-repo -> example-repo
4. Create .jade files within this new folder
   • example-repo -> example-repo -> views -> layout.jade
5. npm install --save-dev harp
6. node_modules/.bin/harp server .
   • Note the dot (.) at the end
7. Browse to http://localhost:9000/example-repo

####jspm

1. npm install --save-dev jspm
2. jspm init
   • baseURL = ./example-repo
   • jspm packages folder = ./example-repo/scripts/jspm_packages
   • config file path = ./example-repo/scripts/config.js
   • client baseURL = /example-repo

####code

1. Add desired styles, templates, scripts, and other files as desired
2. node_modules/.bin/harp compile example-repo dist
3. Add a .gitignore file
   • include node_modules and example-repo/**/jspm_packages but do not include any files in dist

####GitHub

1. Commit and push everything
2. git subtree push origin gh-pages -P dist
   • git-subtree
     • A subtree is just a subdirectory that can be committed to, branched, and merged along with your project in any way you want.
   • -P or --prefix
     • Specify the path in the repository to the subtree you want to manipulate.

##Helpful Links

• https://staticsitegenerators.net/
• http://harpjs.com/
• http://jspm.io/
• http://jspm.io/
• http://lesscss.org/
• git-subtree