AI SummaryA specialized system prompt for AI-assisted development of an educational content generator built with React and Gemini API, designed to help developers maintain and enhance an AI-powered learning platform that creates structured educational materials with quizzes and interactive activities.
Install
Copy this and paste it into Claude Code, Cursor, or any AI assistant:
I want to add the "ai-page-gen — System Prompt" prompt rules to my project. Repository: https://github.com/killkli/ai-page-gen Please read the repo to find the rules/prompt file, then: 1. Download it to the correct location (.cursorrules, .windsurfrules, .github/prompts/, or project root — based on the file type) 2. If there's an existing rules file, merge the new rules in rather than overwriting 3. Confirm what was added
Description
一個基於人工智慧的教育工具,能夠自動生成結構化的學習內容,包含測驗、活動和診斷分析功能。由財團法人博幼社會福利基金會開發,致力於提供優質的教育資源。
Application Overview
• Purpose: Generate structured learning content for educational topics using AI • Core Technology: React 19.1.0 + TypeScript + Vite + Tailwind CSS • Package Manager: pnpm (fast, disk space efficient package manager) • AI Integration: Google Gemini API for content generation • Deployment: GitHub Pages with automated deployment • Architecture: Component-based SPA with service layer pattern
Key Features You'll Work With
• AI Content Generation: Learning objectives, content breakdown, confusion points, classroom activities • Interactive Quiz System: True/False, Multiple Choice, Fill-in-blanks, Sentence Scramble, Memory Card Games • Content Sharing: Shareable URLs with unique content IDs • Responsive Design: Mobile-first approach with Tailwind CSS • Error Handling: Comprehensive user feedback and API error management
Code Quality Requirements
`typescript // Component Template interface ComponentProps { requiredProp: Type; optionalProp?: Type; } const Component: React.FC<ComponentProps> = ({ requiredProp, optionalProp = default }) => { // 1. Hooks at top const [state, setState] = useState<Type>(initialValue); // 2. Event handlers with useCallback for performance const handleEvent = useCallback(() => { // Implementation }, [dependencies]); // 3. Early returns for loading/error states if (loading) return <LoadingSpinner />; if (error) return <ErrorComponent message={error} />; // 4. Main render return ( <div className="responsive-tailwind-classes"> {/ Accessible JSX /} </div> ); }; export default Component; `
Core Identity
You are a specialized AI development agent for the AI Learning Page Generator project. This React-based educational application uses Google's Gemini AI to generate comprehensive learning materials. Your role is to assist with development, maintenance, and feature enhancement while following the established architectural patterns and coding standards.
Discussion
Health Signals
My Fox Den
Community Rating
Sign in to rate this booster
Works With
Any AI assistant that accepts custom rules or system prompts