메뉴
Draw the early-stage Dino scene with Canvas API using simple primitives. Use when students are at render-focused stages and need help with canvas setup, coordinate placement, draw order, and minimal readable edits in main.js.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Implement compact collision detection, score updates, and game-state transitions for the Dino teaching repo. Use when students are adding obstacles/game-over behavior and need minimal, stage-aligned logic in main.js.
Debug the smallest likely cause first while using frequent Git checkpoints in this teaching repo. Use when students need to isolate bugs, keep diffs small, verify fixes, and preserve readable commit history during Codex-assisted iteration.
Add beginner-friendly jump physics and a minimal frame loop to the Dino teaching project. Use when students need stage-2 style help for input handling, gravity, landing clamps, and requestAnimationFrame without overengineering.
Run and verify this static HTML/CSS/JS teaching repo in WSL with minimal setup. Use when students need to confirm environment basics (git/python3/shell), launch local preview, fix path or static-serving issues, and keep stage-0 changes minimal.
| name | canvas-rendering-basics |
| description | Draw the early-stage Dino scene with Canvas API using simple primitives. Use when students are at render-focused stages and need help with canvas setup, coordinate placement, draw order, and minimal readable edits in main.js. |
Guidance for drawing the initial world (ground + placeholder dino) using simple Canvas API calls.
Rendering is the first visible milestone and foundation for later movement/collision.
main.jsindex.html (canvas sizing)style.css (container display)getContext("2d") fails due wrong canvas idcanvas and ctx are not null"Stage 1 render only. Improve dino drawing with minimal edits in main.js and explain how to verify positions in canvas."