public/code-crispies
2
1
Fork 0
Code Issues 7 Pull Requests Actions Activity

feat: add JavaScript learning section with starter lessons and sidebar section headers #8

Merged
libretech merged 1 commits from feat/impl-feature-20260328-200101-ecae into main 2026-03-28 21:32:39 +01:00
Conversation 0 Commits 1 Files Changed 20 +863 -27
libretech commented 2026-03-28 20:24:30 +01:00
Owner
Copy Link

Implementation Result

Feature: JavaScript Learning Section + Sidebar Section Headers

Summary

Added a complete JavaScript learning section to Code Crispies with 3 lesson modules (11 lessons total) and visual section grouping headers in the sidebar navigation.

Changes Made

New Files (3)

  • lessons/50-js-variables.json - 4 lessons: Constants, Let Variables, Template Literals, Arrays
  • lessons/51-js-dom.json - 4 lessons: querySelector, textContent, Inline Styles, classList
  • lessons/52-js-events.json - 3 lessons: Click Events, Toggle Classes, Input Events

Modified Files (17)

  • schemas/code-crispies-module-schema.json - Added "javascript" to mode enum
  • src/config/sections.js - Added javascript section definition + getModuleSection mapping
  • src/helpers/router.js - Added "javascript" to SECTIONS array
  • package.json / package-lock.json - Added @codemirror/lang-javascript dependency
  • src/config/lessons.js - Imported JS modules, added to all 6 language stores (EN + 5 fallbacks)
  • src/helpers/validator.js - Added validateJavaScriptCode() with contains/not_contains/regex
  • src/impl/LessonEngine.js - Added JS mode to renderPreview() and renderExpectedPreview()
  • src/impl/CodeEditor.js - Added javascript() language extension from @codemirror/lang-javascript
  • src/app.js - Added JS modeConfig, sectionContent, footer links, landing progress
  • src/index.html - Added JS nav links (header + sidebar), landing page section card, removed JS from "Coming Soon"
  • src/main.css - Added full JavaScript section theming (gold #d4a017) + sidebar-section-header styles
  • src/helpers/renderer.js - Added section grouping headers in renderModuleList()
  • tests/unit/sections.test.js - Updated to expect 5 sections, added JavaScript test cases
  • tests/unit/lessons.test.js - Added "javascript" to valid modes, JS module ID assertions
  • tests/unit/validator.test.js - Added 6 JavaScript validation test cases
  • tests/unit/router.test.js - Added JavaScript section route parsing test

Test Results

All 231 tests pass (3 pre-existing skips), 0 failures.

Commit

ae8f9fe feat: add JavaScript learning section with starter lessons and sidebar section headers

Branch: feat/impl-feature-20260328-200101-ecae

# Implementation Result ## Feature: JavaScript Learning Section + Sidebar Section Headers ### Summary Added a complete JavaScript learning section to Code Crispies with 3 lesson modules (11 lessons total) and visual section grouping headers in the sidebar navigation. ### Changes Made #### New Files (3) - `lessons/50-js-variables.json` - 4 lessons: Constants, Let Variables, Template Literals, Arrays - `lessons/51-js-dom.json` - 4 lessons: querySelector, textContent, Inline Styles, classList - `lessons/52-js-events.json` - 3 lessons: Click Events, Toggle Classes, Input Events #### Modified Files (17) - `schemas/code-crispies-module-schema.json` - Added "javascript" to mode enum - `src/config/sections.js` - Added javascript section definition + getModuleSection mapping - `src/helpers/router.js` - Added "javascript" to SECTIONS array - `package.json` / `package-lock.json` - Added @codemirror/lang-javascript dependency - `src/config/lessons.js` - Imported JS modules, added to all 6 language stores (EN + 5 fallbacks) - `src/helpers/validator.js` - Added validateJavaScriptCode() with contains/not_contains/regex - `src/impl/LessonEngine.js` - Added JS mode to renderPreview() and renderExpectedPreview() - `src/impl/CodeEditor.js` - Added javascript() language extension from @codemirror/lang-javascript - `src/app.js` - Added JS modeConfig, sectionContent, footer links, landing progress - `src/index.html` - Added JS nav links (header + sidebar), landing page section card, removed JS from "Coming Soon" - `src/main.css` - Added full JavaScript section theming (gold #d4a017) + sidebar-section-header styles - `src/helpers/renderer.js` - Added section grouping headers in renderModuleList() - `tests/unit/sections.test.js` - Updated to expect 5 sections, added JavaScript test cases - `tests/unit/lessons.test.js` - Added "javascript" to valid modes, JS module ID assertions - `tests/unit/validator.test.js` - Added 6 JavaScript validation test cases - `tests/unit/router.test.js` - Added JavaScript section route parsing test ### Test Results All 231 tests pass (3 pre-existing skips), 0 failures. ### Commit ``` ae8f9fe feat: add JavaScript learning section with starter lessons and sidebar section headers ``` Branch: `feat/impl-feature-20260328-200101-ecae`
libretech added 1 commit 2026-03-28 20:24:31 +01:00
feat: add JavaScript learning section with starter lessons and sidebar section headers ae8f9fef45 
Implementation following plan:
- S01: Foundation: schema, section config, and router
- S02: Install CodeMirror JavaScript language support
- S03: Create JavaScript lesson JSON files (variables, DOM, events)
- S04: Register JavaScript lessons in module stores
- S05: Add JavaScript validation logic
- S06: Add JavaScript mode to LessonEngine preview rendering
- S07: Add JavaScript mode to CodeEditor
- S08: Update app.js for JavaScript mode support
- S09: Update navigation HTML and CSS theming for JavaScript section
- S10: Add section grouping headers in sidebar navigation
- S11: Update and write tests
libretech merged commit dc048eba4e into main 2026-03-28 21:32:39 +01:00
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
No items
No Label
Milestone
No items
No Milestone
Assignees
Clear assignees
libretech libretech-bot
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: public/code-crispies#8
No description provided.
Delete Branch "feat/impl-feature-20260328-200101-ecae"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?