SkyrimWebMonitor

This is the client half of the project. The server half — the SKSE plugin that exposes Skyrim's game state over a WebSocket — lives in the companion repository:

andreyvelsk/SkyrimWebSocket — install it inside Skyrim first; without it the monitor has nothing to talk to.

A Vue 3 + Vite PWA + capacitor + electron companion app for The Elder Scrolls V: Skyrim. It connects to a running Skyrim session over WebSocket and shows the player state — stats, inventory, magic, and hotkeys — in real time, on a separate screen.

Live app: https://andreyvelsk.github.io/SkyrimWebMonitor/

Designed primarily for the AYN Thor handheld as a second-screen Skyrim companion, but it runs on any modern browser (desktop, phone, tablet).

Demo of gameplay is here - https://www.youtube.com/watch?v=6KL9jrvZpFg

if you have troubles launching the app, feel free to ask for a help in youtube video comments

Features

• Real-time monitoring over WebSocket (stats, inventory, magic, hotkeys)
• Installable as a Progressive Web App (offline shell, home-screen launch)
• Multilingual UI (English / Russian) via vue-i18n
• Skyrim-themed responsive design, optimized for handhelds
• Works fully client-side — no backend besides the in-game plugin
• Now app also has Enderal SE support, with game map! (tested on latest GOG version)

Quick start (use the public app)

1. Install the SkyrimWebSocket SKSE plugin in your Skyrim Special Edition. Follow the install guide in that repo. By default it listens on ws://127.0.0.1:8765.
2. Launch Skyrim through skse64_loader.exe and load a save.
3. Install latest .apk release (recomended for most android devices), OR, Open https://andreyvelsk.github.io/SkyrimWebMonitor/ in a browser on the same machine
4. Configure the WebSocket URL on first launch and connect.

Install via Obtainium (Android)

If you use Obtainium, you can install and update the APK directly from this repository's GitHub Releases.

1. Open Obtainium and tap Add App.
2. Choose GitHub as the source.
3. Paste the repo URL: https://github.com/andreyvelsk/SkyrimWebMonitor.
4. Select the latest release asset (.apk) and install.

After that, Obtainium will notify you when a new release is published.

Install as a PWA

The app can be installed to the home screen / start menu like a native app — it then opens fullscreen and works offline (UI shell only; live data still requires Skyrim + the plugin to be running). Note: this normally way work only if app launched on same device with WS server

Desktop — Native app

1. Open latest release
2. Look for a version of you OS (Linux or Windows)
3. For Linux users - make app as executable, chmod +x and app file name

Desktop — Chrome / Edge / Brave

1. Open https://andreyvelsk.github.io/SkyrimWebMonitor/.
2. Look for the install icon (⊕ / monitor-with-arrow) in the address bar, or open the browser menu and choose Install SkyrimWebMonitor… / Apps → Install this site as an app.
3. Confirm. The app launches in its own window and gets a shortcut.

Android — Chrome

1. Open the URL.
2. Tap the ⋮ menu → Add to Home screen (or Install app).
3. Confirm. Launch it from the home screen.

Run locally / develop

Requirements: Node.js 20+ and npm.

git clone https://github.com/andreyvelsk/SkyrimWebMonitor.git
cd SkyrimWebMonitor
npm install

cp .env.example .env  # set VITE_WS_URL to your SkyrimWebSocket address
npm run dev           # http://localhost:5173/SkyrimWebMonitor/

Other useful scripts:

npm run build           # production build into dist/
npm run preview         # serve the production build
npm run tsc             # type-check
npm run release         # bump patch, create git commit+tag, push main + tags
npm run release -- minor
npm run lint            # ESLint with --fix
npm run lint:css        # Stylelint with --fix
npm run format          # Prettier + Stylelint

Releases

Release orchestration is split between a local command and GitHub Actions:

npm run release

What it does:

1. Works only on the main branch and requires a clean git working tree.
2. Runs npm run tsc and npm run build as a preflight check.
3. Bumps the npm version (patch by default, or npm run release -- minor|major).
4. Creates the release commit and git tag via npm version.
5. Pushes main and the new tag to origin.

Pushing a tag like v0.1.1 triggers .github/workflows/release.yml, which:

1. Builds the production web assets and Capacitor Android project.
2. Builds a release APK.
3. Creates a GitHub Release automatically and uploads the APK.

APK signing is optional but recommended. To sign release builds in CI, add these GitHub Actions secrets:

• ANDROID_KEYSTORE_BASE64
• ANDROID_KEYSTORE_PASSWORD
• ANDROID_KEY_ALIAS
• ANDROID_KEY_PASSWORD

If those secrets are absent, the workflow still creates a GitHub Release and uploads the unsigned release APK.

Reporting bugs

If you run into a bug, please open a GitHub issue and include:

1. A description of the problem and clear steps to reproduce it.
2. A trace-level log from SkyrimWebSocket captured during reproduction. Set LogLevel=trace in Data/SKSE/Plugins/SkyrimWebSocket.ini, reproduce the issue, then attach the log file:

   %USERPROFILE%\Documents\My Games\Skyrim Special Edition\SKSE\SkyrimWebSocket.log
   

3. If the game crashed, also attach the .dmp file found in the same folder.
4. Browser name + version, OS, and (if relevant) device — e.g. AYN Thor, Android 14, Chrome 130.
5. Browser DevTools console output (any errors / warnings) and, if applicable, the failing WebSocket frame.

The bug-report requirements mirror those of the SkyrimWebSocket project — most of the data the app shows comes from there, so the plugin's trace log is what makes issues actionable.

Tech stack

• Vue 3 (Composition API) + TypeScript
• Vite build tooling
• Pinia state management
• vue-i18n internationalization
• vite-plugin-pwa (Workbox) PWA support
• ESLint, Stylelint, Prettier

Credits

• Game icons by game-icons.net — used under the CC BY 3.0 license. Each icon retains its original author attribution; see folder names under public/icons/
• Map from Immersive Paper Map (3rd Edition) by Ckw25
• Fonts: Cinzel and Cormorant Garamond via Google Fonts (Open Font License).
• The Elder Scrolls V: Skyrim is © Bethesda Softworks / ZeniMax. This is an unofficial fan-made companion app and is not affiliated with or endorsed by Bethesda.

License

Released under the MIT License.