feat: prepare for demo

Author: shelegdmitriy

.github/workflows/deploy.yml

@@ -0,0 +1,60 @@
+name: Deploy Demo to GitHub Pages
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  # Build job
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build demo
+        run: npm run build:demo
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+        with:
+          # Automatically enable Pages if not already enabled
+          enablement: true
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: './dist-demo'
+
+  # Deployment job
+  deploy:
+    runs-on: ubuntu-latest
+    needs: build
+    if: github.ref == 'refs/heads/main'
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -9,6 +9,7 @@ lerna-debug.log*
 
 node_modules
 dist
+dist-demo
 dist-ssr
 *.local
 

DEPLOYMENT.md

@@ -0,0 +1,58 @@
+# GitHub Pages Deployment Guide
+
+This guide explains how to deploy the ASIMOV Network Widget demo to GitHub Pages.
+
+## 🚀 Automatic Deployment (Recommended)
+
+The repository is configured with GitHub Actions for automatic deployment:
+
+1. **Enable GitHub Pages** in your repository:
+   - Go to Settings → Pages
+   - Set Source to "GitHub Actions"
+
+2. **Push to main branch** - the demo will automatically build and deploy
+
+3. **Access your demo** at: `https://asimov-protocol.github.io/asimov-network-widget/`
+
+## 📝 Manual Deployment
+
+If you prefer manual deployment:
+
+```bash
+# Build the demo
+npm run build:demo
+
+# Deploy to GitHub Pages
+npm run deploy
+```
+
+## 🔧 Configuration
+
+### Base Path
+The demo is configured for the path `/asimov-network-widget/`. If your repository has a different name, update the `base` property in `vite.demo.config.ts`:
+
+```typescript
+base: '/your-repo-name/',
+```
+
+### Build Scripts
+
+- `npm run build:demo` - Builds the demo for production
+- `npm run preview:demo` - Preview the built demo locally
+- `npm run deploy` - Deploy to GitHub Pages using gh-pages
+
+## 📁 Generated Files
+
+The build creates static files in `dist-demo/`:
+- `index.html` - Main demo page
+- `assets/` - CSS and JavaScript bundles
+- `asimov.svg` - Logo asset
+
+These files are served directly by GitHub Pages with no server-side processing required.
+
+## 🌐 Live Demo
+
+Once deployed, your demo will be available at:
+- **URL**: `https://asimov-protocol.github.io/asimov-network-widget/`
+- **Features**: Full interactive network simulation
+- **Performance**: Optimized production build with code splitting

README.md

@@ -135,6 +135,12 @@ const options = {
 />
 ```
 
+## Live Demo
+
+🌐 **[View Live Demo on GitHub Pages](https://asimov-protocol.github.io/asimov-network-widget/)**
+
+Experience the full interactive network simulation with all dynamic features directly in your browser.
+
 ## Local Development
 
 If you’d like to work with this repository directly, simply clone it and install its dependencies. Then, you can spin up the development server with the following commands: