<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Daniel Diaz</title>
    <description>The latest articles on DEV Community by Daniel Diaz (@daniel_diaz).</description>
    <link>https://dev.to/daniel_diaz</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2017360%2F8acddb2e-c499-46a0-8e95-80af9ff9f505.png</url>
      <title>DEV Community: Daniel Diaz</title>
      <link>https://dev.to/daniel_diaz</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/daniel_diaz"/>
    <language>en</language>
    <item>
      <title>Stop getting generic output from Copilot. Teach it your patterns.</title>
      <dc:creator>Daniel Diaz</dc:creator>
      <pubDate>Thu, 23 Apr 2026 13:11:44 +0000</pubDate>
      <link>https://dev.to/cloudx/stop-getting-generic-output-from-copilot-teach-it-your-patterns-1358</link>
      <guid>https://dev.to/cloudx/stop-getting-generic-output-from-copilot-teach-it-your-patterns-1358</guid>
      <description>&lt;h2&gt;
  
  
  The Problem
&lt;/h2&gt;

&lt;p&gt;You use Copilot. You ask it to build something, and it does sort of. It follows your prompt, generates working code, and you ship it.&lt;/p&gt;

&lt;p&gt;Then you do it again the next day. And the day after.&lt;/p&gt;

&lt;p&gt;A month later, your codebase has class names in PascalCase next to camelCase functions, three different error handling styles, two ways to structure the same kind of module, and hooks that work differently from each other for no clear reason.&lt;/p&gt;

&lt;p&gt;All of it generated by Copilot. All of it reviewed and accepted by you.&lt;/p&gt;

&lt;p&gt;The problem isn't that Copilot generates bad code. It generates &lt;em&gt;generic&lt;/em&gt; code. It doesn't know your stack, your team's decisions, or the patterns you settled on six months ago. It works from its training data. And your codebase slowly starts to look like it was written by the internet.&lt;/p&gt;




&lt;h2&gt;
  
  
  What are Agent Skills?
&lt;/h2&gt;

&lt;p&gt;Agent Skills are Markdown files that tell Copilot what &lt;em&gt;your&lt;/em&gt; conventions are, for a specific domain, task, or workflow. Persistent context the agent reads before generating anything in that area.&lt;/p&gt;

&lt;p&gt;They live in your repo at:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;.github/
└── skills/
    └── your-skill-name/
        └── SKILL.md
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That's the entire setup. No config files, no registration, no CLI step. The file being there is enough for VS Code to discover it.&lt;/p&gt;

&lt;p&gt;When you mention the skill in a chat prompt like &lt;code&gt;"Use the component-structure skill to create a new button"&lt;/code&gt;, Copilot reads that SKILL.md first, then generates code that follows your conventions.&lt;/p&gt;

&lt;p&gt;This is what separates skills from regular prompts: &lt;strong&gt;they're reusable, versioned, and shared through the repo.&lt;/strong&gt; Your conventions stop living in someone's head or a doc nobody reads; they live next to the code they govern.&lt;/p&gt;

&lt;p&gt;With a well-written &lt;code&gt;description&lt;/code&gt;, Copilot can automatically load the relevant skill based on your request without explicit mention. Explicitly referencing skills is more common with smaller models that need extra guidance to identify the right context.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;VS Code added native skill support and the &lt;code&gt;/create-skill&lt;/code&gt; command in &lt;a href="https://code.visualstudio.com/updates/v1_110" rel="noopener noreferrer"&gt;version 1.110&lt;/a&gt;. In &lt;a href="https://code.visualstudio.com/updates/v1_113" rel="noopener noreferrer"&gt;version 1.113&lt;/a&gt;, a dedicated Chat Customizations editor was added, providing a centralized UI to manage skills, instructions, and agents from a single place.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  A minimal SKILL.md
&lt;/h2&gt;

&lt;p&gt;Here's the minimum a skill needs to actually work:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;code&gt;.github/skills/component-structure/SKILL.md&lt;/code&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Frontmatter:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight yaml"&gt;&lt;code&gt;&lt;span class="nn"&gt;---&lt;/span&gt;
&lt;span class="na"&gt;name&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s"&gt;component-structure&lt;/span&gt;
&lt;span class="na"&gt;description: Guidelines for creating React components following team conventions&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s"&gt;named exports, props interface, no inline JSX logic.&lt;/span&gt;
&lt;span class="nn"&gt;---&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Body:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight markdown"&gt;&lt;code&gt;&lt;span class="gh"&gt;# Component Structure Skill&lt;/span&gt;

&lt;span class="gu"&gt;## When to use&lt;/span&gt;
Creating new React components or reviewing component patterns.

&lt;span class="gu"&gt;## Conventions&lt;/span&gt;
&lt;span class="p"&gt;-&lt;/span&gt; One component per file
&lt;span class="p"&gt;-&lt;/span&gt; Props interface defined above the component
&lt;span class="p"&gt;-&lt;/span&gt; Named exports only (no default exports)
&lt;span class="p"&gt;-&lt;/span&gt; No inline logic in JSX, extract to handlers or custom hooks
&lt;span class="p"&gt;-&lt;/span&gt; Error boundaries at page level, not inside components

&lt;span class="gu"&gt;## Never do this&lt;/span&gt;
&lt;span class="p"&gt;-&lt;/span&gt; Default exports
&lt;span class="p"&gt;-&lt;/span&gt; Logic directly in JSX
&lt;span class="p"&gt;-&lt;/span&gt; Props without an explicit interface
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Pattern example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="kr"&gt;interface&lt;/span&gt; &lt;span class="nx"&gt;ButtonProps&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;label&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kr"&gt;string&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="nl"&gt;onClick&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="k"&gt;void&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="nl"&gt;disabled&lt;/span&gt;&lt;span class="p"&gt;?:&lt;/span&gt; &lt;span class="nx"&gt;boolean&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;Button&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="nx"&gt;label&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;onClick&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;disabled&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="kc"&gt;false&lt;/span&gt; &lt;span class="p"&gt;}:&lt;/span&gt; &lt;span class="nx"&gt;ButtonProps&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;handleClick&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nx"&gt;disabled&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="nf"&gt;onClick&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
  &lt;span class="p"&gt;};&lt;/span&gt;

  &lt;span class="k"&gt;return &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="nx"&gt;onClick&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;handleClick&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="nx"&gt;disabled&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;disabled&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
      &lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;label&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/button&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;  &lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The &lt;code&gt;name&lt;/code&gt; field must match the directory name exactly. The &lt;code&gt;description&lt;/code&gt; is what Copilot reads to decide whether to load the skill, so be specific. Full frontmatter reference: &lt;a href="https://code.visualstudio.com/docs/copilot/customization/agent-skills#_skillmd-file-format" rel="noopener noreferrer"&gt;SKILL.md file format&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Four sections. One pattern. A few explicit don'ts.&lt;/p&gt;

&lt;p&gt;When Copilot reads this before generating a component, it follows the same structure every time not because it guessed right, but because you told it.&lt;/p&gt;

&lt;p&gt;The skill doesn't need to be exhaustive. &lt;strong&gt;It needs to be specific.&lt;/strong&gt; A skill that covers one thing well beats one that tries to cover everything and ends up covering nothing.&lt;/p&gt;




&lt;h2&gt;
  
  
  Creating a skill from a conversation
&lt;/h2&gt;

&lt;p&gt;One of the more useful additions in VS Code 1.110 is &lt;code&gt;/create-skill&lt;/code&gt;. After debugging a problem across several chat turns and landing on the right approach, you type:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;/create-skill
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The agent extracts the pattern from your conversation and scaffolds a SKILL.md for you. You review, adjust, commit.&lt;/p&gt;

&lt;p&gt;This is how skills actually get created in practice. &lt;strong&gt;You don't design a skill from scratch.&lt;/strong&gt; You solve a problem, recognize you'll solve it the same way every time, and capture that. &lt;code&gt;/create-skill&lt;/code&gt; removes the friction of doing the capture manually.&lt;/p&gt;




&lt;h2&gt;
  
  
  The Ecosystem
&lt;/h2&gt;

&lt;p&gt;Skills are one piece of a larger customization system. Here's a quick map:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fb2pg9dlm1xy0vre71373.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fb2pg9dlm1xy0vre71373.png" alt="How a general agent loads skills to become specialized" width="800" height="800"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Instructions&lt;/strong&gt; (&lt;code&gt;copilot-instructions.md&lt;/code&gt; / &lt;code&gt;.github/instructions/&lt;/code&gt;): always-on context loaded in every session. Good for project-wide rules.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Skills&lt;/strong&gt; ← you're here: domain-specific, activated on demand when mentioned in chat.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Hooks&lt;/strong&gt;: scripts that run at specific points in the agent lifecycle: before a response, after a file write, on session start.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;MCP Servers&lt;/strong&gt;: external tools that give the agent capabilities your codebase doesn't have natively, like database access, browser automation, or external APIs.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Plugins&lt;/strong&gt;: installable bundles that package all of the above together.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Each of these has its own post coming. Skills are the easiest starting point entirely local to your repo, zero infrastructure, and the effect on the agent is immediate.&lt;/p&gt;




&lt;h2&gt;
  
  
  What I Learned
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;The model doesn't know your stack. You have to teach it.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Copilot is trained on public code. Your team's specific decisions aren't in that data. Skills are the mechanism for closing that gap.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;One good skill beats ten prompts.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A well-written skill invoked consistently produces better results than re-explaining your conventions in each prompt. The repeatability is the point.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The skill itself is documentation.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Writing a SKILL.md forces you to articulate things that previously existed informally. Once it's committed, the team has a shared reference, not just for Copilot.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The real value shows up at review time.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;When everyone uses the same skill, code review stops being about style. You argue about logic instead. That's the conversation worth having.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;This is the first post in a series on VS Code agent customizations: Skills, MCP Servers, CLI, Hooks, and Plugins.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Official docs: &lt;a href="https://code.visualstudio.com/docs/copilot/customization/agent-skills" rel="noopener noreferrer"&gt;Agent Skills VS Code&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

</description>
      <category>vscode</category>
      <category>githubcopilot</category>
      <category>agentskills</category>
      <category>ai</category>
    </item>
  </channel>
</rss>
