Skip to content

Commit 5973971

Browse files
authored
Merge pull request #7139 from layer5io/copilot/create-custom-coding-agent
[agents] Add custom GitHub Copilot agent for blog post creation
2 parents f44e981 + a74f3f0 commit 5973971

5 files changed

Lines changed: 1217 additions & 0 deletions

File tree

.github/agents/QUICK_REFERENCE.md

Lines changed: 246 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,246 @@
1+
# blog-writer Agent Quick Reference
2+
3+
A quick reference card for using the blog-writer custom agent.
4+
5+
**Agent Configuration:**
6+
- Uses most powerful AI model available
7+
- Content tailored for platform engineers, DevOps engineers, SREs, IT administrators, Kubernetes operators, cloud native developers, solution architects, enterprise architects, and developers
8+
9+
## Basic Syntax
10+
11+
```
12+
@blog-writer [Create/Write] a blog post about [topic]
13+
```
14+
15+
## Common Tags (by usage frequency)
16+
17+
| Tag | Uses | Tag | Uses |
18+
|-----|------|-----|------|
19+
| Open Source | 18 | Meshery | 15 |
20+
| Community | 14 | Kubernetes | 9 |
21+
| ai | 8 | Meet The Maintainer | 8 |
22+
| docker | 7 | Service Mesh | 2+ |
23+
24+
## Common Categories
25+
26+
- **Meshery** - Meshery product features
27+
- **Community** - Community news, events, spotlights
28+
- **Open Source** - Open source topics
29+
- **Kubernetes** - K8s-focused content
30+
- **Kanvas** - Kanvas features and guides
31+
- **Platform Engineering** - Platform engineering topics
32+
- **Cloud Native** - General cloud native content
33+
34+
## Required Components Checklist
35+
36+
- [ ] Frontmatter with all fields
37+
- [ ] BlogWrapper import and usage
38+
- [ ] At least 1 graphic/image
39+
- [ ] At least 1 CTA component
40+
- [ ] BlockQuote or BlockQuoteAlt
41+
- [ ] Multiple cross-page links
42+
- [ ] SEO-optimized title & description
43+
44+
## Component Quick Reference
45+
46+
### Imports
47+
```jsx
48+
import { BlogWrapper } from "../../Blog.style.js";
49+
import { Link } from "gatsby";
50+
import Blockquote from "../../../../reusecore/Blockquote";
51+
import BlockquoteAlt from "../../../../reusecore/Blockquote/Blockquote-alt-style";
52+
import CTA_FullWidth from "../../../../components/Call-To-Actions/CTA_FullWidth";
53+
```
54+
55+
### BlockQuote
56+
```jsx
57+
<Blockquote
58+
quote="Your impactful quote"
59+
person="Name"
60+
title="Title/Role"
61+
/>
62+
```
63+
64+
### CTA
65+
```jsx
66+
<CTA_FullWidth
67+
image={CTAImg}
68+
heading="Heading"
69+
alt="Alt text"
70+
content="Description"
71+
button_text="Button Text"
72+
url="/path"
73+
external_link={false}
74+
/>
75+
```
76+
77+
### Images
78+
```jsx
79+
// Import
80+
import myImage from "./my-image.png";
81+
82+
// Use
83+
<img src={myImage} className="image-center" alt="Alt text" />
84+
```
85+
86+
### Links
87+
```jsx
88+
<Link to="/cloud-native-management/meshery">Meshery</Link>
89+
```
90+
91+
### Special Divs
92+
```jsx
93+
<div class="intro">
94+
<p>Introductory text</p>
95+
</div>
96+
97+
<div class="note">
98+
<a href="url">Call to action</a>
99+
</div>
100+
101+
<div class="tip">
102+
<h3>Tip Title</h3>
103+
<p>Tip content</p>
104+
</div>
105+
```
106+
107+
## CSS Classes for Images
108+
109+
| Class | Effect |
110+
|-------|--------|
111+
| `image-left` | Float left with shadow |
112+
| `image-right` | Float right with shadow |
113+
| `image-left-no-shadow` | Float left, no shadow |
114+
| `image-right-no-shadow` | Float right, no shadow |
115+
| `image-center` | Center, full width |
116+
| `image-center-shadow` | Center with shadow |
117+
118+
## Common Link Destinations
119+
120+
| Type | Path |
121+
|------|------|
122+
| Meshery | `/cloud-native-management/meshery` |
123+
| Kanvas | `/cloud-native-management/meshery/design` |
124+
| Catalog | `/cloud-native-management/catalog` |
125+
| Community | `/community` |
126+
| Slack | `https://slack.layer5.io` |
127+
| Blog | `/blog` |
128+
| Resources | `/resources` |
129+
130+
## SEO Guidelines
131+
132+
- **Title**: 50-60 characters, keyword at start
133+
- **Description**: 150-160 characters, includes keywords
134+
- **URL**: Descriptive, under 60 chars, use hyphens
135+
- **H2/H3**: Include keywords naturally
136+
137+
## File Structure
138+
139+
```
140+
/src/collections/blog/YYYY/MM-DD-descriptive-slug/
141+
├── post.mdx (or index.mdx)
142+
├── image1.png
143+
├── image2.png
144+
└── ...
145+
```
146+
147+
## Frontmatter Template
148+
149+
```yaml
150+
---
151+
title: "Title Here"
152+
subtitle: "Subtitle here"
153+
date: YYYY-MM-DD HH:MM:SS -0530
154+
author: Layer5 Team
155+
thumbnail: ./image.png
156+
darkthumbnail: ./image.png
157+
description: "Meta description here"
158+
type: Blog
159+
category: Category Name
160+
tags:
161+
- Tag1
162+
- Tag2
163+
featured: false
164+
published: true
165+
resource: true
166+
product: Meshery
167+
---
168+
```
169+
170+
**Note:** Always use "Layer5 Team" as the default author.
171+
172+
## RSS Feed Rules
173+
174+
| Feed | Criteria |
175+
|------|----------|
176+
| Meshery Community | Category: Meshery/Announcements/Events AND tags: Community/Meshery/mesheryctl |
177+
| Main Blog | All posts |
178+
| Technical Posts | Exclude: Programs/Community/Events/FAQ |
179+
| News | All news items |
180+
181+
## Quick Prompts
182+
183+
### Feature Post
184+
```
185+
@blog-writer Feature announcement for [Product] - [Feature].
186+
Include use case, how-to, CTA.
187+
```
188+
189+
### Tutorial
190+
```
191+
@blog-writer Step-by-step tutorial: [Topic].
192+
Mark as resource. Include troubleshooting.
193+
```
194+
195+
### Community
196+
```
197+
@blog-writer Community post about [Event/Person].
198+
Use Community category and BlockQuote.
199+
```
200+
201+
### Technical
202+
```
203+
@blog-writer Technical deep-dive: [Topic].
204+
Include code examples, diagrams, best practices.
205+
```
206+
207+
## What Agent Handles
208+
209+
✅ Frontmatter structure
210+
✅ Component imports
211+
✅ Tag/category selection
212+
✅ SEO optimization
213+
✅ Required elements
214+
✅ Cross-linking
215+
✅ RSS feed consideration
216+
217+
## What You Review
218+
219+
📝 Technical accuracy
220+
📝 Tag relevance
221+
📝 Image descriptions
222+
📝 CTA destinations
223+
📝 Link validity
224+
📝 Overall tone
225+
226+
## Troubleshooting
227+
228+
| Problem | Solution |
229+
|---------|----------|
230+
| Wrong category | Specify in prompt: "use [Category] category" |
231+
| Missing component | Request explicitly: "include BlockQuote and CTA" |
232+
| Too technical | Add: "target audience: beginners/general" |
233+
| Not technical enough | Add: "target audience: engineers/architects" |
234+
| Need specific tags | List in prompt: "use tags: X, Y, Z" |
235+
236+
## Resources
237+
238+
- Full docs: `.github/agents/README.md`
239+
- Examples: `.github/agents/USAGE_EXAMPLES.md`
240+
- Template: `/src/collections/blog/blog-template/index.mdx`
241+
- Contributing: `CONTRIBUTING.md`
242+
- Style guide: `AGENTS.md`
243+
244+
---
245+
246+
**Pro Tip**: Start with a simple prompt, review the output, then refine with more specific requirements in a follow-up prompt.

.github/agents/README.md

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
# Layer5 Custom GitHub Copilot Agents
2+
3+
This directory contains custom agent configurations for GitHub Copilot. These agents provide specialized expertise for specific tasks within the Layer5 repository.
4+
5+
## Available Agents
6+
7+
### blog-writer
8+
9+
**Purpose:** Create high-quality blog posts for the Layer5 website
10+
11+
**Configuration:** Always uses the most powerful AI model available
12+
13+
**Target Audience:** Content tailored for platform engineers, DevOps engineers, SREs, IT administrators, Kubernetes operators, cloud native developers, open source contributors, solution architects, enterprise architects, and developers
14+
15+
**Specializes in:**
16+
- Cloud native topics (Kubernetes, service mesh, platform engineering)
17+
- Meshery and Kanvas features
18+
- Community content and announcements
19+
- Open source best practices
20+
- Technical content for engineering practitioners
21+
22+
**Key Capabilities:**
23+
- Uses the official blog template structure
24+
- Selects appropriate existing tags and categories (weighted preference)
25+
- Includes required graphics and images
26+
- Adds Call-to-Action (CTA) components
27+
- Uses BlockQuote components for emphasis
28+
- Adds extensive cross-page hyperlinks to existing content
29+
- Optimizes for SEO (URL, title, description, keywords)
30+
- Considers posts for `/resources` collection inclusion
31+
- Follows Layer5 writing style and tone
32+
- Addresses real-world challenges faced by platform teams
33+
34+
**When to Use:**
35+
- Creating new blog posts about Layer5 projects
36+
- Writing technical tutorials and how-to guides
37+
- Crafting community announcements
38+
- Developing content for Meet the Maintainer series
39+
- Publishing event coverage or recaps
40+
- Creating content for technical practitioners and architects
41+
42+
**Example Usage with GitHub Copilot:**
43+
```
44+
@blog-writer Create a blog post about the new Meshery catalog features,
45+
including information about design patterns and how users can contribute
46+
their own patterns to the catalog.
47+
```
48+
49+
## How Custom Agents Work
50+
51+
Custom agents are specialized configurations that give GitHub Copilot deep expertise in specific areas. They include:
52+
53+
1. **Domain Knowledge:** Understanding of Layer5's projects, style, and conventions
54+
2. **Structural Templates:** Knowledge of required file formats and structures
55+
3. **Best Practices:** Built-in guidelines for quality and consistency
56+
4. **Component Library:** Awareness of available React components and styles
57+
58+
## Agent Configuration Format
59+
60+
Each agent is defined in a YAML file with the following structure:
61+
62+
```yaml
63+
name: agent-name
64+
description: |
65+
Brief description of what the agent does
66+
(must start with "Custom agent:" for proper recognition)
67+
68+
instructions: |
69+
Detailed instructions and guidelines for the agent
70+
Includes templates, examples, and requirements
71+
```
72+
73+
## Adding New Custom Agents
74+
75+
To add a new custom agent:
76+
77+
1. Create a new YAML file in this directory (`.github/agents/`)
78+
2. Follow the naming convention: `agent-name.yml`
79+
3. Include a clear name and description (starting with "Custom agent:")
80+
4. Provide comprehensive instructions with examples
81+
5. Test the agent with GitHub Copilot
82+
6. Update this README with the new agent information
83+
84+
## Guidelines for Agent Instructions
85+
86+
When creating agent instructions:
87+
88+
- **Be Specific:** Include exact file paths, naming conventions, and requirements
89+
- **Provide Examples:** Show complete examples of expected output
90+
- **List Options:** Enumerate available choices (tags, categories, components)
91+
- **Include Constraints:** Specify what must be included and what should be avoided
92+
- **Reference Existing Code:** Point to template files and examples in the repository
93+
- **Consider Edge Cases:** Address common scenarios and special situations
94+
95+
## Benefits of Custom Agents
96+
97+
- **Consistency:** Ensures all outputs follow established patterns
98+
- **Efficiency:** Reduces time spent on boilerplate and formatting
99+
- **Quality:** Incorporates best practices automatically
100+
- **Onboarding:** Helps new contributors understand standards quickly
101+
- **Maintenance:** Centralizes knowledge that might otherwise be scattered
102+
103+
## Troubleshooting
104+
105+
If a custom agent isn't working as expected:
106+
107+
1. Verify YAML syntax: `python3 -c "import yaml; yaml.safe_load(open('agent-file.yml'))"`
108+
2. Check that description starts with "Custom agent:"
109+
3. Ensure instructions are clear and comprehensive
110+
4. Test with simple prompts first
111+
5. Gradually add complexity to your requests
112+
113+
## Resources
114+
115+
- [GitHub Copilot Documentation](https://docs.github.com/copilot)
116+
- [Layer5 Contributing Guidelines](../../CONTRIBUTING.md)
117+
- [Layer5 Blog Template](../../src/collections/blog/blog-template/index.mdx)
118+
- [Layer5 AGENTS.md](../../AGENTS.md)
119+
120+
## Maintenance
121+
122+
Custom agents should be reviewed and updated when:
123+
- Blog post structure changes
124+
- New components are added to the design system
125+
- Tag/category lists are significantly updated
126+
- Writing style guidelines evolve
127+
- Community feedback suggests improvements
128+
129+
Last updated: 2024-11-20

0 commit comments

Comments
 (0)