CODEDALA

The lesson is a three-pane workspace. The left rail carries the task — explanation in Kazakh, a worked example, hints, and a checklist of acceptance steps that the runner verifies as the student edits the code. The middle is a Monaco editor with syntax highlighting, multi-file tabs, a Reset button that snaps back to the starting code, and a Run button that ships the buffer to a sandboxed Node.js runner. The right pane is the terminal output — colour-coded language status (Python · Ready, then the captured stdout) with the last run's result preserved so the student can iterate on the code while reading the output. When all checklist items pass, the bottom-right Next button lights up.

The dashboard is built around the rhythm of an active learner — a daily streak tile, a count of completed lessons, hours-on-platform, and a 9-slot achievement grid that unlocks as students hit milestones (first commit, first array, first deploy). The "continue learning" rail brings up the active courses with their precise progress, so a student returning after a week lands on the next unfinished lesson without searching. The course catalog itself is composed of self-contained modules, but…

…the platform's bigger frame is the roadmap. "Курстар — жеке кубиктер. Жолдар — олардан жиналған рөлге апаратын жолдар." Courses are individual cubes; roadmaps are paths assembled from them, leading to a role. A Frontend track strings together HTML, CSS and JavaScript modules; a Backend track wires Python, PHP and Java fundamentals. The roadmap surface frames the question every learner actually has — "where am I trying to get to?" — instead of just listing courses by topic.

The Flutter mobile app is a companion, not a duplicate of the web. It targets the moments between desk sessions: students who finished a lesson on the laptop pull out the phone on the bus and hammer through the quiz on what they just learned. The home shows the courses they have completed lessons for; opening a course drops them straight into a 4-question multiple-choice run, with green pass-state explanations on correct answers and a brief why-this-was-wrong on misses. The same Node.js back end serves both surfaces, so progress flows in either direction without a sync ritual.

The platform was built with AI as a co-author, not as a wrapper. Lesson scaffolds — task copy, hint ladders, the worked-example code, and a curated set of "common wrong answers" with one-sentence why-they're-wrong notes — were drafted by a model and then passed through a human editorial layer. The same pipeline produced the parallel Kazakh and Russian translations of every lesson body, with the in-Kazakh copy reviewed end-to-end by a native Kazakh-speaking teacher. The error explanations a student sees inside the editor are not stock "syntax error" messages — they're plain-language hints generated against the actual error and the lesson context. The model is a tool inside the build, not a feature on top of it.