wehub-resource-sync
1 line
5.5 KiB
JSON
1 line
5.5 KiB
JSON
{"content": "---\nallowed-tools: Read, Write, Edit, Bash\nargument-hint: [platform] | --docusaurus | --gitbook | --notion | --storybook | --jupyter | --comprehensive\ndescription: Use PROACTIVELY to create interactive documentation platforms with live examples, code playgrounds, and user engagement features\n---\n\n# Interactive Documentation Platform\n\nCreate interactive documentation with live examples: $ARGUMENTS\n\n## Current Documentation Infrastructure\n\n- Static site generators: !`find . -name \"docusaurus.config.js\" -o -name \"gatsby-config.js\" -o -name \"_config.yml\" | head -3`\n- Documentation framework: @docs/ or @website/ (detect existing setup)\n- Component libraries: !`find . -name \"*.stories.*\" | head -5` (Storybook detection)\n- Interactive examples: !`find . -name \"*.ipynb\" -o -name \"*playground*\" | head -3`\n- Hosting setup: @vercel.json or @netlify.toml or @.github/workflows/ (if exists)\n\n## Task\n\nBuild comprehensive interactive documentation platform with live code examples, user engagement features, and multi-platform integration capabilities.\n\n## Interactive Documentation Architecture\n\n### 1. Platform Foundation and Configuration\n- Documentation platform selection and optimization setup\n- Theme customization and branding configuration\n- Navigation structure and content organization\n- Multi-language support and internationalization\n- Search integration with advanced filtering and indexing\n\n### 2. Live Code Playground Integration\n- Interactive code editor with syntax highlighting\n- Real-time code execution and preview capabilities\n- Multi-language support and framework integration\n- Error handling and debugging assistance\n- Code sharing and collaboration features\n\n### 3. API Documentation and Testing\n- Interactive API endpoint exploration\n- Live request/response testing capabilities\n- Parameter validation and example generation\n- Authentication flow integration\n- Response schema visualization and validation\n\n### 4. Interactive Tutorial System\n- Step-by-step guided learning experiences\n- Progress tracking and completion validation\n- Hands-on coding exercises with instant feedback\n- Adaptive learning paths based on user progress\n- Gamification elements and achievement systems\n\n### 5. Component Documentation Integration\n- Live component playground with property controls\n- Visual component gallery with interactive examples\n- Design system integration and style guide generation\n- Accessibility testing and compliance validation\n- Cross-browser compatibility testing\n\n### 6. User Engagement and Feedback Systems\n- Rating and review collection mechanisms\n- User feedback aggregation and analysis\n- Community discussion and Q&A integration\n- Usage analytics and behavior tracking\n- Personalization and recommendation systems\n\n### 7. Content Management and Publishing\n- Version control integration with automated publishing\n- Content review and approval workflows\n- Multi-author collaboration and editing\n- Content scheduling and automated updates\n- SEO optimization and metadata management\n\n### 8. Advanced Interactive Features\n- Advanced search with faceted filtering and suggestions\n- Interactive diagrams and visualization tools\n- Embedded video content and multimedia integration\n- Mobile-responsive design and offline capabilities\n- Progressive web app features and notifications\n\n## Implementation Requirements\n\n### Platform Integration\n- Multi-framework support (React, Vue, Angular, vanilla JS)\n- Build system integration with automated deployment\n- Content management system compatibility\n- Third-party service integration (analytics, feedback, search)\n- Performance optimization and bundle splitting\n\n### User Experience Design\n- Responsive design across all device types\n- Accessibility compliance (WCAG 2.1 AA standards)\n- Progressive enhancement for feature degradation\n- Fast loading times and optimal Core Web Vitals\n- Intuitive navigation and content discovery\n\n### Technical Infrastructure\n- Scalable hosting and CDN configuration\n- Database integration for user data and analytics\n- API design for external integrations\n- Security implementation and user authentication\n- Monitoring and error tracking systems\n\n## Deliverables\n\n1. **Interactive Platform Architecture**\n - Complete documentation platform setup and configuration\n - Live code playground and API testing integration\n - Interactive tutorial system with progress tracking\n - Component documentation with visual examples\n\n2. **User Engagement Systems**\n - Feedback collection and analysis mechanisms\n - User analytics and behavior tracking implementation\n - Community features and discussion integration\n - Personalization and recommendation engines\n\n3. **Content Management Framework**\n - Automated publishing and deployment pipelines\n - Multi-author collaboration and review workflows\n - Version control integration with change tracking\n - SEO optimization and metadata management\n\n4. **Performance and Optimization**\n - Mobile-responsive design with offline capabilities\n - Performance monitoring and optimization implementation\n - Accessibility compliance and testing frameworks\n - Progressive web app features and service workers\n\n## Integration Guidelines\n\nImplement with modern documentation platforms and development workflows. Ensure scalability for large content repositories and team collaboration while maintaining optimal performance and user experience across all devices and platforms."} |