|Typography goes HARD >:3

JSsg - Java Script Static Site Generator

Idea

markdown
html templates
front matter
templates
- should handle nested tempaltes
- handle for loops
- handle if statements
build pipeline: what steps, how many? whats a step and whats a helper? when is what?
Routing and predictable paths
Handling collections
configuration system: config.js
developer server

Example

this markdown:

---
title: Hello World
published: 2026-03-25
description: A greeting to the world.
category: Test
author: Jia-Rou
---
Here is some content, this is separate from front matter.

plus this structure:

const title = `frontmatter.title  site.title`  site.title;
const published = frontmatter.published  "no fallback yet";
const description = frontmatter.description  site.description;
const category = frontmatter.category  null;
const author = frontmatter.author  site.author;
const body = frontmatter.body;
const slug = slugify(title);
const permalink = `'/', ${slugify(category)}, '/', ${slugify(title)}, '/'`;
const url = `${site.domain}, '/', ${permalink}`

with markdown to html conversion implemented

should output this data:

{
    "title": "Hello World",
    "published": 2026-03-25,
    "description": "A greeting to the world.",
    "category": "Test",
    "author": "Jia-Rou",
    "body": "Here is some content, this is separate from front matter.",
    "html": "<p>Here is some content, this is separate from front matter.</p>",
    "slug": "hello-world",
    "permalink": "/test/hello-world",
    "url": "https://example.com/test/hello-world"
}

then with adding this template:

<html>
<head>
    <title>{{page.title}}</title>
</head>
<body>
    <a href="{{page.url}}"><h1>{{page.title}}</h1></a>
    <time>{{page.published}}</time>
    <p>{{page.description}}</p>
    <p>{{page.category}}</p>
    <p>{{page.author}}</p>
    <main>{{content}}</main>
</body>
</html>

it becomes the final page of

<html>
<head>
    <title>Hello World</title>
</head>
<body>
    <a href="https://example.com/test/hello-world"><h1>Hello World</h1></a>
    <time>2026-03-25</time>
    <p>A greeting to the world.</p>
    <p>Test</p>
    <p>Jia-Rou</p>
    <main>
        <p>Here is some content, this is separate from front matter.</p>
    </main>
</body>
</html>

It should also handle category, to make this possible:

<ul>
    {{ for entry in category.test }}
    <li><a href="{{page.permalink}}">{{page.title}}</a></li>
    {{ endfor }}
</ul>

Configuration

It should use the site’s configuration as constants instead of set values.

{
    "Title": "JSsg Site",
    "Description": "A small static site generator made in JavaScript.",
    "Author": "Jia-Rou",
    "Domain": "https://example.com",

    "input": "input/content/",
    "static": "input/static/",
    "output": "output/",
    "templates": "templates/",
}