25 agent skills to improve your workflow in GitHub Copilot | Matt Pocock | GitHub Copilot Day — Transcript

Full transcript

1. 0:05I'm extremely delighted to be here and
2. 0:08I've been somehow come into possession
3. 0:11of the most or the second most popular
4. 0:13skills repo in the world. I'm coming to
5. 0:17you from sunny Oxfordshire right now and
6. 0:20I'm going to introduce to you to the
7. 0:22skills repo and also maybe look at a
8. 0:25couple of new things that are coming to
9. 0:26the skills repo and how you can apply
10. 0:28those in GitHub copilot. So, first of
11. 0:30all, let me show you the repo. We are up
12. 0:31to around 259K
13. 0:33stars, which is fairly wild to me. I
14. 0:36never really thought we would get there.
15. 0:38And the place we're going to start is in
16. 0:41the main flow here. So, the idea of
17. 0:44these skills is you can really ship any
18. 0:47size of work that you want to. And the
19. 0:49place we pretty much always start is
20. 0:51with this grill with docks skill. For
21. 0:54those who haven't used my skills before,
22. 0:57this is essentially a way to align
23. 1:00yourself with the agent. And it means
24. 1:02that like it's so often that you will
25. 1:05get the agent and you will look at the
26. 1:08work that they've done and they will
27. 1:10just have not produced the thing that
28. 1:12you want them to. And so doing a kind of
29. 1:15preession grilling kind of before the
30. 1:17agent does any work whatsoever I found
31. 1:20has been absolutely essential. And this
32. 1:22is what that looks like in GitHub
33. 1:24Copilot. So if we head over to the
34. 1:27terminal here, I have been doing some
35. 1:30actual real work on my repo this
36. 1:32morning. My repo is a course video
37. 1:34manager where I handle all of my video
38. 1:36editing. I manage all of my course
39. 1:38videos. And let's take a look at what
40. 1:40that actually looked like. So what I did
41. 1:42first of all is I use GitHub issues to
42. 1:45coordinate all the things I want to
43. 1:47change about the repo itself. This means
44. 1:50that keeping those outside of the repo,
45. 1:52I just get a lot more value in pumping
46. 1:54those into uh automated loops, in
47. 1:57passing them directly to agents, and
48. 1:59sometimes even just triggering them via
49. 2:01labels. But that's kind of outside the
50. 2:03scope for today. But what that looks
51. 2:05like in GitHub Copilot is it means I can
52. 2:07just go into issues. I could press W
53. 2:09here to open up a work tree and I ended
54. 2:11up inside this work tree here. So this
55. 2:14little example, if I press enter to go
56. 2:16in, what happens is I just literally say
57. 2:18grill with docs issue 1612. And this
58. 2:21issue was one that I actually needed to
59. 2:23fix. It's basically adding something
60. 2:25into the CLI that comes served with this
61. 2:28uh course video manager. Now what
62. 2:30happened first is it goes and does an
63. 2:32exploration in a sub agent. Very nice.
64. 2:34And once it's done the exploration, once
65. 2:36it understands what it wants to grill me
66. 2:38about, then it begins asking its
67. 2:41questions. And so these questions here
68. 2:42supported hierarchy selectors. So the
69. 2:45problem here is that I've got an entity
70. 2:48that I want to fetch called a beat. And
71. 2:50that beat is attached to videos, but it
72. 2:53wants to be able to search not only on
73. 2:55videos, but on lessons where there are
74. 2:57multiple videos and on sections where
75. 2:59there are multiple lessons beneath that.
76. 3:01And so it says, okay, both selectors
77. 3:03mutually exclusive. I'm going to um use
78. 3:06a dictation tool to just answer these
79. 3:09questions fully because I kind of
80. 3:10prepped a little bit for this. So I know
81. 3:11what I'm doing. Yeah, I think we should
82. 3:13use um all three supported hierarchy
83. 3:15selectors. I think using the
84. 3:18deterministic hierarchy order makes
85. 3:19sense. And then videos with an empty
86. 3:22plan. I think we can just exclude them.
87. 3:24I don't think we need to add any kind of
88. 3:26uh extra signal in there. So now that's
89. 3:30gone in. I'm just going to press return
90. 3:31there. And it's now going to ask me the
91. 3:33next round of questions. In other words,
92. 3:36what grill with docs is doing is it's
93. 3:38pushing out the frontier of these
94. 3:40questions and we're reaching alignment
95. 3:43slower and slower or rather faster and
96. 3:45faster and faster. So, it's gone and
97. 3:47kicked off another explore agent and
98. 3:49while it's kicking off the explore
99. 3:50agent, it's going to ask me some more
100. 3:52questions. This level of alignment
101. 3:54basically means that you and the agent
102. 3:55are reaching a shared understanding
103. 3:57together. You are figuring out where
104. 4:00you're going together. And this is
105. 4:01really useful in situations where you
106. 4:04have lots of unknown unknowns where you
107. 4:06don't quite know where you're going. And
108. 4:08so I absolutely love this. But then what
109. 4:11happens next? What do you do after
110. 4:13you've done a grilling session? Well,
111. 4:15let's take a look at what happened next.
112. 4:17So in my real version here, what I did,
113. 4:20this is fairly long chat history. We did
114. 4:22our grilling session. It did a bunch of
115. 4:25asked the user a bunch of questions,
116. 4:26asked the user more questions and then
117. 4:28it kicked off and actually implemented
118. 4:30it. So what grill we or what grill with
119. 4:33docs does is it takes that set of
120. 4:35questions that it asked you and then
121. 4:37tries to reach a shared understanding
122. 4:39with you. And then what we end up with
123. 4:41is a nice little pull request. So if I
124. 4:43head into the PR itself, I've done a
125. 4:46little trick actually in the PR which
126. 4:48I'm rather proud of and is actually not
127. 4:50my trick, it's somebody else's. So, if
128. 4:52we take a look at uh where was the PR
129. 4:55here? It was uh add
130. 4:59this one. Add bulk section and lesson
131. 5:02beat lists. Now, this PR body probably
132. 5:05looks rather nice to you. What we have
133. 5:08is we have this rather nice little diff
134. 5:11showing exactly what has changed about
135. 5:13the CLI. You have just this very small
136. 5:16amount of preserves the current compact
137. 5:19uh excludes uh archive beats, lessons,
138. 5:21etc. And we have a nice little mermaid
139. 5:23diagram which we can open up here. So we
140. 5:25see that sections, okay, sections
141. 5:27contain lessons that have a fractional
142. 5:28order. Lessons contain videos and we can
143. 5:31access those with the lesson. And then
144. 5:33videos contain the beats with their
145. 5:34fractional order. You know, this is a
146. 5:36real application. There's stuff
147. 5:37relatively complex here. And we can dive
148. 5:39into this mermaid diagram and this diff
149. 5:42and understand it a lot better. And the
150. 5:44thing that's firing here, the thing
151. 5:46that's making this look nice is not my
152. 5:49skill. Actually, I'm going to shout out
153. 5:51Dexter Horthy at Human Layer Skills
154. 5:54who's written a brilliant skill called
155. 5:55Show Me. Helps the user understands the
156. 5:58current topic visually with concise
157. 6:00diagrams, code shaped sketches, and
158. 6:02focused HTML artifacts. I mean, just
159. 6:04look at this stuff.
160. 6:06This is basically a really really nice
161. 6:09set of tools for understanding how code
162. 6:12changes. we have a pseudo code. Um like
163. 6:15if you have changes to an algorithm
164. 6:17that's relatively complicated, we can
165. 6:19show it as pseudo code. We can show
166. 6:21runtime control flow as a call tree
167. 6:23here. This UI structure one is amazing
168. 6:25for front-end components because it
169. 6:27shows exactly where each component is.
170. 6:30It can sort of show stuff changing
171. 6:32across different components and
172. 6:35different files. And then we have
173. 6:36mermaid diagrams of course which GitHub
174. 6:38handles naturally. And we have file
175. 6:40responsibility and all that stuff. The
176. 6:42one I really like is diff. So using diff
177. 6:45for component changes, for file layout
178. 6:48changes, for call tree and call stack
179. 6:49changes. And what this skill does is it
180. 6:52really encourages the agent to push
181. 6:55towards using these uh sort of diff
182. 6:58views instead of writing a bunch of
183. 7:00stuff in text. And so the nice thing
184. 7:02about this PR is that it's really short
185. 7:04to read. You know, there's less than 100
186. 7:06words here. And once you've dived in to
187. 7:08understand the mermaid diagram, you dive
188. 7:09in to understand the diff, it's pretty
189. 7:11nice. And so as part of this skill or
190. 7:13part of this session here, which is uh
191. 7:17back here, at some point in the session,
192. 7:19I said, okay, use show me to create the
193. 7:21PR. Now, what happens next? So, one
194. 7:26thing I'm really interested in is sure,
195. 7:28you've got this PR, but how do we make
196. 7:30sure that before the human gets to this
197. 7:32PR, how do we make sure that this PR is
198. 7:36of high enough quality that we can
199. 7:38really um guarantee that the user's time
200. 7:41is not wasted, right? Because
201. 7:45I just hate and this is something that
202. 7:47comes up again and again and again when
203. 7:48I work with teams and try to get their
204. 7:50processes better. Like so many teams are
205. 7:54going, okay, PRs are now the bottleneck.
206. 7:56How do we get through the enormous
207. 7:58amount of PRs that we're seeing? And
208. 8:00sure, we can improve the DX, right? We
209. 8:02can improve this view to make sure that
210. 8:04it's as easy to review as possible, but
211. 8:07we also need to make sure that the code
212. 8:08itself is of high enough quality. And so
213. 8:11for that, I recommend using my code
214. 8:13review skill. So after implementation, I
215. 8:16recommend running this code review
216. 8:17skill. It's somewhere in the history
217. 8:19here. And this code review skill, what
218. 8:22it does, there you go. There's the show
219. 8:23me that we had before. What code review
220. 8:26does is it first figures out what you're
221. 8:29diffing against, what has changed, and
222. 8:31it's using origin main as the fix point
223. 8:33here. It then searches for any um coding
224. 8:37standards that you've got inside your
225. 8:38repo. You can see GitHub Copilot
226. 8:40searching for the coding standards here.
227. 8:42It's reading the claw.md files and it
228. 8:45now does two things. it spawns a sub
229. 8:48agent to check all those coding
230. 8:51standards. So it's checking whether the
231. 8:53actual um code that was implemented
232. 8:56corresponds to the stuff you've written
233. 8:58that you know we need to do it this way
234. 9:01we need to do it X way and I have a list
235. 9:03of coding standards that I keep in my
236. 9:05repo that I append to when things go
237. 9:08wrong and we'll talk about that in a
238. 9:09minute. Then it's also doing a spec
239. 9:12check. So it's doing a check against
240. 9:14what I actually specified using this
241. 9:16conversation history making sure that
242. 9:18the thing that was built is actually the
243. 9:21thing that we wanted. And what this
244. 9:22means is because we're doing these in
245. 9:24sub aents these are clean context
246. 9:26windows. It means that the agent drops a
247. 9:29lot of its preconceptions. We get a new
248. 9:31trajectory in the conversation and is
249. 9:34often able to surface stuff that you
250. 9:35hadn't considered before. And so looks
251. 9:38like our spec came back with no
252. 9:40findings. That's nice. and standards.
253. 9:41There's one judgment call duplicated
254. 9:43beat learning goal relation
255. 9:45configuration in DB beat services
256. 9:47operations. Okay, interesting. If we go
257. 9:49into GitHub copilot, we can see that
258. 9:51this was created as a commit here. So,
259. 9:54dduplicate beat relation query. Let's
260. 9:56review here and we can see that okay,
261. 9:59what it did was before we had a bit of
262. 10:02duplicated configuration between two
263. 10:03calls and it turned that into an as uh
264. 10:07kind of object here to figure that out.
265. 10:09That's nice. That's a nice little
266. 10:11change. And all of that happens. Code
267. 10:13review happens before the user goes to
268. 10:16review. I think there's this prevailing
269. 10:18idea with uh AI code review that the
270. 10:22code review should then go to the human
271. 10:24to figure out what should change next or
272. 10:27whether we should actually implement
273. 10:29these things. In other words, the output
274. 10:30of most code review skills is comments.
275. 10:33I believe that code review is kind of
276. 10:35part of the implementation flow and so
277. 10:37it's kind of like a traditional red
278. 10:38green refactor. The implementer agent is
279. 10:41responsible for doing the red green like
280. 10:43just getting the thing working and then
281. 10:45the refactor is done by these review
282. 10:47agents that I've been working with. So
283. 10:49that means we end up with a PR that is
284. 10:51pretty nice to review. And actually
285. 10:53looking down the code here, I can see
286. 10:56okay, there's something that is sort of
287. 10:58stressing me out a little bit. It's not
288. 11:00anything to do with a command here or
289. 11:02any of this stuff. I just had a little
290. 11:04look and I realized, okay, this where is
291. 11:07this? this RPC layer here. I've got a
292. 11:10feeling that this is not very type-
293. 11:11safe. Had a little look inside the code
294. 11:13and I realized ah that's pretty gross
295. 11:16actually. I really don't like that. And
296. 11:18so what I've realized is I want to I
297. 11:20don't want to block this PR but as part
298. 11:22of this PR merging or maybe uh in a
299. 11:25stack I want to take a look at that work
300. 11:28take a look at this code and maybe think
301. 11:31about improving the architecture of it.
302. 11:33And for that we have a lovely lovely
303. 11:36skill which is in the upkeep section
304. 11:38which is called improve codebase
305. 11:40architecture. What this skill does is it
306. 11:43takes a look at your repo and you can
307. 11:46give it a little nudge for the things
308. 11:47you want it to take a look at. And what
309. 11:50it does is it gives you a report based
310. 11:53on the things that it thinks you should
311. 11:54change. And this report can be
312. 11:56incredibly valuable. So if we take a
313. 11:59look at the report that ours generated I
314. 12:01think it's this one actually. Apologies
315. 12:02for the sudden switch to light mode. Let
316. 12:04me take a look at the um
317. 12:07actual
318. 12:09uh session which was inside improve
319. 12:11codebase architecture planning. Now what
320. 12:13I did was I called this with I want you
321. 12:15to take a look at the recent PR and see
322. 12:17if you can improve anything related to
323. 12:18the RPC. Maybe make things more type-
324. 12:21safe. I'm not quite sure of the
325. 12:22architecture around that area. I want
326. 12:23you to take a look and offer some
327. 12:25suggestions. This code is stuff that I
328. 12:27haven't really authored myself. I've
329. 12:28been kind of letting the AI run wild.
330. 12:30I'm sure that folks have a have a strong
331. 12:33sense of what that feels like. An
332. 12:35improved codebase architecture here,
333. 12:36what it produces is a very nice little
334. 12:39diagram. The first thing it's saying is
335. 12:41okay, these are its recommendations down
336. 12:44here. Check every remote call.
337. 12:46Interesting. So, it flags up the uh
338. 12:49exact lines that it's looking for here
339. 12:51and it's saying the problem. The remote
340. 12:53adapter module is shallow at the scene.
341. 12:55Each adapter checks calls that it has.
342. 12:57It does not report a missing call. The
343. 12:59final cast tells Typescript that the
344. 13:00adapter has every domain call. Now, this
345. 13:03is pretty gnarly language that it's
346. 13:05using here. And for this gnarly
347. 13:07language, I actually have another skill
348. 13:09that I really like. In fact, there's two
349. 13:10skills. There is my skill, but I'm
350. 13:12actually going to shout out someone
351. 13:13else's skill called uh PTO's skill. And
352. 13:17PTO here is a phenomenal skill writer
353. 13:21and this is one you absolutely have to
354. 13:22have in your library which is it
355. 13:26basically takes AI text and it unslops
356. 13:28it. So it turns it into really beautiful
357. 13:32I maybe not sure about beautiful but it
358. 13:35takes out all of the AI tells from your
359. 13:38work and it means that horrible sort of
360. 13:40like um garbage like this the remote
361. 13:43adapter module is shallow at the seam
362. 13:45you can actually get it to write it in
363. 13:46much planer language. So, I strongly
364. 13:48recommend that if you're interested in
365. 13:50an unsloped skill. However, I do, you
366. 13:52know, I do understand what it means and
367. 13:54I do like this idea. Okay, we can just
368. 13:56reduce make it a bit more simple here
369. 13:59with there's a little bit down the
370. 14:00bottom here that I also liked as well.
371. 14:02So, this is sort of a deep module coming
372. 14:04out from a lots of shallow modules. So,
373. 14:06what I did was I decided, okay, let's
374. 14:08actually implement that. Now, what is
375. 14:10implementing something this complicated
376. 14:13look like? Because the previous one I
377. 14:15happen to know sort of the relative
378. 14:17scope of what we were trying to do. I
379. 14:19knew that we could walk through it just
380. 14:22in a single session. We wouldn't need to
381. 14:25um do it over multiple sessions. In
382. 14:27other words, we just did grow with docs,
383. 14:29then we implemented it and then we used
384. 14:31code review at the bottom. But for
385. 14:33things that might cross over multiple
386. 14:35sessions or might spiral out of control
387. 14:37in terms of the size, then I recommend a
388. 14:40different approach. You can do grill
389. 14:41with docs and or in our case we've kind
390. 14:44of got something pretty workable
391. 14:45already. We can go improve codebase
392. 14:47architecture and then turn that into a
393. 14:50spec. Now the point of a spec is if we
394. 14:53take a look at our GitHub issues in
395. 14:55here, we can take a look at this spec
396. 14:57that I created which is uh I think it is
397. 15:02here. Make the CVM RPC call mappings and
398. 15:06forwarding type save. What I ended up
399. 15:08doing was I turned that really nice um
400. 15:12sort of diagram here, this uh spec of
401. 15:14what was supposed to be done and I
402. 15:16turned it into a proper spec where we
403. 15:18had user stories. We have a solution
404. 15:20here and a problem as well as a bunch of
405. 15:22implementation decisions and kind of
406. 15:24specking out exactly what I wanted from
407. 15:25the work and then we call a different
408. 15:28skill under that to create the actual
409. 15:31tickets that correspond to making the
410. 15:33spec reality. So this spec is
411. 15:36essentially the destination and these
412. 15:38tickets are the journey and what I did
413. 15:43is all of this was done inside one
414. 15:45session inside the planning session and
415. 15:47you can see that it's published two
416. 15:48independent tickets right at the bottom
417. 15:50and I've been using two tickets there
418. 15:53and then in a separate session I did the
419. 15:55implementation and this implementation
420. 15:58will be quite new to anyone who's used
421. 16:00my skills before which is I used a skill
422. 16:02called implement spec and I just sent it
423. 16:06the spec. So what it did first is it
424. 16:08went and mapped the tickets dependencies
425. 16:11and then opened a draft PR and then
426. 16:14those two tickets it turned out were
427. 16:15independent so they could be worked on
428. 16:17by themselves independently. And so what
429. 16:20it did was it worked them independently
430. 16:23on separate work trees and branches. So
431. 16:26we have parallelization here. We're able
432. 16:28to spawn out multiple sub aents to put
433. 16:30them on different work trees. GitHub
434. 16:32Copilot is handling all of this for me.
435. 16:35And then it rebased them together and
436. 16:37yeah, merged into DraftBr. Everything's
437. 16:40working. Uh, merge adapter ticket. There
438. 16:43we go. And then it did a code review at
439. 16:46the end. So, one thing that this skill
440. 16:49does really nicely is we can actually
441. 16:51take a look at the skill in a minute is
442. 16:52it runs an exploration agent. It runs
443. 16:55everything it can in parallel and then
444. 16:58it code reviews it at the end and fixes
445. 17:00everything it finds.
446. 17:02So once we get to there, there we go.
447. 17:04You can see the code review running. You
448. 17:05can see it fixing the review findings.
449. 17:07We ended up with a pretty nice PR that
450. 17:10we can actually just stack on top of the
451. 17:12other one. So here is the original PR.
452. 17:15Oh no, here we go. No, this is the the
453. 17:16proper PR. It closes all of the tickets
454. 17:19that we created. Closes the spec. It
455. 17:21closes the each individual ticket. And
456. 17:24then we get a nice thing that we can
457. 17:26actually merge on top of it in order to
458. 17:28make our operations type safe in future.
459. 17:30So that's the flow is if you want to
460. 17:32make your code actually um function
461. 17:35better over time and clear up some of
462. 17:38the slop, you end up with these nice
463. 17:40architecture reviews that you can just
464. 17:41keep working on. But what about if you
465. 17:44want to actually take this approach,
466. 17:48take this unslopping approach and apply
467. 17:50it to your own agent, to your agents
468. 17:52environment. What do you do then? Well,
469. 17:56I've got a new skill. And this new skill
470. 17:58is called retro. Retro, take the four
471. 18:01most recent sessions and do a retro on
472. 18:04them. And a retro comes from the word
473. 18:07retrospective where at the end of a
474. 18:09piece of work, you look back over what
475. 18:11you've done and see what you can
476. 18:13improve. And so agents are pretty good
477. 18:15at this because a lot of agents have
478. 18:17access to their own session history. So
479. 18:19does GitHub copilot. So it reads the you
480. 18:22know most recent sessions reads the
481. 18:24implementation session the architecture
482. 18:25session looks for all the session
483. 18:27artifacts and the session checkpoints
484. 18:28and then it suggests a bunch of ideas.
485. 18:32So we can see the implement spec run
486. 18:34created PR directly from the active
487. 18:35feature branch rather than its intended
488. 18:37base. So there was a little bit of
489. 18:39confusion there with the agent. So it's
490. 18:41saying you probably need to change the
491. 18:43skill a little bit. Tighten
492. 18:44implementation specs integration branch
493. 18:46step resolve the target base before
494. 18:48creating anything. Then it's also
495. 18:50looking at tool economy. So it's seeing
496. 18:52are the tools that we're calling token
497. 18:55efficient enough and also we're looking
498. 18:57at navigation steps here. So this retro
499. 19:00is something that's really exciting to
500. 19:02me and something I'm going to continue
501. 19:04working on and it builds on the main
502. 19:06flow of the skills here where you grill
503. 19:10you then uh either go and create spec
504. 19:12and tickets to work it over multiple
505. 19:15different sessions multiple sub aents.
506. 19:16You then go to implement it. You then do
507. 19:19a code review on it. And then you do a
508. 19:21retro where you look for opportunities
509. 19:23to do better next time. I'm excited
510. 19:25about the growth of these skills. I'm
511. 19:26excited about how so many people are
512. 19:28going to get to work with them. And I
513. 19:30just I love being able to package up my
514. 19:32processes and send them to you. You can
515. 19:34install them. You can modify them,
516. 19:36fiddle with them. And I think that's so
517. 19:38so exciting for this era that we live
518. 19:40in. I love it. So, thank you so much for
519. 19:42watching. Have a great rest of Copilot
520. 19:44Day. See you very soon.