I built my own static site generator.
Roshan Acharya
Posted on July 22, 2020
Hi everyone,
I'm writing my first article on dev.to and it's about the static site generator I have been building.
About a month ago, I saw a website called StaticGen
(StaticGen has a list of static site generators for Jamstack sites). There were a lot of static sites generators that I thought why not challenge myself to build a static site generator.
I knew that ssg generates static sites from markdown and other formats of files but I had no idea how. So, I did what must of us programmers do. I searched in google, "How to build static site generator". I found one useful blog which was a tutorial about creating a static site generator.
After researching a bit, I begin to create my own static site generator. I was going to use mustache as a templating engine but I thought why not create my own templating engine. I used vm
module of nodejs and some regex to create a simple templating engine.
Roshan💥 JavaScript 💥@acharyaroshanjiCompile and run javascript code within V8 Virtual Machine contexts using vm module.
#100DaysOfCode #Nodejs #webdev #javascript #CodeNewbie13:00 PM - 17 Jul 2020
I used some npm packages like frontmatter
, remarkable
to parse markdown files. Then I built a live reload development server form scratch for my static site generator using chokidar
and ws
.
I named my static site generator as ulka (meteor) and my templating engine as ulka-parser and published them to npm. Then I created a new npm package create-ulka-app
which clones a default starter (https://ulka-starter-default.netlify.app/) from GitHub and installs the npm packages.
ulka: https://github.com/ulkajs/ulka
ulka-parser: https://github.com/ulkajs/ulka-parser
Ulka's working methodology is simple. It parses markdown and ulka files and creates html files. It changes the name of all assets and store in a single folder. Also, you can use javascript inside markdown files. Ulka also provides feature postParse and preParse that accepts array of functions that will run before(prePrase) or after(postParse) parsing markdown files.
It's not completed yet, but my exams are coming soon. So, I will continue working on this after 1 month. It was fun creating it while learning.
Posted on July 22, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.