⚫️ Mini SSG

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

    <p>Your awesome content</p>

    *@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		
    npm run dev

    *npm run dev will run a live server at 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
    	/public (Your ready to deploy folder. Auto generated for you)