Skill: WebStatic Framework
Injects the WebStatic PHP/TypeScript Framework context for CMS development.
When to Use
- •Developing features for the WebStatic CMS
- •Building TypeScript widgets for the admin interface
- •Working with the Durandal SPA architecture
- •Running Grunt build tasks
- •Integrating with teslasoft.de website
When NOT to Use
- •General PHP development unrelated to WebStatic
- •Other CMS frameworks (WordPress, Drupal, Joomla)
- •Generic TypeScript projects
Quick Start
bash
# Navigate to js directory cd D:\TeamProjects\Teslasoft\webstatic\js # Build core library grunt build # Build all (vendor + polyfills) grunt --gruntfile Gruntfile.app.js build_dependencies grunt --gruntfile Gruntfile.polyfill.js polyfill
Commands
| Command | Action |
|---|---|
/webstatic | Load WebStatic framework context |
/webstatic build | Build core library (WebStatic.js) |
/webstatic build-all | Build all: core + vendor + polyfills |
/webstatic status | Show git status and build outputs |
/webstatic structure | Display project structure overview |
/webstatic update | Sync skill to global locations |
/webstatic help | Show this documentation |
Project Profile
| Field | Value |
|---|---|
| Project | WebStatic |
| Version | 0.8.9 |
| Type | PHP Web Content Management Framework |
| Repository | D:\TeamProjects\Teslasoft\webstatic |
| Stack | PHP 7.4+, MySQL 5.7+, TypeScript, Durandal, Grunt |
Technology Stack
| Layer | Technologies |
|---|---|
| Backend | PHP 7.4+, MySQL 5.7+ (stored procedures) |
| Frontend | TypeScript, Durandal SPA, Knockout MVVM |
| Build | Grunt, Bower, npm |
| Styling | Ruby + Compass (SCSS) |
| Widgets | Dock-Spawn docking panels |
Build Outputs
| File | Description |
|---|---|
js/dist/WebStatic.js | Core library (jQuery plugins, animations) |
js/dist/WebStatic.min.js | Minified core library |
js/dist/WebStatic.polyfill.js | IE/legacy browser polyfills |
js/vendor/ | AMD-wrapped vendor libraries |
Failure Modes & Recovery
| Issue | Recovery |
|---|---|
| Bower install fails | Check bower.json, some deps use git URLs |
| Grunt watch hangs | Check file permissions on dist/ |
| TypeScript errors | Ensure typings installed (tsd install) |
| Module not found | Check RequireJS paths in main.ts |
| Widget not docking | Verify elementID matches HTML id |
Security & Permissions
- •Required tools: Bash (build commands), Read, Write
- •Confirmations: Junction creation requires Administrator
- •Database config: Connection details in
config/.mysqli.*.inc.php(parameterized) - •Trust model: Local development only, no external uploads
Best Practices
- •Use Allman brace style for all TypeScript code
- •Extend DatabaseObject for new PHP entities
- •Preserve file banners when editing files
- •Follow PascalCase naming for classes and properties
- •Use MulticastDelegate for event patterns
- •Check junction integrity before Website builds
References
- •Build System - Grunt configuration and commands
- •Code Patterns - PHP and TypeScript conventions
- •Widget Development - Creating admin widgets
- •Integration - Website junction and goal context
Metadata
yaml
author: Christian Kusmanow / Claude version: 2.0.0 last_updated: 2026-01-23 change_surface: references/ (build updates, new patterns) extension_points: references/widget-development.md (new widget types)
Changelog
- •v2.0.0 (2026-01-23): SDL migration - Progressive disclosure structure
- •Split 418-line monolith into SKILL.md (~150 lines) + 4 references
- •Added YAML frontmatter with triggers and negative_triggers
- •Added security section with junction confirmation
- •Parameterized database connection references
- •v1.0.0 (2026-01-19): Initial release