codigo-didatico-ptbr

Writes and revises HTML, CSS, JavaScript, and PHP code in a didactic PT-BR style for high-school lessons.

5|Updated Jun 7, 2022
One-click install
npx skills add https://github.com/werlang/pw1 --skill codigo-didatico-ptbr-werlang
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: codigo-didatico-ptbr
Source: https://github.com/werlang/pw1/tree/main/.agents/skills/codigo-didatico-ptbr
Command: npx skills add https://github.com/werlang/pw1 --skill codigo-didatico-ptbr-werlang

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and assets (resource) components.

What problem does it solve? Teachers and content authors need code examples that high-school students can read, copy, and present in class, but typical production-style code is too abstract and terse for beginners. This Skill ensures every HTML, CSS, JavaScript, and PHP snippet in the repository is written as learning material with explicit logic steps and helpful PT-BR comments. ## Core Features & Use Cases - Didactic Code Writing: Creates or refactors code with simple structures, explicit conditionals, short functions, and concrete example values instead of clever abstractions. - PT-BR Commenting Standards: Adds comments in correct Portuguese that explain intent, decisions, and pitfalls rather than restating obvious lines. - Style Consistency Rules: Preserves vanilla JavaScript, direct DOM manipulation, and the repository's existing PHP style, including guidance on mixing PHP blocks with HTML. - Use Case: When adding a new exercise to the Programação Web I course, use this Skill to implement a task list in vanilla JavaScript with createElement and addEventListener, commented in PT-BR so students can follow the state and rendering flow. ## Quick Start Use the codigo-didatico-ptbr skill to write the exercise in this folder as beginner-friendly code with comments in Portuguese.

Frequently Asked Questions about codigo-didatico-ptbr

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I write beginner-friendly JavaScript code for teaching?▼

Write beginner-friendly JavaScript by using explicit conditionals, short functions, concrete example values, and direct DOM methods like createElement and addEventListener. Avoid abstractions, chained expressions, and data-* attributes that are hard to explain in class.

How to mix PHP and HTML in didactic code examples?▼

Keep data, calculations, decisions, and loops in one continuous PHP block, using echo to print generated HTML. Reserve inline <?= $variable ?> only for short pre-computed values, and avoid fragmenting a single decision across multiple PHP open and close tags.

What makes a good code comment for programming students?▼

A good teaching comment explains intent, rules, or consequences in the students' language, such as why a validation exists or what a variable holds. Avoid line-by-line restatements of obvious code, and keep comments short so they guide reading without cluttering the file.

Does this approach work with frameworks like React or jQuery?▼

No, the Skill intentionally preserves vanilla JavaScript and direct DOM manipulation rather than introducing frameworks. The goal is to keep code explainable at the high-school level without dependencies or patterns beyond the course scope.

When should I avoid overly compact or clever code in lessons?▼

Avoid compact expressions, metaprogramming, and generic helpers whenever students must read, copy, or present the code. Prefer the simplest solution that teaches the target concept, even if it is more verbose than production-style code.