Spaces:
Sleeping
Sleeping
| # OSW Studio Documentation | |
| **Your guide to building websites with AI.** | |
| Welcome to OSW Studio - a browser-based development environment where you chat with AI to build websites and web apps. | |
| --- | |
| ## Quick Links | |
| **New to OSW Studio?** | |
| - 👉 **[Overview](?doc=overview)** - What is OSW Studio? (1 min read) | |
| - 🚀 **[Getting Started](?doc=getting-started)** - Build your first site (5 min) | |
| **Common Tasks:** | |
| - 💾 [Manage Projects](?doc=projects) | |
| - 🤖 [Work with AI](?doc=working-with-ai) | |
| - 🌐 [Deploy Your Site](?doc=deploying-sites) | |
| **Features:** | |
| - 📦 [Templates](?doc=templates) - Start faster | |
| - ⚡ [Skills](?doc=skills) - Teach AI your preferences | |
| **Need Help?** | |
| - ❓ [FAQ](?doc=faq) | |
| - 🔧 [Troubleshooting](?doc=troubleshooting) | |
| --- | |
| ## Documentation Structure | |
| ### Getting Started | |
| Perfect for newcomers and casual users: | |
| - **[Overview](?doc=overview)** - What is OSW Studio and who is it for? | |
| - **[Getting Started](?doc=getting-started)** - Set up and create your first project | |
| - **[Projects](?doc=projects)** - Create, manage, and export projects | |
| ### Using OSW Studio | |
| Guides for regular users: | |
| - **[Working with AI](?doc=working-with-ai)** - Chat vs Code modes, prompting tips | |
| - **[Templates](?doc=templates)** - Use and create project templates | |
| - **[Skills](?doc=skills)** - Teach AI your workflow preferences | |
| - **[Deploying Your Sites](?doc=deploying-sites)** - Deploy to Vercel, Netlify, etc. | |
| ### Help & Advanced | |
| For support and self-hosters: | |
| - **[FAQ](?doc=faq)** - Common questions answered | |
| - **[Troubleshooting](?doc=troubleshooting)** - Fix common issues | |
| - **[Server Mode](?doc=server-mode)** - Self-hosting and deployment | |
| - **[Multitenancy](?doc=multitenancy)** - Workspaces, users, roles, quotas (Server Mode) | |
| - **[Deployment Publishing](?doc=site-publishing)** - Analytics, SEO, compliance (Server Mode) | |
| - **[Backend](?doc=backend-features)** - Database, API endpoints, secrets (Server Mode) | |
| --- | |
| ## What Can I Build? | |
| OSW Studio supports multiple project runtimes — pick the one that fits your needs: | |
| **Static (HTML/CSS/JS):** | |
| ✅ **Personal websites** - Portfolios, blogs, resumes | |
| ✅ **Landing pages** - Marketing sites, product pages | |
| ✅ **Documentation sites** - Project docs, help centers | |
| ✅ **Interactive apps** - Calculators, tools, games (client-side) | |
| **React, Preact, Svelte, Vue:** | |
| ✅ **Component-based apps** - Dashboards, admin panels, SPAs | |
| ✅ **Interactive UIs** - Forms, data visualization, real-time interfaces | |
| ✅ **npm ecosystem** - Import packages by name, fetched from CDN at runtime | |
| ✅ **Single-file components** - Svelte `.svelte` and Vue `.vue` files compiled in-browser | |
| **Python & Lua:** | |
| ✅ **Scripts and algorithms** - Run Python (via Pyodide) and Lua (via wasmoon) in an interactive Console | |
| ✅ **Data processing** - Experiment with code without leaving the browser | |
| ✅ **Learning environment** - Try language features with instant feedback | |
| **Server Mode adds:** | |
| ✅ **Workspaces** - Isolated environments for teams, clients, or projects | |
| ✅ **Multi-user** - User accounts with shared workspace access | |
| ✅ **API endpoints** - REST APIs with database access via edge functions | |
| ✅ **Dynamic sites** - Store and retrieve data with SQLite databases | |
| --- | |
| ## Key Concepts | |
| ### Chat with AI to Build | |
| Describe what you want in plain English. AI writes the code, creates files, and explains what it's doing. | |
| ``` | |
| Create a portfolio website with a hero section, | |
| about section, and project gallery | |
| ``` | |
| ### Two Modes | |
| **💬 Chat Mode** - Ask questions, plan, explore (read-only) | |
| **🔧 Code Mode** - AI builds and modifies your project | |
| ### Live Preview | |
| See your website update in real-time as AI builds it. | |
| ### Export & Deploy | |
| Download your complete site and deploy to Vercel, Netlify, or any static host in minutes. | |
| --- | |
| ## Resources | |
| ### External Links | |
| - **[Live Demo](https://huggingface.co/spaces/otst/osw-studio)** - Try OSW Studio now | |
| - **[GitHub Repository](https://github.com/o-stahl/osw-studio)** - Source code | |
| - **[Report Issues](https://github.com/o-stahl/osw-studio/issues)** - Bug reports & feature requests | |
| ### Features | |
| **Major Features:** | |
| - Multiple project runtimes (Static, Handlebars, React, Preact, Svelte, Vue, Python, Lua) | |
| - Multi-provider AI support (14+ providers, including ChatGPT subscription and HuggingFace free tier) | |
| - Dual modes (Chat/Code) | |
| - Semantic blocks — drag pre-defined layouts onto the preview | |
| - Templates & Skills systems | |
| - Browser mode (IndexedDB) and Desktop app (macOS/Windows/Linux) | |
| - Optional Server mode with workspaces and multi-user support | |
| - Site publishing with SEO & analytics | |
| - Edge functions & database management | |
| - Cost tracking | |
| --- | |
| ## Getting Help | |
| **Before asking for help:** | |
| 1. Check the [FAQ](?doc=faq) | |
| 2. Search [GitHub Issues](https://github.com/o-stahl/osw-studio/issues) | |
| 3. Review [Troubleshooting](?doc=troubleshooting) | |
| **Still stuck?** | |
| Create an issue on GitHub with: | |
| - What you're trying to do | |
| - What's happening instead | |
| - Steps to reproduce | |
| - Browser and OS version | |
| - Screenshots if relevant | |
| --- | |
| **Ready to start?** → **[Get Started](?doc=getting-started)** | |