Our review
Adds a new skill entry to the `skills` array in the React SkillsSection component.
Strengths
- Follows a consistent and easy-to-replicate pattern.
- Uses JSX and CSS classes for a professional look.
- Allows extending an existing skill list without breaking code.
Limitations
- Only works for this specific component.
- Requires basic understanding of JSX and fragments.
- The skill name formatting is enforced.
When you need to add a new skill to an existing React skills section.
If you are using a different data structure or a non-JSX framework.
Security analysis
SafeThe skill only modifies a local source file by adding a predefined code snippet; it does not involve network access, command execution, or dangerous operations. The use of $ARGUMENTS is for content insertion, not for arbitrary code execution.
No concerns found
Examples
Add a new skill entry for Python to the skills array in src/components/sections/SkillsSection.jsx. Follow the pattern: name: 'Python', description: (<>...with bold Python on first mention...</>).Insert a new skill entry for Docker into the SkillsSection component. Use the existing JSX fragment format and bold 'Docker' on first mention.Add a new skill entry to the skills array in src/components/sections/SkillsSection.jsx.
The skill to add: $ARGUMENTS
Follow the exact pattern used by existing entries:
{
name: "Skill Name",
description: (<>Description text with <span className="font-semibold dark:text-white">Skill Name</span> highlighted on first mention. Additional detail about experience and usage.</>)
}
Rules:
- Bold the skill name on first mention using
<span className="font-semibold dark:text-white">Skill Name</span> - Bold other technology names mentioned using the same span pattern
- Write 2-4 sentences in a first-person professional tone matching existing entries
- Use JSX fragment syntax (
<>...</>) for the description value - Add the new entry at the end of the
skillsarray, before the closing] - Do not modify any existing entries
Next.js App Router Expert
Development
A skill that turns Claude into a Next.js App Router expert.
README Generator
Development
Creates professional and comprehensive README.md files for your projects.
API Documentation Writer
Development
Generates comprehensive API documentation in OpenAPI/Swagger format.