A themed documentation and intranet portal for the SCP Foundation universe. Built with Vue 3 + TypeScript on the frontend, Hono on Cloudflare Workers for the backend API, and a separate admin dashboard.
- SCP Entry Catalog — Browse and search SCP objects with filtering by containment class (Safe, Euclid, Keter, Thaumiel, Apollyon, Neutralized)
- Document Library — Foundation protocols, research papers, incident reports, and directives with classification levels
- Full-Text Search — Command-palette search (Ctrl+K) across all entries and documents with keyboard navigation
- User Authentication — Register, login, and profile management with JWT-based sessions
- Proposals System — Community proposals with voting, daily limits, and admin moderation
- Bookmarks & History — Save favorite entries and track browsing history
- Entry Reports — Report issues on SCP entries for admin review
- AI Chat — AI-powered SCP assistant with conversation management and tool integration
- Tag System — Categorize entries by object class, anomaly type, group of interest, narrative format, and theme
- Admin Dashboard — Separate admin SPA for user management, entry management, proposal moderation, logs, and settings
- Internationalization — English and Chinese (zh) with automatic browser language detection
- Dark & Light Themes — Toggle between themes with persistent preference
- Responsive Layout — Desktop sidebar navigation, mobile bottom navigation with dedicated mobile views
- SCP-Themed Design — Custom CSS design system with classification levels and clearance system
- PWA Support — Service worker with offline caching via VitePWA
- Node.js 20+
- npm
npm ci
npm run dev # http://localhost:8085cd worker
npm ci
npm run db:schema:local # Initialize local D1 database
npm run dev # Wrangler dev servercd admin
npm ci
npm run dev # Admin dev servermake ci # typecheck + test + build
make test # Run all tests
make typecheck # Type-check onlyscp-docs/
├── src/ # Frontend source
│ ├── views/ # Page components (desktop + mobile variants)
│ │ └── mobile/ # Mobile-specific views
│ ├── components/
│ │ ├── common/ # Reusable UI (Badge, Card, ClassBar, ErrorBoundary, ReportDialog)
│ │ ├── home/ # Homepage sections (Hero, Stats, RecentEntries)
│ │ ├── layout/ # App shell (Header, Sidebar, Footer, SearchModal)
│ │ ├── mobile/ # Mobile components (Layout, Header, Nav, Search, AiChat)
│ │ └── ai/ # AI chat components (Panel, ConversationList, MessageBubble)
│ ├── stores/ # Pinia state management (auth, search, crawler, proposals, userActivity)
│ ├── composables/ # Vue composables (useLocale, useTheme, useDevice, useSidebar, useEntryProtocol)
│ ├── services/ # API client layer (api, ai, crawler, proposals, userActivity, reports, download)
│ ├── data/ # Static documents (entries fetched from crawler API)
│ ├── locales/ # i18n translations (en, zh)
│ ├── types/ # TypeScript interfaces
│ ├── styles/ # CSS design tokens, base styles, Tailwind, mobile
│ └── router/ # Vue Router configuration with auth guards
├── worker/ # Backend source
│ └── src/
│ ├── routes/ # API endpoints (auth, crawler, history, proposals, bookmarks, reports, logs, ai, tags)
│ │ └── admin/ # Admin routes (dashboard, users, entries, proposals, logs, settings, tags)
│ ├── middleware/ # JWT auth, admin role check, request logging
│ ├── do/ # Durable Objects (scp-crawler, ai-chat, ai-queue, http-client, parser)
│ ├── tools/ # AI tool definitions and executor
│ ├── utils/ # JWT, password, logger, GLM client
│ └── types.ts # TypeScript interfaces
├── admin/ # Admin dashboard (separate Vue 3 SPA)
│ ├── views/ # Admin pages (Dashboard, Users, Entries, Proposals, Logs, Settings)
│ ├── stores/ # Admin Pinia stores
│ ├── services/ # Admin API client
│ └── components/ # Admin UI components
├── docs/ # Developer documentation
└── Makefile # Development commands
| Layer | Technology | Purpose |
|---|---|---|
| Frontend | Vue 3 | UI framework with Composition API |
| Frontend | TypeScript | Type safety |
| Frontend | Vite | Build tool and dev server |
| Frontend | Pinia | State management |
| Frontend | Vue Router | Client-side routing |
| Frontend | vue-i18n | Internationalization |
| Frontend | Tailwind CSS v4 | Utility-first CSS |
| Frontend | VitePWA | PWA with service worker |
| Backend | Hono | Web framework for edge |
| Backend | Cloudflare Workers | Serverless runtime |
| Backend | Cloudflare D1 | SQLite database |
| Backend | Cloudflare Durable Objects | Stateful crawling and AI chat |
| Backend | jose | JWT handling |
| Backend | ZhipuAI GLM | AI chat backend |
| Testing | Vitest | Test runner (frontend + backend) |
| Document | Description |
|---|---|
| Architecture | System architecture and data flow |
| API Reference | Backend API endpoint documentation |
| Deployment Guide | Deploying to Cloudflare |
| Testing Guide | Running and writing tests |
| Internationalization | Adding and managing translations |
| Design System | CSS tokens and component conventions |
| Code Conventions | Style guide and project conventions |
| Contributing | How to contribute |
| Changelog | Version history |
| Security Policy | Vulnerability reporting |
A special thank you to Cloudflare for powering this project's infrastructure. Their Workers runtime, D1 database, and Durable Objects make it possible to run the entire backend at the edge — fast, globally distributed, and with zero cold starts. We're grateful for their support of the open-source and developer community. 💙