npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

steelsky

v3.0.2

Published

A *very* lightweight, no BS static site generator written in NodeJS.

Downloads

12

Readme

STEEL SKY

A very lightweight, no BS static site generator written in NodeJS.

Automatically converts an arbitrary directory structure containing markdown and other static assets into a static site with no external dependencies.

Features

  • Handles bulk conversion of Markdown files to HTML
  • Preserves original arbitrary directory structure
  • Supports arbitrary static assets
  • Simple vanilla HTML/CSS "templating" system
    • Add your own front-end frameworks!
  • No lock-in
    • Your original markdown files stay perfectly intact and portable
  • Automatically generates a JSON site index file
    • Useful for site searches ect.
  • Generated files have no external dependencies and can work fully offline
  • As minimalist as possible while remaining functional and modern

Depends On

  • Showdown
  • Showdown-highlight

Install

npm install steelsky

Initialize

You can init a new SteelSky project in an empty directory like this:

steelsky init

How it Works

A basic SteelSky directory structure looks like this:

root/
--sscfg.json
--source/
----PageA.md
----PageB.md
----PageC.html
----Images/
------Image.jpg
---- ...
--layout/
----header.html
----footer.html
----theme.css
--build/
---- ...

When you run the steelsky command you will get some output in your ./build directory like this:

build/
--PageA.md
--PageB.md
--PageC.html
--Images/
----Image.jpg
-- ...

These files can be served with any web server software you want. Such as Apache or NGinx.

Config

SteelSky uses a very simple config file:

{
    "sourcePath": "./source",
    "layoutPath": "./layout",
    "highlightStyle": "monokai-sublime",
    "outPath": "./build/"
}

Each property is required and there are no other properties which are not listed here.

Meta Data

Each markdown file in your source directory can optionally contain a SteelSky meta element.

<steelsky>
{
  "title":"Home",
  "description":"The home page."
}
</steelsky>

This can contain any valid JSON data but it usually has the following properties:

  • title
  • description

This JSON object is added into the meta property of this pages entry in the automatically generated listing.json file. This data is also available to any JS running on the page itself via the ssmeta object which is automatically added to any page with this meta element.

Note: Ensure that you have valid JSON here or you will cause JS errors when your page is rendered by the browser!

Why did I write this?

Over the years I've had my site running on several different systems. Off the top of my head:

I won't go into to detail about why each one of these systems wasn't what I was looking for because ultimately they all had the same problem. They are all much more complex than then need to be.

What I was looking for a was a system that would offer these features:

  • Turn Markdown into valid HTML
  • Handle syntax highlighting
  • Handle indexing/listing files

I think that a static site generator should be as simple as possible only doing the bare minim required to generate the site.