Regex Tavern: Interactive Pattern Learning

An interactive, Traditional Chinese learning platform that teaches practical regular expressions through 15 structured lessons, 77 behavior-graded exercises, a safe in-browser playground, review queues, reference patterns, and worked examples.

The product is designed for people who customize AI role-play interfaces but find conventional Regex documentation too abstract. Learners can read a concept, change a pattern, see matches and capture groups, run hidden behavioral tests, and immediately understand why an answer works.

This is an independent, unofficial educational project. Third-party product names are referenced only to identify compatibility and educational context. The project is not affiliated with or endorsed by SillyTavern or its maintainers, and it includes no third-party logos or proprietary assets.

繁體中文 README

Live demo: https://twinklestars1029.github.io/Sillytavern_Regex/

What the project does

• Guides learners through 15 lessons in three progressive stages.
• Grades 77 exercises by observable behavior instead of exact answer strings, so alternative correct Regex solutions can pass.
• Runs user-authored Regex in a dedicated Web Worker with a 400 ms timeout, a 100,000-character input limit, and a 5,000-match limit.
• Sanitizes generated HTML and displays it in a permissionless sandboxed iframe with a dedicated Content Security Policy.
• Provides a free-form Playground with match highlighting, numbered and named capture groups, replacement output, and safe HTML preview.
• Builds personalized practice sessions and a review queue from failed or revealed answers.
• Includes 34 cheatsheet patterns, 12 worked examples, and a 15-term glossary.
• Stores learning progress only on the learner's device. It does not collect chat content, character cards, API keys, or account data.

Quick test

Supported platform: modern desktop and mobile browsers. Local development requires Node.js 22.13.0 or later and npm 10 or later.

npm ci
npm run dev

Open the local URL printed by the development server. No account, API key, database, or test credentials are required.

Suggested judge flow:

1. Open /learn/introduction, then enter Lesson 1.
2. Complete one embedded exercise and inspect the behavioral feedback.
3. Open /playground and run a Find/Replace example.
4. Open /examples, load an example into the Playground, and inspect its output.
5. Open /practice/review to see how missed questions become a targeted review queue.

The production site is deployed to GitHub Pages by the repository's GitHub Actions workflow. No account or credentials are required.

Verification

Run the complete release gate:

npm run quality

The gate covers formatting, linting, type checking, content and accessibility audits, all lesson and exercise data, internal links, unit tests, security tests, a production build, bundle budgets, 37 published routes, smoke tests, and end-to-end learning flows.

Latest local verification on July 16, 2026:

• 44/44 main tests passed.
• 7/7 security tests passed.
• 7/7 production smoke tests passed.
• 8/8 end-to-end tests passed.
• All 15 lessons, 77 exercises, 34 cheatsheets, 12 examples, and 15 glossary terms passed data validation.

Technical implementation

The site uses TypeScript, React, and Vinext, and is exported as a static GitHub Pages site. Lesson Markdown is normalized into a validated content layer; exercises, examples, cheatsheets, and glossary entries use typed catalogs.

The most important non-trivial implementation is the safety boundary around arbitrary Regex and generated HTML:

Learner input
  -> validated request limits
  -> isolated Web Worker
  -> timeout terminates and rebuilds the worker
  -> structured match/capture/replacement result
  -> HTML allowlist sanitizer
  -> sandboxed iframe + dedicated CSP

The exercise grader evaluates outputs, match counts, captures, required flags, and rule order. It does not require learners to reproduce a single reference pattern.

How Codex and GPT-5.6 were used

Codex was the development environment and orchestration layer for the project. GPT-5.6 Terra implemented the product in seven gated phases, while the primary Codex agent reviewed each phase, ran independent acceptance checks, diagnosed failures, and approved progression only after the relevant tests and production build passed.

Codex accelerated the work in four areas:

1. Content engineering: it analyzed the original 15-lesson Markdown curriculum, identified inconsistent answer formats and broken references, and designed a validated content schema without rewriting the author's teaching voice.
2. Product engineering: it turned the curriculum into a multi-route learning product with embedded exercises, behavior-based grading, progress tracking, review queues, examples, and a Playground.
3. Safety engineering: it implemented and tested worker isolation, catastrophic-backtracking timeouts, input and match limits, zero-length match handling, HTML sanitization, iframe sandboxing, and CSP restrictions.
4. Release engineering: it created automated content, accessibility, security, bundle, route, smoke, and end-to-end gates; it also generated release and rollback documentation.

The human creator made the core product decisions: the audience, the Traditional Chinese curriculum, the three-stage learning progression, the SillyTavern-oriented use cases, the requirement for immediate in-page practice, and the final acceptance of each phase. Codex and GPT-5.6 converted those decisions into an implemented, tested product and surfaced tradeoffs for review.

Core Codex session ID: 019f5a08-3e5e-7471-9dca-af9adaedc5a0

Competition-readiness and final submission session ID: 019f6988-fa4d-79b3-a0dc-4e781ce9997d

New work and provenance

The author had written the underlying teaching material before the interactive website build. The competition project work transformed that material into a complete software product:

• typed lesson and exercise data models;
• the Vinext/React website and all learning routes;
• the Web Worker Regex engine and safe HTML preview;
• 77 behavior-graded interactive exercises;
• progress, practice, challenge, and review systems;
• cheatsheet, example, and glossary libraries;
• automated security, accessibility, content, build, smoke, and E2E verification;
• release, rollback, contribution, and security documentation.

The repository's dated implementation history begins on July 14, 2026. Before submission, the entrant must confirm that this date is on or after the hackathon's official submission-period start date. If it is not, the submission should identify only later qualifying commits and explain their material expansion.

Relevant dated commits:

• 0e5e14a — July 14, 2026 — interactive tutorial implementation.
• 39cc65e — July 14, 2026 — production metadata URL.
• 8544f6d — July 16, 2026 — content and documentation reorganization.
• c256fd1 — July 16, 2026 — course introduction and setup appendix.

Privacy, third-party material, and licensing

• The application has no analytics, advertising, backend account system, or user-content upload.
• The site links to official documentation but does not bundle third-party data, logos, music, character art, or proprietary SDKs.
• Runtime packages and their licenses are recorded in package-lock.json.
• Textual references to third-party product names are used only to describe compatibility and educational context.

Before making the repository public, add the license selected by the project owner. Alternatively, keep the repository private and share it with the two judge accounts specified in the official rules. The competition demo should use only original visuals and narration, with no copyrighted music or unlicensed third-party marks.

Built With

• codex
• developer
• github
• gpt-5.6
• interactive-learning
• next.js
• react
• regular-expressions-education
• typescript