Contents

"Learning to Code with AI" Series — Article 3/7
RSS
RSS sends new articles to the reader of your choice, without an algorithm or newsletter.
TL;DR
A skill can make a workflow reusable. It doesn’t guarantee technical accuracy or compatibility with your project. Before installing it, inspect its source, instructions, scripts, versions, and effects. Start with few skills and adapt them to what already exists.
A Skill Isn’t a Magical Competence Downloaded into the Agent
The term can sometimes give a false impression.
You install a React skill, a TypeScript skill, or a security skill, then assume the agent now knows the best practices for these technologies.
In reality, a skill is primarily a set of instructions, resources, and sometimes scripts that allow an agent to reproduce a specialized method. The documentation for Claude Code and Codex details their current mechanisms.
A skill can be excellent, outdated, too general, dangerous, or simply incompatible with your repository.
It doesn’t replace official documentation. It organizes a way of working with it.
Project Rules, Documentation, and Skills: Three Different Roles
To avoid confusion:
| Element | Primary Role | Example |
|---|---|---|
| Official Documentation | Describe the current functionality of a technology | App Router, TypeScript, Next.js tests |
AGENTS.md or CLAUDE.md |
Maintain the repository’s durable conventions | commands, architecture, prohibitions |
| Skill | Describe a specialized and reusable workflow | React review, security audit, test creation |
Putting all React documentation in the repository’s rules file wastes context. Turning a simple naming convention into a separate skill unnecessarily complicates the project.
The right mechanism depends on the scope of the instruction.
Where to Look First
I recommend this order:
- The official skills and examples from the tool’s publisher.
- The official documentation of the relevant technology.
- Resources maintained by a recognized organization.
- Community skills inspected manually.
- A skill created specifically based on the project’s real needs.
A number of stars or downloads can indicate adoption. It doesn’t prove the instructions are correct today.
For our dashboard, the technical references will remain React, Next.js, and TypeScript. The skill should guide the agent toward these sources, not reinvent them.
The Inspection Checklist Before Installation
Before adding a skill, answer these questions.
Origin
- Who maintains it?
- Is the repository or author identifiable?
- Is there a modification history?
- Does the license allow its use?
Technical Currency
- Which versions of React, Next.js, and TypeScript does it target?
- Does the skill distinguish between App Router and Pages Router?
- Do the proposed commands still exist?
- Do the links point to official references?
Possible Actions
- Does it contain executable scripts?
- Does it install dependencies?
- Does it access the network?
- Can it read environment variables or sensitive files?
- Can it modify the tool’s global configuration?
Compatibility
- Does it respect the existing architecture?
- Does it impose a library that competes with one already in use?
- Does it contradict the repository’s rules?
- Does it assume the presence of missing tools?
If you don’t understand a script, don’t run it just because it comes with a skill.
The Trap of Contradictory Skills
Imagine four installed skills:
- One enforces Jest;
- Another configures Vitest;
- The third requires testing all components via snapshots;
- The fourth prioritizes only behavioral tests.
The agent has more context, but not better direction.
Contradictions increase noise and make decisions hard to explain. For a junior developer, two or three reliable workflows are more useful than a collection of twenty skills.
Useful Skills for Our Mini-Dashboard
I would start with three needs, not necessarily three external packages:
A TypeScript Review
Objective: Identify any, risky assertions, overly broad types, and lack of validation at external boundaries.
A React and Next.js Review
Objective: Verify component responsibilities, data fetching locations, and client/server boundaries.
A Testing Strategy
Objective: Start from expected behaviors, choose the right test level, and avoid assertions that prove nothing.
If no reliable skill exactly matches these needs, it’s better to write a short procedure adapted to the repository.
Creating a Minimal Skill from a Real Problem
A good first skill could formalize the review of a dashboard metric:
# Review of a Dashboard Metric
## Objective
Verify that an external metric is typed, validated, displayed, and tested correctly.
## Procedure
1. Identify the shape received from the API.
2. Verify runtime validation.
3. Check handling of missing and out-of-bounds values.
4. Examine loading, success, and error states.
5. Verify at least one nominal test and one error test.
6. Produce observations before suggesting modifications.
This skill doesn’t try to teach all of React. It turns a precise check into a reproducible workflow.
Testing a Skill Without Entrusting It with the Project
Start with a read-only task:
Apply the TypeScript review workflow to `MetricCard.tsx`.
Do not modify any files.
For each observation:
- cite the relevant code;
- explain the risk;
- classify the priority;
- suggest a verification.
Then evaluate the result: Are the remarks accurate, specific, and compatible with the repository? Does the skill ignore important rules? Does it produce noise?
This limited test allows you to correct the workflow before it influences the entire application.
Adapt Instead of Replace
For an existing project, always start with an inventory: dependencies, conventions, scripts, tests, and architectural decisions.
If the repository already uses Vitest, a skill shouldn’t install Jest without reason. If data validation already exists, it should use it. If a rule is specific to a subfolder, it shouldn’t necessarily apply everywhere.
The skill serves the project. The project shouldn’t warp to satisfy the skill’s preferences.
A Safeguard, Not Proof of Quality
A good skill reduces repetitive errors and makes a method explicit. It doesn’t make human oversight optional.
A junior’s competence is built precisely when they learn to decide: Is this instruction correct, current, useful, and verifiable?
In the next article, we’ll use Claude Code or Codex as a teacher: the agent will provide hints, review our attempts, and help us understand without immediately taking over the keyboard.
