Blog Network Dashboard

A Serverless, Decentralized Blogging Platform built with React, SQLite (WASM), and the v86 x86 Emulator. This application uses a GitHub repository as a database backend and runs entirely in the browser.

🌟 Usecase

• Decentralized Publishing: No backend server required. All data resides in a static SQLite file.
• Virtual Machine: Integrated x86 emulator (v86) booting Linux/DOS in the browser, with state persisted to the database.
• Data Visualization: 3D Force-Directed Graph of posts and comments.

🏗 Architecture & Dataflow

High Level

Client Browser <--> GitHub Pages (Static Assets) <--> GitHub Repo (Data Persistence)

Blogs

• blogs are stored as markdown in ./blogs
• schema is stored as js in ./blogs/config.ts and ./scripts/create_db.js

Dataflow Diagram

[ User Browser ]
      |
      | 1. Read (sql.js-httpvfs)
      v
[ Static SQLite File ] (Hosted on GitHub Pages)
      ^
      | 4. Rebuild & Deploy (GitHub Actions)
      |
[ GitHub Repository ]
      ^
      | 3. Git Push (JSON/Binary Deltas)
      |
[ Admin Dashboard ] (Client-side Write)

🚀 Setup & Install

Run Install Script:

chmod +x install_full_blog_network.sh
./install_full_blog_network.sh

Start Development Server:

npm start

Access App:

URL: https://localhost:3000 (Accept self-signed cert).
Admin Login: 123abc

📖 Usage Instructions

1. Admin Tools

Login: Click "Admin" tab. Default password is 123abc.
Sidebar: Toggle sidebar with « button.
New Post: Use the Block Editor (Editor.js) to write content. Click "Publish" to save to local memory DB.
Comments: View pending comments. Approve or Reject them.

2. v86 Terminal Emulator

Boot: Select an OS (Linux 4, FreeDOS, Windows 1.01) from the dropdown.
Console: Use the xterm.js terminal to interact with the OS via Serial Port.
State Management:
Auto-Save: The emulator saves state to SQL automatically after 5 seconds of inactivity.
Manual Save: Click "Save State" to persist the snapshot immediately.
Versions: The "Version: X" counter shows how many snapshots are stored in the DB.

3. Database Management

• The application runs on a Read-Only HTTP view of the database by default. To persist changes:

Go to Admin -> Settings.
Click Download DB Dump.
Commit this data to your repo (or use the GitHub Action flow below).

⚙️ GitHub Actions (Automated Updates)

• To allow the admin panel to update the live site:

Secrets: Add ADMIN_PASSWORD and GH_PAT (Personal Access Token) to GitHub Repository Secrets.
Workflow: The .github/workflows/deploy.yml (generated by script) listens for commits.
Trigger: When you push a JSON delta or trigger the workflow manually, it:
Rebuilds the SQLite database from source JSON.
Optimizes it for HTTP-VFS.
Deploys the new assets to gh-pages.

🛡 Security & Enhancements

• Security

Crypto: Passwords use PBKDF2 (100k iterations) + AES-GCM encryption.
Isolation: The emulator runs in a Web Worker with restricted DOM access.
Headers: Cross-Origin-Embedder-Policy: credentialless is used to allow external images while maintaining security for SharedArrayBuffer.
Future Enhancements
Lazy Loading: Split the 100MB+ OS images into chunks.
P2P Sync: Use WebRTC (PeerJS) to sync database state between admin users directly.
Search: Integrate FlexSearch for full-text indexing of the SQLite content.