Tuesday, October 25, 2022 at 6:48 PM

My simple blog generator: Hypertext Blogmaker

So in addition to the Hypertext HTML Document editor PWA app I made, I also created a quick NodeJS static blog generator which works with the docs that Hypertext spits out. 

You can grab it from Github here. 

Here's a quick intro on how to use it, first grab it from the repo, either with git or downloading the repo:

$ git clone https://github.com/russellbeattie/hypertext-blogmaker.git

$ cd hypertext-blogmaker

$ npm install

Once the dependencies are installed (it doesn't use many - just JSDOM for parsing, EJS for template, chokidar to watch for changes and an XML library), you can start to customize. 

• assets - contains the site's global images, scripts and CSS.
• templates - contains the .ejs templates for the header, footer, etc. 
• docs - contains the HTML Documents created with whatever you'd like, but I've only tested it with the ones created with Hypertext. 
• website - this is the default output folder. 

Next, edit the settings.json file: 

{
  "title": "Sample Hypertext Blog",
  "description": "This is my blog.",
  "home_page_url": "http://example.com/blog",
  "feed_url": "http://example.com/blog/rss.xml",
  "icon": "http://example.com/blog/images/bluesky.jpg",
  "favicon": "http://example.com/blog/",
  "author": {
    "name": "Author Name",
    "url": "http://example.com",
    "avatar": "http://example.com/blog/images/bluesky.jpg"
  },
  "initials": "AN",
  "twitter": "@example",
  "copyright": "© 2022 Author Name",
  "analytics": "UA-XXXXXX-X",
  "root": "/blog/",
  "siteheader": "<span>Example</span> Blog"
}

Once you've done that, you can run npm start and it will apply the templates and output an empty website, which it will serve on localhost:3000. 

Creating multiple blogs

If you want, you can put the folders in other locations so you can generate different blogs with the same script.

First, from the project directory, use the command line and enter: 

npm link 

This will put an entry in your path called "blogmaker" you can use from any folder. 

Next copy the docs, templates and assets folders and the settings.json file into another folder. To build the website, cd to that directory from the command line. 

• To build, type: blogmaker
• To build and serve, watching for changes: blogmaker serve

The latter is handy when using Hypertext so you can add images and see them in the editor. 

Any questions, feel free contact me in the usual places. 

-Russ