BetterLectio

A browser extension that modernizes Lectio, the Danish school management system.

Features • Installation • Development • Tech Stack

---

Features

• Modern Sidebar — Clean navigation with collapsible sections for schedules and changes
• Fast Search — Quickly find students, teachers, rooms, and classes with keyboard shortcuts (Cmd/Ctrl+K)
• Smart Prefetching — Pages load instantly using Speculation Rules API and hover prefetching
• Improved Messages — Two-column layout with folder tree, auto-redirects to newest messages
• Profile Pictures — Click to enlarge any profile picture to full size
• Skeleton Loading — Smooth transitions with no flash of unstyled content
• Cross-Page Profiles — Your profile stays visible when viewing other students' schedules

Installation

Download her

From Source

1. Clone this repository
2. Run bun install to install dependencies
3. Run bun run build for Chrome or bun run build:firefox for Firefox
4. Load the extension:
   • Chrome: Go to chrome://extensions, enable Developer mode, click "Load unpacked" and select .output/chrome-mv3
   • Firefox: Go to about:debugging, click "This Firefox", click "Load Temporary Add-on" and select any file in .output/firefox-mv2

Development

Prerequisites

• Bun (recommended) or Node.js 22+

Commands

# Install dependencies
bun install

# Start development server
bun run dev          # Chrome
bun run dev:admin    # Chrome with the complete admin build
bun run dev:firefox  # Firefox

# Build for production
bun run build          # Chrome
bun run build:firefox  # Firefox

# Package for distribution
bun run zip          # Chrome
bun run zip:firefox  # Firefox

Admin build

The privileged dashboard handoff is never included in ordinary builds. Build it separately with the admin dashboard origin baked into its host permissions:

VITE_ADMIN_API_ORIGIN=https://<admin-host> bun run build:admin
# Or: VITE_ADMIN_API_ORIGIN=https://<admin-host> bun run build:admin:firefox

Load .output-admin/chrome-mv3-admin as an unpacked extension. It has a distinct name and Chromium identity and is the only variant that requests cookies and https://*.lectio.dk/*. Sign in to the configured dashboard, open Lectio sessions, and click Log in as user. The dashboard creates a single-use 60-second handoff; no reusable extension token is configured or entered. Never put the Supabase service-role or Lectio session master key in extension environment variables.

For local development, start the admin app on port 3000, then run bun run dev:admin here. It builds the complete static manifest for https://admin.betterlectio.dk and opens /lectio-sessions in a separate Chrome development profile. Use bun run dev:admin:hot only when working on extension code—the WXT hot-reload variant depends on dynamic content-script registration.

Tech Stack

Technology	Purpose
WXT 0.21	Browser extension framework
Preact	Lightweight React alternative (3KB)
TypeScript	Type safety
Tailwind CSS	Utility-first styling
shadcn/ui	UI component system
Radix UI	Accessible primitives

Browser Support

Browser	Status
Chrome	Supported (Manifest V3)
Firefox	Supported (Manifest V2)
Edge	Should work (untested)
Safari	macOS 15+ (Manifest V3, ships inside the BetterLectio Mac app)

Acknowledgements

Name inspired by BetterLectio.

License

GPLv3