Failed to load learning path. Please try again later.

\n `;\n }\n}\n\n// Render learning path\nfunction renderLearningPath() {\n if (!state.learningPath.length) {\n elements.learningPath.innerHTML = `\n

No lessons available.

\n `;\n return;\n }\n\n const pathHTML = state.learningPath.map(lesson => {\n const isCompleted = lesson.completed;\n const progressText = lesson.exercise_count\n ? `${lesson.completed_exercises || 0}/${lesson.exercise_count} exercises`\n : \"\";\n\n return `\n

${lesson.title}

\n ${isCompleted ? \"Completed\" : \"\"}\n

${lesson.description}

\n ${progressText ? `

${progressText}

` : \"\"}\n ${lesson.difficulty}\n

\n `;\n }).join(\"\");\n\n elements.learningPath.innerHTML = pathHTML;\n\n // Add event listeners to learning path items\n document.querySelectorAll(\".learning-path-item\").forEach(item => {\n item.addEventListener(\"click\", () => {\n const lessonId = item.dataset.lessonId;\n const lessonSlug = item.dataset.lessonSlug;\n loadLesson(lessonSlug, lessonId);\n });\n });\n}\n\n// Load a lesson\nasync function loadLesson(slug, id) {\n try {\n const response = await fetch(`/api/lessons/${slug}`);\n const data = await response.json();\n\n if (data.error) {\n throw new Error(data.error);\n }\n\n state.currentLesson = data.lesson;\n state.currentExercise = null;\n\n renderLesson();\n loadExercises(id);\n\n // Update active state in learning path\n document.querySelectorAll(\".learning-path-item\").forEach(item => {\n item.classList.toggle(\"active\", item.dataset.lessonId === id);\n });\n } catch (error) {\n console.error(\"Error loading lesson:\", error);\n elements.lessonContent.innerHTML = `\n

Failed to load lesson. Please try again later.

\n `;\n }\n}\n\n// Render a lesson\nfunction renderLesson() {\n if (!state.currentLesson) return;\n\n // Show lesson content, hide code editor and exercise list initially\n elements.lessonContent.classList.remove(\"hidden\");\n elements.codeEditorContainer.classList.add(\"hidden\");\n elements.exerciseList.classList.remove(\"hidden\");\n\n // Render lesson content\n elements.lessonContent.innerHTML = `\n

${state.currentLesson.title}

\n ${renderMarkdown(state.currentLesson.content)}\n

\n `;\n}\n\n// Load exercises for a lesson\nasync function loadExercises(lessonId) {\n try {\n const response = await fetch(`/api/lessons/${lessonId}/exercises`);\n const data = await response.json();\n\n if (data.error) {\n throw new Error(data.error);\n }\n\n renderExercises(data.exercises);\n } catch (error) {\n console.error(\"Error loading exercises:\", error);\n elements.exercisesContainer.innerHTML = `\n

Failed to load exercises. Please try again later.

\n `;\n }\n}\n\n// Render exercises\nfunction renderExercises(exercises) {\n if (!exercises || exercises.length === 0) {\n elements.exercisesContainer.innerHTML = `\n

No exercises available for this lesson yet.

\n `;\n return;\n }\n\n const exercisesHTML = exercises.map(exercise => {\n return `\n

${exercise.title}

\n ${exercise.difficulty}\n

${exercise.description}

\n `;\n }).join(\"\");\n\n elements.exercisesContainer.innerHTML = exercisesHTML;\n\n // Add event listeners to exercise items\n document.querySelectorAll(\".exercise-item\").forEach(item => {\n item.addEventListener(\"click\", () => {\n const exerciseId = item.dataset.exerciseId;\n loadExercise(exerciseId);\n });\n });\n}\n\n// Load a specific exercise\nasync function loadExercise(exerciseId) {\n try {\n const response = await fetch(`/api/exercises/${exerciseId}`);\n const data = await response.json();\n\n if (data.error) {\n throw new Error(data.error);\n }\n\n state.currentExercise = data.exercise;\n\n // Show code editor, hide lesson content\n elements.lessonContent.classList.add(\"hidden\");\n elements.codeEditorContainer.classList.remove(\"hidden\");\n elements.exerciseList.classList.add(\"hidden\");\n\n // Set editor content\n state.editor.setValue(state.currentExercise.starter_code);\n\n // Clear output and test results\n elements.codeOutput.textContent = \"\";\n elements.testResults.innerHTML = `\n

Run your code and submit your solution when ready.

\n `;\n\n // Update editor title\n const editorTitle = document.querySelector(\"#code-editor-container h2\");\n editorTitle.textContent = `Exercise: ${state.currentExercise.title}`;\n\n // Add exercise description above editor\n const editorContainer = document.querySelector(\"#monaco-editor\").parentElement;\n const descriptionEl = document.createElement(\"div\");\n descriptionEl.className = \"mb-4 p-4 bg-blue-50 border-l-4 border-blue-500 rounded\";\n descriptionEl.innerHTML = `

${state.currentExercise.description}

`;\n\n // Remove any existing description\n const existingDescription = editorContainer.querySelector(\".mb-4.p-4.bg-blue-50\");\n if (existingDescription) {\n existingDescription.remove();\n }\n\n editorContainer.insertBefore(descriptionEl, editorContainer.firstChild);\n } catch (error) {\n console.error(\"Error loading exercise:\", error);\n alert(\"Failed to load exercise. Please try again later.\");\n }\n}\n\n// Run code\nasync function runCode() {\n if (!state.editor) return;\n\n const code = state.editor.getValue();\n\n if (!code.trim()) {\n elements.codeOutput.textContent = \"Error: No code to run\";\n return;\n }\n\n try {\n elements.codeOutput.textContent = \"Running code...\";\n\n const response = await fetch(\"/api/compile\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({ code }),\n });\n\n const result = await response.json();\n\n if (result.error) {\n elements.codeOutput.textContent = `Error: ${result.error}`;\n return;\n }\n\n if (result.success) {\n elements.codeOutput.textContent = result.output || \"Program executed successfully with no output\";\n } else {\n elements.codeOutput.textContent = result.error || \"Compilation failed\";\n }\n } catch (error) {\n console.error(\"Error running code:\", error);\n elements.codeOutput.textContent = \"Error: Failed to run code. Please try again.\";\n }\n}\n\n// Submit solution\nasync function submitSolution() {\n if (!state.editor || !state.currentExercise) return;\n\n if (!state.username) {\n alert(\"Please enter a username before submitting your solution.\");\n elements.usernameInput.focus();\n return;\n }\n\n const code = state.editor.getValue();\n\n if (!code.trim()) {\n elements.testResults.innerHTML = `\n

Error: No code to submit

\n `;\n return;\n }\n\n try {\n elements.testResults.innerHTML = `\n

Testing your solution...

\n `;\n\n const response = await fetch(`/api/exercises/${state.currentExercise.id}/submit`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n code,\n username: state.username,\n }),\n });\n\n const result = await response.json();\n\n if (result.error) {\n elements.testResults.innerHTML = `\n

Error: ${result.error}

\n `;\n return;\n }\n\n renderTestResults(result);\n\n // If all tests passed, reload learning path to update progress\n if (result.passed) {\n await loadLearningPath();\n }\n } catch (error) {\n console.error(\"Error submitting solution:\", error);\n elements.testResults.innerHTML = `\n

Error: Failed to submit solution. Please try again.

\n `;\n }\n}\n\n// Render test results\nfunction renderTestResults(result) {\n if (!result.testResults || result.testResults.length === 0) {\n elements.testResults.innerHTML = `\n

${result.message || \"No test results available.\"}

\n `;\n return;\n }\n\n const resultsHTML = result.testResults.map((test, index) => {\n return `\n

\n Test ${index + 1}\n ${test.passed ? \"✅ Passed\" : \"❌ Failed\"}\n

\n ${test.input ? `

Input: ${test.input}

` : \"\"}\n

Expected: ${test.expected}

Actual: ${test.actual}

\n `;\n }).join(\"\");\n\n const messageClass = result.passed ? \"bg-green-100 text-green-700\" : \"bg-yellow-100 text-yellow-700\";\n\n elements.testResults.innerHTML = `\n

${result.message}

\n ${resultsHTML}\n

\n `;\n}\n\n// Simple markdown renderer (very basic implementation)\nfunction renderMarkdown(markdown) {\n if (!markdown) return \"\";\n\n // Replace headers\n let html = markdown\n .replace(/^# (.*$)/gm, \"

$1

\")\n .replace(/^## (.*$)/gm, \"

$1

\")\n .replace(/^### (.*$)/gm, \"

$1

\");\n\n // Replace lists\n html = html\n .replace(/^\\* (.*$)/gm, \"

\")\n .replace(/^(\\d+)\\. (.*$)/gm, \"

\");\n\n // Wrap lists\n html = html\n .replace(/

.*(?=

)/g, match => `

.*<\\/li>)(?!
)/g, \"$1

\");\n\n // Replace paragraphs\n html = html\n .replace(/^(?!)(.*$)/gm, \"

\");\n\n // Replace inline code\n html = html.replace(/`([^`]+)`/g, \"$1\");\n\n // Replace code blocks\n html = html.replace(/```([\\s\\S]*?)```/g, \"

$1

\");\n\n return html;\n}\n\n// Set up event listeners\nfunction setupEventListeners() {\n // Run code button\n elements.runCodeBtn.addEventListener(\"click\", runCode);\n\n // Submit solution button\n elements.submitSolutionBtn.addEventListener(\"click\", submitSolution);\n\n // Handle keyboard shortcuts\n document.addEventListener(\"keydown\", (e) => {\n // Ctrl+Enter or Cmd+Enter to run code\n if ((e.ctrlKey || e.metaKey) && e.key === \"Enter\") {\n e.preventDefault();\n runCode();\n }\n });\n}\n\n// Initialize the app when the DOM is loaded\ndocument.addEventListener(\"DOMContentLoaded\", init);",[],[259,272],{"_102":280,"_95":281,"_156":282,"_158":260,"_159":136,"_160":161,"_162":163,"_104":283,"_99":32,"_165":242,"_167":284,"_168":22,"_169":-5,"_170":285,"_98":286},"b33e424c-3373-11f0-8bc5-9e149126039e","index.html","a6cbc155-3a9d-40c3-96ff-5f5d8693c366",["D",1747523246963],"\n\n\n \n \n KidC - Learn C Programming\n \n \n \n \n\n\n

\n KidC\n Beta\n

\n \n \n

\n View Source\n

\n\n

\n \n

Learning Path

\n \n

\n\n \n

\n \n

Welcome to KidC!

Select a lesson from the learning path to get started.

Why learn C programming?

C is a powerful language used in many applications
Learning C helps understand how computers work
Many modern languages are based on C concepts
C programming skills are highly valued

\n\n \n

Code Editor

\n \n \n

Output

\n \n

Test Results

\n \n

\n\n \n

Exercises

\n \n

\n\n \n\n \n \n \n \n \n\n",[],[259,281],{"_102":288,"_95":289,"_156":290,"_158":260,"_159":136,"_160":161,"_162":163,"_104":291,"_99":32,"_165":242,"_167":292,"_168":22,"_169":-5,"_170":293,"_98":294},"b33e48be-3373-11f0-8bc5-9e149126039e","style.css","7a7cef36-01b5-4fa4-be0e-b909b65f3371",["D",1747523246963],"/* Custom styles for KidC platform */\n\n/* Code output styling */\n#code-output {\n font-family: 'Courier New', monospace;\n white-space: pre-wrap;\n}\n\n/* Learning path item styling */\n.learning-path-item {\n transition: all 0.2s ease-in-out;\n}\n\n.learning-path-item:hover {\n transform: translateX(5px);\n}\n\n.learning-path-item.active {\n border-left: 4px solid #2563eb;\n padding-left: 0.5rem;\n background-color: #eff6ff;\n}\n\n/* Exercise item styling */\n.exercise-item {\n transition: all 0.2s ease-in-out;\n}\n\n.exercise-item:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n}\n\n/* Badge styling */\n.badge {\n display: inline-block;\n padding: 0.25rem 0.5rem;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 600;\n}\n\n.badge-success {\n background-color: #10b981;\n color: white;\n}\n\n.badge-pending {\n background-color: #f59e0b;\n color: white;\n}\n\n.badge-beginner {\n background-color: #3b82f6;\n color: white;\n}\n\n.badge-intermediate {\n background-color: #8b5cf6;\n color: white;\n}\n\n.badge-advanced {\n background-color: #ef4444;\n color: white;\n}\n\n/* Markdown content styling */\n.markdown-content h1 {\n font-size: 1.875rem;\n font-weight: 700;\n margin-bottom: 1rem;\n color: #1e3a8a;\n}\n\n.markdown-content h2 {\n font-size: 1.5rem;\n font-weight: 700;\n margin-top: 1.5rem;\n margin-bottom: 0.75rem;\n color: #1e40af;\n}\n\n.markdown-content h3 {\n font-size: 1.25rem;\n font-weight: 600;\n margin-top: 1.25rem;\n margin-bottom: 0.5rem;\n color: #1e40af;\n}\n\n.markdown-content p {\n margin-bottom: 1rem;\n line-height: 1.6;\n}\n\n.markdown-content code {\n font-family: 'Courier New', monospace;\n background-color: #f1f5f9;\n padding: 0.125rem 0.25rem;\n border-radius: 0.25rem;\n font-size: 0.875rem;\n}\n\n.markdown-content pre {\n background-color: #1e293b;\n color: #e2e8f0;\n padding: 1rem;\n border-radius: 0.375rem;\n overflow-x: auto;\n margin: 1rem 0;\n}\n\n.markdown-content pre code {\n background-color: transparent;\n color: inherit;\n padding: 0;\n font-size: 0.875rem;\n}\n\n.markdown-content ul, .markdown-content ol {\n margin-left: 1.5rem;\n margin-bottom: 1rem;\n}\n\n.markdown-content ul {\n list-style-type: disc;\n}\n\n.markdown-content ol {\n list-style-type: decimal;\n}\n\n.markdown-content li {\n margin-bottom: 0.5rem;\n}\n\n.markdown-content a {\n color: #2563eb;\n text-decoration: underline;\n}\n\n.markdown-content blockquote {\n border-left: 4px solid #3b82f6;\n padding-left: 1rem;\n margin: 1rem 0;\n color: #4b5563;\n font-style: italic;\n}\n\n/* Test results styling */\n.test-result {\n padding: 0.5rem;\n margin-bottom: 0.5rem;\n border-radius: 0.25rem;\n}\n\n.test-result-pass {\n background-color: #d1fae5;\n border-left: 4px solid #10b981;\n}\n\n.test-result-fail {\n background-color: #fee2e2;\n border-left: 4px solid #ef4444;\n}\n\n/* Animation for success */\n@keyframes success-pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n 100% { transform: scale(1); }\n}\n\n.success-animation {\n animation: success-pulse 0.5s ease-in-out;\n}",[],[259,289],[259],{"_102":297,"_95":298,"_156":299,"_158":-5,"_159":136,"_160":161,"_162":163,"_104":300,"_99":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":301,"_98":317},"b33e528c-3373-11f0-8bc5-9e149126039e","shared","9ba8bc70-25aa-45c1-9dd8-74424883f03a",["D",1747523246963],[302,309],{"_102":303,"_95":239,"_156":304,"_158":299,"_159":136,"_160":161,"_162":163,"_104":305,"_99":32,"_165":242,"_167":306,"_168":22,"_169":-5,"_170":307,"_98":308},"b33e4f4e-3373-11f0-8bc5-9e149126039e","9bc7679f-6734-480c-8db1-7b43e6f55ff9",["D",1747523246963],"# KidC Shared\n\nThis directory contains shared code and type definitions used by both the frontend and backend.\n\n## Contents\n\n- `types.ts` - TypeScript interfaces and types for the platform\n\n## Type Definitions\n\nThe shared types include:\n\n- `Lesson` - Lesson content structure\n- `Exercise` - Exercise definition structure\n- `TestCase` - Test case for validating exercise solutions\n- `CompilationResult` - Result of code compilation\n- `TestResult` - Result of testing a solution\n- `ValidationResult` - Overall validation result for a solution\n- `User` - User information\n- `UserProgress` - User progress tracking\n- `UserSolution` - User submitted solutions\n- `LearningPathItem` - Lesson with progress information",[],[298,239],{"_102":310,"_95":311,"_156":312,"_158":299,"_159":136,"_160":161,"_162":163,"_104":313,"_99":32,"_165":194,"_167":314,"_168":22,"_169":-5,"_170":315,"_98":316},"b33e50f2-3373-11f0-8bc5-9e149126039e","types.ts","c53477a5-18de-4a09-bc02-8a2180f9041e",["D",1747523246963],"// Shared type definitions for KidC platform\n\n// Lesson difficulty levels\nexport type DifficultyLevel = 'beginner' | 'intermediate' | 'advanced';\n\n// Lesson interface\nexport interface Lesson {\n id: number;\n title: string;\n slug: string;\n description: string;\n content: string;\n order_index: number;\n difficulty: DifficultyLevel;\n created_at: number;\n}\n\n// Exercise interface\nexport interface Exercise {\n id: number;\n lesson_id: number;\n title: string;\n description: string;\n starter_code: string;\n solution_code: string;\n test_cases: string;\n order_index: number;\n difficulty: DifficultyLevel;\n created_at: number;\n}\n\n// Test case interface\nexport interface TestCase {\n input: string;\n expected_output: string;\n}\n\n// Compilation result interface\nexport interface CompilationResult {\n success: boolean;\n output: string;\n error?: string;\n}\n\n// Test result interface\nexport interface TestResult {\n passed: boolean;\n input: string;\n expected: string;\n actual: string;\n}\n\n// Validation result interface\nexport interface ValidationResult {\n passed: boolean;\n testResults: TestResult[];\n message: string;\n}\n\n// User interface\nexport interface User {\n id: number;\n username: string;\n display_name: string;\n created_at: number;\n}\n\n// User progress interface\nexport interface UserProgress {\n id: number;\n user_id: number;\n lesson_id: number;\n completed: boolean;\n last_accessed: number;\n}\n\n// User solution interface\nexport interface UserSolution {\n id: number;\n user_id: number;\n exercise_id: number;\n code: string;\n is_correct: boolean;\n submitted_at: number;\n}\n\n// Learning path item interface (lesson with progress)\nexport interface LearningPathItem extends Lesson {\n completed: boolean;\n last_accessed: number;\n exercise_count: number;\n completed_exercises: number;\n}",[],[298,311],[298],{"_102":319,"_95":239,"_156":320,"_158":-5,"_159":136,"_160":161,"_162":163,"_104":321,"_99":32,"_165":242,"_167":322,"_168":22,"_169":-5,"_170":323,"_98":324},"b33e53f4-3373-11f0-8bc5-9e149126039e","23bc00dd-8cfb-44d0-b9a3-f158c6cff6d3",["D",1747523246963],"# KidC: C Programming Platform for Children\n\nA web-based platform designed to teach C programming to children through interactive lessons, exercises, and a real-time code editor.\n\n## Features\n\n- 🧩 **Structured Learning Paths**: Progressive lessons from basic to advanced concepts\n- 💻 **Interactive Code Editor**: Real-time compilation and execution of C code\n- 🔍 **Hands-on Exercises**: Practice with immediate feedback\n- 🧪 **Automated Testing**: Verify code solutions against test cases\n- 🏆 **Progress Tracking**: Monitor learning achievements\n\n## Project Structure\n\n```\n├── backend/\n│ ├── database/\n│ │ ├── migrations.ts # Schema definitions\n│ │ └── queries.ts # DB query functions\n│ ├── routes/\n│ │ ├── api.ts # API routes\n│ │ └── static.ts # Static file serving\n│ ├── services/\n│ │ ├── compiler.ts # C code compilation service\n│ │ └── exercises.ts # Exercise management\n│ └── index.ts # Main entry point\n├── frontend/\n│ ├── components/\n│ │ ├── CodeEditor.js # Interactive code editor\n│ │ ├── ExercisePanel.js # Exercise display and testing\n│ │ └── LessonView.js # Lesson content display\n│ ├── data/\n│ │ ├── lessons.js # Lesson content\n│ │ └── exercises.js # Exercise definitions\n│ ├── index.html # Main HTML template\n│ ├── app.js # Frontend JS entry point\n│ └── style.css # Custom styles\n└── shared/\n └── types.ts # Shared type definitions\n```\n\n## How It Works\n\n1. Students select a lesson from the structured learning path\n2. Each lesson includes explanations, examples, and interactive code snippets\n3. Students can write and execute C code directly in the browser\n4. Exercises challenge students to apply what they've learned\n5. Automated tests verify solutions and provide immediate feedback\n6. Progress is tracked to guide the learning journey\n\n## Technologies Used\n\n- **Frontend**: HTML, CSS, JavaScript, TailwindCSS\n- **Code Editor**: Monaco Editor\n- **Backend**: Hono (TypeScript)\n- **Database**: SQLite\n- **C Compilation**: WebAssembly-based C compiler",[],[239],"files",[153,172,178,189,199,205,214,220,228,237,246,257,263,270,279,287,296,302,309,318],"counts",{"_329":32,"_330":161,"_331":161,"_332":333},"pulls","branches","forks","envVars",{"_334":32,"_335":32},"count","emptyCount","contents",[338,341,344,347],{"_102":154,"_95":155,"_156":157,"_158":-5,"_159":136,"_160":161,"_162":163,"_104":339,"_99":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_98":340},["D",1747523246963],[155],{"_102":258,"_95":259,"_156":260,"_158":-5,"_159":136,"_160":161,"_162":163,"_104":342,"_99":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_98":343},["D",1747523246963],[259],{"_102":297,"_95":298,"_156":299,"_158":-5,"_159":136,"_160":161,"_162":163,"_104":345,"_99":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_98":346},["D",1747523246963],[298],{"_102":319,"_95":239,"_156":320,"_158":-5,"_159":136,"_160":161,"_162":163,"_104":348,"_99":32,"_165":242,"_167":322,"_168":22,"_169":-5,"_98":349},["D",1747523246963],[239],"upstreamProject","upstreamBranch",{"_102":139,"_104":353,"_354":355,"_95":43,"_137":145,"_99":356,"_138":-5,"_140":-5,"_357":358,"_106":-5,"_150":22,"_108":143,"_149":359,"_16":147,"_148":96},["D",1747519362296],"updatedAt",["D",1747525033574],19,"lockfileKey","1747525040863-esm.town_v_Zoe13_C_TuTor@19-main","Zoe13","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.environment-variables",{"_93":94,"_95":96,"_100":366,"_332":371},{"_102":103,"_95":96,"_104":367,"_106":-5,"_107":22,"_108":109,"_110":-5,"_111":-5,"_14":112,"_113":-5,"_114":22,"_115":-5,"_116":32,"_16":117,"_118":119,"_120":119,"_121":122,"_123":122,"_124":122,"_125":119,"_126":119,"_23":368,"_130":369,"_133":370,"_150":22},["D",1747523246963],{"_93":94,"_128":129},{"_93":94,"_132":129},{"_99":135,"_95":43,"_102":136,"_137":103,"_138":139,"_140":141,"_142":143,"_144":145,"_146":147,"_148":96,"_149":94},[],"actionData","errors"]

Qwertzn2016

C_TuTor

Environment variables