Get started with Mini SSG

Mini SSG built with NodeJS, so Node/NPM is needed

1. Install mini-SSG with npm

If you're new to Node/NPM, install it first


npm init -y 				
npm install mini-ssg

2. Add this script to your package.json


  "scripts": {
    "start": "minissg",
    "dev": "minissg --watch",
  },

Key Concept:

All HTML files you want to render must be in '/dev/pages/'

Other static files that don't change (ex: css, js, sitemap.xml, etc..) lives in /dev/static/

3. Next is up to you

Depend on what you need (check tour) for all syntax. Let's say we want to make a page with same header and footer

3a. Create dev/pages/index.html, with this value


@import(header)		
<p>Your awesome content</p>
@import(footer)

*@import(NAME) //could be anything match your .html files

3b. Now create header.html and footer.html inside dev/_imports folder, with any content you want


<!-- Ex: in dev/_imports/header.html -->
<h1>Your Brand</h1>				
<p>This is header</p>

<!-- Ex: in dev/_imports/footer.html -->			
<p>This is footer</p>

3c. Run this command (your choice)


npm run start		
//or
npm run dev

*npm run dev will run a live server at http://127.0.0.1:8080 and watch any file changes

*npm run start will just render your page

caveat: it delete all public folder and start from scratch, so remember to delete your trash bin later

3d. Your site is ready on /public folder.
Whenever your deploy it, tell your provider to serve your site from '/public'

4. Continue creating other files,
depend on what you need (check tour) for all syntax.

Want to see a complete example? check this website repo

//Folder structure example


/YourProject
	/dev
		/_layouts
			/base.html
		/_components
			/alert.html
		/_imports
			header.html
			footer.html
		/pages
			/index.html
			/about.html
		/static
			/assets/css/main.css
					/js/main.js
			otherstatic.xml

	/public (Your ready to deploy folder. Auto generated for you)