# Site making ## Concept I don't use HTML. It's so 90s. I don't use CMS. It's corpo. I don't use frameworks. You do it yourself. I write text, and the page is intantiated. It's OOP. ※ Read with the most annoying teenager voice imaginable: I'm a writer! ## The HTML Well you need some. Barebone, the layout, title, loading. ``` Cyberpunk - Still the future
``` That's it! It just loads the Javascript and CSS. ## The markdown file I just create a md file. It is super easy : ``` # Title Text ## Subtitle List : - item 1 - item 2 # Link [Caption name](url or path) ``` I don't have to think HTML or formating. ## The Javascript Well it does only one thing : convert a md file to HTML using my CSS and display it. I don't even do the whole markdown specification, only what I need. ``` // ---- inline MD parser ---- function parseMD(md) { const lines = md.replace(/\n+$/, "").split("\n"); let html = ""; let inList = false, listTag = ""; let inFence = false, fenceLines = []; const closeList = () => { if (inList) { html += `\n`; inList = false; listTag = ""; } }; const inline = (s) => s .replace(/&/g, "&") .replace(//g, ">") .replace(/\*\*(.+?)\*\*/g, "$1") .replace(/\*(.+?)\*/g, "$1") .replace(/`(.+?)`/g, "$1") .replace(/!\[([^\]]*)\]\(([^)]+)\)/g, '$1') .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '$1'); const escapeHTML = (s) => s.replace(/&/g, "&").replace(//g, ">"); for (const raw of lines) { const line = raw; if (line.trim().startsWith("\`\`\`")) { if (!inFence) { closeList(); inFence = true; fenceLines = []; } else { html += `
${escapeHTML(fenceLines.join("\n"))}
\n`; inFence = false; fenceLines = []; } continue; } if (inFence) { fenceLines.push(raw); continue; } const h = line.match(/^(#{1,6}) (.+)/); if (h) { closeList(); html += `${inline(h[2])}\n`; continue; } if (/^---+$/.test(line.trim())) { closeList(); html += "
\n"; continue; } if (/^> /.test(line)) { closeList(); html += `
${inline(line.slice(2))}
\n`; continue; } const ul = line.match(/^[-*] (.+)/); if (ul) { if (listTag !== "ul") { closeList(); html += "