Markdown starter
Serve pages written in Markdown, rendered on the server with marked.
Open in editor Free. Runs in your browser, no sign-up.
- marked
Markdown
The code
Two files, exactly what you get in the editor.
import { createServer } from 'node:http'
import { marked } from 'marked'
const pages: Record<string, string> = {
'/': `# Welcome
This site is **Markdown**, rendered by a tiny server.
- [About](/about)
- [Changelog](/changelog)`,
'/about': '# About\nWritten in a single `index.ts` on jsdrop. [Home](/)',
'/changelog': '# Changelog\n- **v1**: It works. [Home](/)',
}
const server = createServer(async (req, res) => {
const source = pages[new URL(req.url ?? '/', 'http://localhost').pathname]
res.writeHead(source ? 200 : 404, { 'content-type': 'text/html; charset=utf-8' })
res.end(`<!doctype html><meta name="viewport" content="width=device-width, initial-scale=1">
<style>body{font:17px/1.6 Georgia,serif;max-width:640px;margin:40px auto;padding:0 16px}</style>
${await marked.parse(source ?? '# Not found\n[Home](/)')}`)
})
const port = Number(process.env.PORT) || 3000
server.listen(port, () => console.log(`Markdown site on port ${port}`))
Questions
Can I run Markdown in the browser?
Yes. Press Run and the program runs in a Node.js-compatible runtime, compiled to WebAssembly, right in your browser tab. npm packages install in the browser too.
How do I start a Markdown project online?
Click Open in editor. jsdrop copies this starter into a new drop with index.ts and package.json. Press Run to start it, and edit as you go.
Can other people reach my server?
Yes. When the program calls listen(), the preview shows the server and a public tunnel URL that works while your tab runs it. With Pro, deploy the drop to run around the clock at its own address.
Is it free?
Yes. Public drops, running in the browser, live collaboration, versions, and embeds are free, and you do not need an account to start.