jellybean

v1.0.10

Published

3 years ago

From one small program, you can create an entire website. Jellybean is a static site generator created in Node.js that lets you easily convert your text/markdown files into HTML.

Downloads

0High
0Medium
0Low

lyu4321

ssg

Jellybean

From one small program, you can create an entire website. Jellybean is a static site generator created in JavaScript and Node.js that lets you easily convert your text/markdown files into HTML.

Main Features

A single text/markdown file or folder containing multiple files can be converted into HTML files.
The title of the page, which is the first line of a file if followed by two blank lines, will be automatically generated.
Generated files are stored in a dist folder and style is provided by a style.css file. The default language is set to en-CA. Custom folders, styles, and languages can be specified using optional flags.
Markdown files will be parsed for markdown syntax in order to generate the proper HTML.

Installation

Download Node.js (version 14+)
Run the following command

npm install -g jellybean

Running the Program

Path to an existing text/markdown file

jellybean --input <file>
jellybean -i <file>

Path to an existing folder containing multiple files

jellybean --input <folder>
jellybean -i <folder>

The input path to either an existing text/markdown file or a folder containing multiple files is required. Please specify the input path using the --input/-i flag or by adding it as "input" in a JSON config file.

The contents of each file will be converted into an HTML file with the same name and stored in the output directory specified or in the dist directory if no output directory is specified. If a folder contains non-text/markdown files, these files will not be converted into HTML.

| Flag | Description | | ----------------------- | ----------------------------------------------------------------------------------------------------------------- | | --output/-o <folder> | Path to an output directory where generated pages will be stored | | --stylesheet/-s <URL> | Stylesheet URL to be used to style the generated pages | | --lang <string> | The lang attribute for the <html> tag of each page, describes the language of a page, set to 'en-CA' by default |

JSON Config File

Instead of passing options through the command line, a path to a JSON config file can be provided. This JSON file needs to contain at least "input" with the path to the file or folder.

| Flag | Description | | ------------------------- | --------------------------------------------- | | --config/-c <file.json> | Path to a JSON config file containing options |

Example JSON file

{
    "input": "Sherlock-Holmes-Selected-Stories",
    "output": "./web",
    "stylesheet": "https://cdn.jsdelivr.net/npm/water.css@2/out/water.css"
}

Getting Help

jellybean --help
jellybean -h

Getting the Version

jellybean --version
jellybean -v

Example Using a File

jellybean -i Sherlock-Holmes-Selected-Stories/The Adventure of the Six Napoleans.txt -l en-US -o customoutput -s https://cdnjs.cloudflare.com/ajax/libs/tufte-css/1.8.0/tufte.min.css

Original File:

Sherlock-Holmes-Selected-Stories/The Adventure of the Six Napoleans.txt

THE ADVENTURE OF THE SIX NAPOLEONS


It was no very unusual thing for Mr. Lestrade, of Scotland Yard,
to look in upon us of an evening, and his visits were welcome to
Sherlock Holmes, for they enabled him to keep in touch with all
that was going on at the police headquarters. In return for the
news which Lestrade would bring, Holmes was always ready to
listen with attention to the details of any case upon which the
detective was engaged, and was able occasionally, without any
active interference, to give some hint or suggestion drawn from
his own vast knowledge and experience.

Generated File:

customoutput/The Adventure of the Six Napoleans.html

<!DOCTYPE html>
<html lang="en-US">
    <head>
        <link
            rel="stylesheet"
            href="https://cdnjs.cloudflare.com/ajax/libs/tufte-css/1.8.0/tufte.min.css"
        />
        <meta charset="utf-8" />
        <title>THE ADVENTURE OF THE SIX NAPOLEONS</title>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
    </head>

    <body>
        <div>
            <ul>
                <li><a href="./index.html">Home</a></li>
                <li>
                    <a href="./The Adventure of the Six Napoleans.html"
                        >The Adventure of the Six Napoleans</a
                    >
                </li>
            </ul>
        </div>
        <h1>THE ADVENTURE OF THE SIX NAPOLEONS</h1>
        <p>
            It was no very unusual thing for Mr. Lestrade, of Scotland Yard, to
            look in upon us of an evening, and his visits were welcome to
            Sherlock Holmes, for they enabled him to keep in touch with all that
            was going on at the police headquarters. In return for the news
            which Lestrade would bring, Holmes was always ready to listen with
            attention to the details of any case upon which the detective was
            engaged, and was able occasionally, without any active interference,
            to give some hint or suggestion drawn from his own vast knowledge
            and experience.
        </p>
    </body>
</html>

Example Using a Folder

node src/index.js -i Sherlock-Holmes-Selected-Stories

In the Sherlock-Holmes-Selected-Stories folder, if you have the files:

notatextfile.js
Silver Blaze.txt
The Adventure of the Six Napoleans.txt

In the dist folder, the following files will be generated:

index.html
Silver Blaze.html
style.css
The Adventure of the Six Napoleons.html

For markdown files (.md), the program will parse markdown to HTML tags. Full markdown support is provided through markdown-it.

Example Using a Markdown File

Original File:

README Excerpt.md

# Jellybean

From one _small_ program, you can create an **entire** website. Jellybean is a static site generator created in Node.js that lets you easily convert your text/markdown files into HTML.

## More Info

For more information, please visit [the GitHub repository](https://github.com/lyu4321/jellybean).

Generated File:

README Excerpt.html

<!DOCTYPE html>
<html lang="en-CA">
    <head>
        <link rel="stylesheet" href="style.css" />
        <meta charset="utf-8" />
        <title> </title>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
    </head>

    <body>
        <div id="nav">
            <div>
                <ul>
                    <li><a href="./index.html">Home</a></li>
                    <li><a href="./test.html">test</a></li>
                </ul>
            </div>
        </div>
        <h1></h1>
        <h1>Jellybean</h1>
        <p>
            From one <em>small</em> program, you can create an
            <strong>entire</strong> website. Jellybean is a static site
            generator created in Node.js that lets you easily convert your
            text/markdown files into HTML.
        </p>
        <h2>More Info</h2>
        <p>
            For more information, please visit
            <a href="https://github.com/lyu4321/jellybean"
                >the GitHub repository</a
            >.
        </p>
    </body>
</html>

Contributing

Please see the Contributing Docs for more information.

Live Demo

https://lyu4321.github.io/jellybean

Author

Leyang Yu

License

MIT