Our review
Adds a new skill to the Skills section of a React component by closely following the existing pattern.
Strengths
- Matches the existing JSX style exactly, ensuring visual consistency.
- Highlights technology names with the appropriate CSS class.
- Leaves existing entries untouched, reducing the risk of regressions.
Limitations
- Works only with the specified SkillsSection.jsx file.
- Requires the skill name to be bolded on first mention.
- The description must adhere to a defined tone and length, limiting flexibility.
Use this skill when you need to add a new skill to the Skills section of an existing React portfolio.
Do not use it for modifying other sections of the portfolio or for a broader refactor of the component.
Security analysis
SafeThe skill only modifies a specific known JSX file by appending a new entry to an array, following a strict pattern without executing external commands or accessing sensitive data. No destructive actions, network calls, or dangerous operations are involved.
No concerns found
Examples
Add a new skill entry for 'TypeScript' to the skills array in src/components/sections/SkillsSection.jsx. Follow the existing pattern and mention TypeScript in bold on first mention.Please add 'Node.js' to the skills section in SkillsSection.jsx, using the same JSX fragment style and bold span formatting as the other entries.Insert a new skill 'Figma' at the end of the skills array in src/components/sections/SkillsSection.jsx, following the existing description format with bolded technology names.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.