C programming
Educational
Prompt
We are building a serious, production-quality interactive C programming learning platform. This is the first stage of the project. Do NOT create a superficial landing page or static mockup. Build the foundational architecture that all later stages will use. The final product will teach C programming from absolute beginner level through advanced C, pointers, memory, data structures and algorithms. The core philosophy is: Learn → Understand → Predict → Write → Run → Debug → Solve → Explain → Review → Master The platform should teach understanding rather than memorization. ⸻ PRODUCT CONCEPT The product should combine: * interactive C programming lessons * coding problems * a real code editor * code execution * debugging challenges * output prediction * code tracing * memory visualization * progress tracking * projects * achievements * spaced review * personalized weak-area practice * a searchable C reference The experience should feel like a combination of: * a coding challenge platform * an interactive textbook * a modern IDE * a visual debugger * a structured learning platform Do not copy the branding or UI of any existing product. Create an original identity. ⸻ TECHNICAL ARCHITECTURE Choose a modern, maintainable web architecture appropriate for the environment. Prioritize: * component reuse * clear separation of concerns * scalable data structures * predictable state management * responsive design * accessibility * performance Do not hardcode every lesson or problem directly into individual UI components. Use structured data. ⸻ CORE ENTITIES The architecture should support at least these entities: User Lesson Section Stage Problem ProblemAttempt TestCase Hint Concept ConceptMastery Project ProjectMilestone Achievement DailyChallenge ReviewItem Progress UserSettings Design these so they can later be connected to a real database. ⸻ PROBLEM DATA MODEL Create a reusable structure similar to: { id: 1, sectionId: "first-program", lessonId: "hello-c", title: "Hello, C!", difficulty: "easy", concepts: ["printf", "main"], description: "...", learningObjective: "...", starterCode: "...", examples: [], constraints: [], testCases: [], hiddenTestCases: [], hints: [], solution: "...", explanation: "...", commonMistakes: [], prerequisites: [] } Do not use placeholder data architecture that will need to be thrown away later. ⸻ CURRICULUM DATA MODEL Lessons should also be structured. Each lesson should support: id stage section title description goal prerequisites estimatedTime concepts content examples visualizations predictionQuestions practiceProblems debuggingProblems explanationQuestions checkpoint ⸻ PROGRESS MODEL Progress must eventually track: problemsSolved problemAttempts lessonsCompleted sectionsCompleted xp streak accuracy timeSpent hintsUsed conceptMastery projectsCompleted achievements dailyChallenges reviewHistory Do not create fake progress. The interface should eventually reflect actual learner activity. ⸻ ROUTING Create routes/pages for: / dashboard learn learn/:stage learn/:section learn/:lesson practice practice/:problem debugging predict projects projects/:project progress achievements review reference search settings Use the routing system appropriate to the chosen framework. ⸻ COMPONENT ARCHITECTURE Create reusable components for: Navbar Sidebar MobileNavigation ProgressBar LessonCard SectionCard ProblemCard DifficultyBadge ConceptBadge CodeEditor Console TestCasePanel HintPanel ExplanationPanel AchievementCard StreakCounter XPIndicator CourseMap LessonViewer MemoryVisualizer CallStackVisualizer PredictionQuestion DebuggingQuestion Quiz Search Modal Toast Do not build separate copies of the same UI for different pages. ⸻ IMPORTANT At this stage, focus on the foundation. Do not attempt to fully build every lesson or all 300 problems yet. Create the architecture so later prompts can safely add those features. Do not delete or rewrite the architecture unnecessarily when implementing future stages. Everything added later should integrate into this foundation. The final result should be scalable enough to support hundreds of lessons/problems without becoming difficult to maintain. Do not use “Lorem ipsum”, fake product statistics, or misleading functionality. Where functionality depends on a future backend, create a clean interface/service layer rather than pretending it already exists.
OpenAI