markdown-up

MarkdownUp is a Markdown viewer. This is the MarkdownUp frontend application.

Links

• MarkdownUp Application
• Source code

View Local Markdown Files

To view local Markdown files, use the MarkdownUp backend application from a terminal prompt:

pip install markdown-up
markdown-up

Host Markdown Web Pages

To host a Markdown resource, add the MarkdownUp application HTML stub to the directory containing your Markdown files:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>MarkdownUp</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="https://craigahobbs.github.io/markdown-up/app.css">
        <link rel="preload" href="https://craigahobbs.github.io/markdown-up/bare-script/static/markdown.css" as="style">
        <link rel="modulepreload" href="https://craigahobbs.github.io/markdown-up/lib/appImports.js" as="script">
    </head>
    <script type="module">
        import {MarkdownUp} from 'https://craigahobbs.github.io/markdown-up/lib/appImports.js';
        const app = new MarkdownUp(window);
        app.run();
    </script>
</html>

To test your Markdown page, start a local static web server:

python3 -m http.server

By default, MarkdownUp fetches the "README.md" resource. To change the default resource, update the application stub file, index.html. For example:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>MarkdownUp</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="https://craigahobbs.github.io/markdown-up/app.css">
        <link rel="preload" href="https://craigahobbs.github.io/markdown-up/bare-script/static/markdown.css" as="style">
        <link rel="modulepreload" href="https://craigahobbs.github.io/markdown-up/lib/appImports.js" as="script">
    </head>
    <script type="module">
        import {MarkdownUp} from 'https://craigahobbs.github.io/markdown-up/lib/appImports.js';
        const app = new MarkdownUp(window, {'url': 'other.md'});
        app.run();
    </script>
</html>

To view a different Markdown resource, set the application's "url" hash parameter (i.e., "http://127.0.0.1:8000#url=other.md").

MarkdownUp Applications

MarkdownUp applications are Markdown files that contain code. Add a markdown-script fenced code block of BareScript to any Markdown file, and when MarkdownUp renders the file, it runs the script and renders its output in place of the code block. You can learn more from the MarkdownUp backend application's README.

Debug Mode

Debug mode logs the script runtime duration and runs the BareScript linter, which performs static code analysis on your code and reports warnings for any issues found.

To turn on debug mode, click the debug button in the MarkdownUp menu in the upper-right of the page.

Development

This package is developed using javascript-build. It was started using javascript-template as follows:

template-specialize javascript-template/template/ markdown-up/ -k package markdown-up -k name 'Craig A. Hobbs' -k email '[email protected]' -k github 'craigahobbs'