From d307ee5765b4347a48148a476a5dc045174097bd Mon Sep 17 00:00:00 2001
From: i1li <74943880+i1li@users.noreply.github.com>
Date: Sat, 4 May 2024 13:40:57 -0500
Subject: [PATCH] i

---
 README.md | 18 ++++++++++++++++--
 serv.js   | 25 +++++++++++++++++++++++++
 2 files changed, 41 insertions(+), 2 deletions(-)
 create mode 100644 serv.js

diff --git a/README.md b/README.md
index 8ce19c5..0a6472f 100644
--- a/README.md
+++ b/README.md
@@ -3,6 +3,12 @@ No frameworks, just pure JavaScript (a.k.a. vanilla JavaScript), CSS, and HTML.
 
 [Demo site](https://y0.netlify.app/) contains my personal writing, feel free to fork this repo and use it as a template.
 
+Quickstart: Open a terminal in the project directory, and enter
+```bash
+npm i express
+node serv.js
+```
+
 Default "display all posts" view at root directory, with posts auto-expanding upon scroll, shows a welcome intro message, plus navigation links.
 
 Individual post view at unique URLs removes the welcome intro from display, and autoscrolls post header to top. Also clones a copy of the post navigation links shown in the post header, to the bottom of post.
@@ -36,11 +42,19 @@ Easy to use YouTube embed that saves space, bandwidth, and privacy. With a bare
 Stripped version of Lightest Youtube Embed to toggle display of any iframe or other content. [Demo at /jesus-and-his-religion](https://y0.netlify.app/jesus-and-his-religion/)
 
 ### [yt-titles.js](https://github.com/i1li/i/blob/main/yt-titles.js)
-Updates all `<y-t>` elements on the page,  `<y-t v="Your Video ID">` becomes `<y-t v="Your Video ID" t="The Video's Title">`
+Updates all `<y-t>` elements on the page,  `<y-t v="Your Video ID">` becomes `<y-t v="Your Video ID" t="The Video's Title">` To use:
+```bash
+npm i axios
+node yt-titles.js
+```
 
 ### [yt-ids.js](https://github.com/i1li/i/blob/main/yt-id.js)
 - Extracts all IDs found within the v attribute of `<y-t>` tags. 
-- For playlists, it gets all the available video IDs for each, then moves the playlist ID from the v attribute to p, listing all video IDs in the v attribute. 
+- For playlists, it gets all the available video IDs for each, then moves the playlist ID from the v attribute to p, listing all video IDs in the v attribute. To use:
+```bash
+npm i axios
+node yt-ids.js
+```
 
 ### [shuffle.js](https://github.com/i1li/i/blob/main/js/shuffle.js)
 - proccessAndCombine combines all video IDs, (limiting how many come from each playlist), from the music section into one `<y-t>` element, at the top of [/edu/music](https://y0.netlify.app/edu/music).
diff --git a/serv.js b/serv.js
new file mode 100644
index 0000000..093d859
--- /dev/null
+++ b/serv.js
@@ -0,0 +1,25 @@
+const express = require('express');
+const app = express();
+const path = require('path');
+const { exec } = require('child_process');
+const PORT = process.env.PORT || 5000;
+app.use(express.static(path.join(__dirname)));
+app.get('/', (req, res) => {
+    res.sendFile(path.join(__dirname, 'index.html'));
+});
+app.listen(PORT, () => {
+    console.log(`Server is running on port ${PORT} - \x1b[34mhttp://localhost:${PORT}/\x1b[0m`);
+    openBrowser(`http://localhost:${PORT}/`);
+});
+function openBrowser(url) {
+    switch (process.platform) {
+        case 'darwin':
+            exec(`open ${url}`);
+            break;
+        case 'win32':
+            exec(`start ${url}`);
+            break;
+        default:
+            exec(`xdg-open ${url}`);
+    }
+}