LiteNode Markdown App

A step-by-step tutorial that teaches you how to build a Markdown-based web application in Node.js — using LiteNode as both the web framework and the subject of study.

Live site: litenode-markdown-app.pages.dev

---

What you'll build

A fully working documentation site that reads Markdown files, renders them as HTML, and can be deployed as a static site — no server needed. The tutorial app you're reading is the app you'll build.

What you'll learn

• How to parse Markdown files and extract frontmatter with LiteNode
• How to convert Markdown content to HTML with Marked
• How to add syntax highlighting with highlight.js
• How to build reusable HTML templates with LiteNode's template engine (STE)
• How to handle multiple pages with a single dynamic route
• How to organize a Node.js backend into focused, maintainable modules
• How to use conditionals and loops in templates
• How to add and load static assets — styles, scripts and images
• How to generate a fully static site and deploy it for free

Tutorial structure

Phase	Sections
1 — Getting Started	Installation · How It Works · Your First File
2 — Building the App	Templating · Unified Routes · Code Highlighting
3 — Structuring	Sliced Backend · Conditionals · Loops
4 — Going Further	Styling · Islands Architecture · Static Site · Markdown Cheat Sheet

Dependencies

Package	Version	Role
litenode	^4.7.0	Web framework, Markdown parsing, templating
marked	^18.0.0	Converts Markdown to HTML
highlight.js	^11.11.0	Syntax highlighting for code blocks
marked-highlight	^2.2.0	Connects Marked and highlight.js

Getting started

# Clone the repo
git clone https://github.com/LebCit/litenode-markdown-app.git
cd litenode-markdown-app

# Install dependencies
npm install

# Start the server
npm start

# For development with auto-restart on file changes
npm run dev # Requires Node 20.13+

Open http://localhost:5000.

Build the static site

npm run build

Output goes to _site/. Preview it locally:

npx serve _site

Project structure

├── index.js                  # Entry point
├── functions/
│   ├── initialize.js         # Shared app + marked instances
│   ├── markedParseAndHighlight.js
│   ├── buildMenu.js          # Sidebar menu builder
│   └── build.js              # Static site generator
├── routes/
│   ├── entryRoute.js         # Homepage (/)
│   └── tutorialRoute.js      # Tutorial pages (/tutorial/:href)
├── static/
│   ├── css/app.css           # All styles — dark theme, no frameworks
│   └── js/
│       ├── tutorial.js       # Sidebar, TOC, copy buttons, scroll
│       └── externalLinks.js  # Opens external links in new tab
└── views/
    ├── index.md              # Homepage content
    ├── layouts/index.html    # Root layout
    ├── components/           # head, header, footer, main variants
    └── markdown/             # 13 tutorial pages

Deploy

The static build output (_site/) can be deployed to any static host:

• Cloudflare Pages — build command: npm run build, output: _site
• Netlify — same settings
• Vercel — set output directory to _site
• GitHub Pages — push _site/ to gh-pages branch

License

MIT — see LICENSE for details.

Made by LebCit.