5 Claude Code Skills I Use as a Senior Software Engineer
Chapters8
The video argues that Claude Code’s true power comes from skills, not just the model, and outlines five skills to boost a software engineer’s productivity, including the sponsor plug and how to install and use them.
Five Claude Code skills that transform it from a fast code generator into a true workflow partner for senior engineers, explained by Maddie Zhang.
Summary
Maddie Zhang, a seasoned software engineer with Google and big-tech internships, reveals how Claude Code truly shines when paired with Skills. She argues that Skills—structured YAML-driven workflows with optional references—unlock Claude Code’s real potential beyond raw model ability. The video walks through five concrete skills: Front-end Design, Grow with Docs, TDD Workflow, Code Reviewer, and Skill Creator, showing how to install, configure, and apply them in real projects. Maddie demonstrates Claude Code’s Plan Mode for project-context-aware planning, and the desktop preview feature for live UI iteration. She also emphasizes safety with auto mode, checkpoints, and revert points to maintain control over generated changes. Real-world examples include building a music box app UI, adding a share button with Failing-Test-First TDD, and performing a security-focused code review on a Cabana PR. By the end, viewers understand how to leverage Claude Code’s Skill ecosystem to ship features faster while preserving code quality and security awareness.
Key Takeaways
- Skills are YAML-based workflows that encode repeatable computer-usage patterns, transforming Claude Code into a workflow partner, not just a code generator.
- Plan Mode in Claude Code lets you contextually outline a feature before any code changes are made, with a read-only plan that requires approval to proceed.
- Auto mode provides safe automated actions while stopping genuinely risky reads or writes, reducing manual approvals during development.
- The Front-end Design Skill injects real design principles (design tokens, visual hierarchy) to produce UI outputs that feel human-crafted rather than generic AI UI.
- Grow with Docs prompts Claude to analyze your project docs (ADR, context MD) and resolve design decisions against the existing codebase, surfacing conflicts early.
- TDD Workflow enforces test-first development with intentional failing tests and coverage checks (80%+) to maintain robust, bug-resistant code.
- Code Reviewer simulates a senior security and reliability review on PRs, highlighting critical, high, and medium findings and suggesting concrete mitigations.
Who Is This For?
Senior engineers and team leads who want to boost productivity with Claude Code, especially for frontend design, code reviews, and safe automation in large codebases.
Notable Quotes
""If you're using Claude Code without skills, you're getting less than 10% of what it is actually capable of. Skills are what turns it from an AI slot fast code generator into something that actually thinks in your workflow.""
—Sets up the core thesis that skills unlock Claude Code's value.
""Plan mode will continue. After it does its magic for a couple minutes, now I say the plan looks quite solid. So, I'm going to accept.""
—Shows how plan mode yields a verifiable, approved plan before coding.
""Auto mode is the better version of that. It handles safe actions automatically and blocks genuinely risky ones, so you're not clicking approve every few seconds...""
—Explains safe automation to streamline workflow.
""Grow with Docs is a skill I reach for before touching an unfamiliar codebase or making large scale changes or refactors.""
—Highlights a skill for rigorous understanding of an existing repo.
""This skill basically acted like a senior security reviewer.""
—Describes the impact of the Code Reviewer skill on security assessments.
Questions This Video Answers
- How do I install Claude Code skills across projects vs per-repo?
- What is Claude Code Plan Mode and how does it improve planning before coding?
- Can Claude Code's auto mode safely handle file writes during development?
- What are practical examples of the Front-end Design Skill in real apps?
- How does the Skill Creator workflow generate a reusable Claude Skill for a new task?
Claude CodeAnthropic Claude CodeCode SkillsPlan ModeFront-end Design SkillGrow with DocsTDD WorkflowCode ReviewerSkill CreatorAuto mode
Full Transcript
If you're using Claude Code without skills, you're getting less than 10% of what it is actually capable of. Skills are what turns it from an AI slot fast code generator into something that actually thinks in your workflow. Hi friends, I'm Maddie. I'm a senior software engineer who previously worked at Google and intern at other big tech companies like Amazon, IBM, and Microsoft. I've been using Claude Code, Anthropic's AI powered identic coding assistant that operates directly inside your computer's terminal with Opus 4.7, the highest rank general available model in coding ability on Sweetbench verified. And what unlocked a completely different level of output for me wasn't the model itself.
It was skills. Skills are why the same tool that produces mediocre output for most people produces something that you might actually ship. Today, I'll walk you through five skills that will supercharge your productivity as a software engineer. covering water clot skills, how to install and find them, and how to use them. The fifth one is the most underrated in my opinion, and I'm so excited to tell you that Anthropic is the sponsor of today's video, which is awesome because I've used Claude Code literally every single day for months now. The link to get started for yourself is in the description.
Let's get into it. Before we walk through the specific skills, let me explain what a skill actually is. A skill is a folder with the skills.md markdown file that encodes a specific workflow and makes it reusable. Here's the structure. There is a YAML front matter at the top. Basically, a name and description that tells Claude when to activate it. Then there's a skill body, which is step-by-step instructions on how to execute that workflow. And optionally, there are reference files. So, for example, documentation, examples, and style guides that Claude will load on demand. For official Enthropic skills, you can install them with the command MPX skills addicills.kill, and then your skill name.
If you want to install the skill across all your projects instead of just the current one, add the global flag. For community open- source skills, the best place to browse is skillsmpp.com. There are more than a million of them indexed there. To install any community skill, run the command mpx skills add and then the name of the skill, which you'll find on the skills page. Let's talk about our first skill, the official anthropic front-end design skill. The problem with AI generated UIs is that without additional guidance, they look very obviously AI generated. So, for example, generic spacing, unnecessary hover effects, and that purple gradient color that at this point is basically the mdash of visual design.
The front-end design skill fixes this by embedding real design principles into how Claude approaches front-end work. It references design tokens, layout rules, visual hierarchy guidance. So, instead of that generic output, you get interfaces that look like a human actually put thought into them. I'm going to show the skill on the music box app I'm building where users can either upload MIDIs or compose music by clicking pins into a cylinder and that then they can play those songs and save them. Before I touch any code, I want to show you Claude codes plan mode. I'll hit shift tab twice to activate it.
In plan mode, Claude reads the project context, asks clarifying questions if it needs to, and builds a structured implementation plan before it changes a single file. This is read only. Nothing moves until I approve. I'm now going to describe the UI I want to create. So, create an interactive music. And now I'm going to click enter. We're going to go ahead and answer some of Claude's questions here. Then click submit. And then plan mode will continue. After it does its magic for a couple minutes. Now, I say the plan looks quite solid. So, I'm going to accept.
One thing I will turn on before it starts generating code is auto mode. If you used cloud code before, you might have run it with dangerously skip permissions lag just to avoid approving every single file read. Auto mode is the better version of that. It handles safe actions automatically and blocks genuinely risky ones, so you're not clicking approve every few seconds, but you're also not flying completely blind. I also want to mention the desktop app preview feature. So, I'm going to ask Claude to use the desktop preview to open my app. I'm going to have the preview panel open on the right side here.
It's a live preview connected to a headless browser. So, as Claude spins up the dev server, I'm watching the UI appear in real time. With this, I can iterate on the design without switching context. Claude can take screenshots, inspect the DOM, and see what is actually rendered. And don't worry about getting to a UI that you like, only to lose it when the AI makes more changes. Claude Code automatically saves checkpoints, snapshots of your code state, and you can always revert. I love this because without checkpoints, I'd be doing get checkout over and over again and hoping I know unstage changes.
The second skill is Girl with Docs by Matt Puk. This skill forces Claude to interrogate you relentlessly about every single aspect of what you're trying to build before it writes a single line of code. It will walk down the design decision tree one branch at a time, resolving dependencies between decisions as they come up. And crucially, it does this against your project's existing domain model. So, it'll read your context. MD, your ADRs, your existing docs, and if something that you say conflicts with how the codebase already defines a term or concept, it calls that out immediately.
So, let's say I want to add a new feature on Cabana, Elastic's open- source data visualization and exploration interface for searching, analyzing, and visualizing data in Elastic Search. I'm going to book this skill with grow with Docs. Add a new plugin to Gabana that tracks user activity across dashboards and exposes a REST API for quering that history. Now watch what happens before it asks a single question. It starts by exploring the existing codebase. So running some bash commands, finding existing plugins, and reading source files. It also has multiple agents that are exploring different parts of the codebase.
So now after a couple minutes, it's created a context MD file from the information that it's gleaned from the cabana repo. And now we are going to answer some questions. So I'm going to ask that the dashboard viewvents I'm going to pick option one here for where the dashboard views should live. So grow with thought docs is a skill I reach for before touching an unfamiliar codebase or making large scale changes or refactors. It surfaces the things that you would have discovered the hard way two weeks in. The third skill is the TDD workflow skill by AFN M.
TDD stands for testdriven development. Write a failing test first, then write the code that makes it pass, then refactor. It's a discipline that senior engineers know matters, but a lot of people skip when they're moving fast. The problem with letting Claude do TDD without this skill is that I'll write the implementation, then write tests that pass against the implementation, which defeats the entire purpose. You end up with tests that are structurally incapable of catching the bug that they're supposed to catch. Let's use this skill by adding a share button to the music box app. So, I'm going to do TDD workflow.
Add a share button to the music box that generates a URL to the save song. We can see that it's creating the test cases before actually implementing the feature and it's generating tests for the edge cases as well, not just the happy path. Now it's running the tests and they all fail. This is intentional because we haven't done the actual implementation yet. Next, it goes ahead and writes the implementation. When it runs a test again, the tests now all pass. And finally, it tests the test coverage to make sure that it's above 80%. For skill four, I want to talk about this code reviewer skill by Shapam Sabu, the one that I reach for most on anything touching shared infra that I might not be familiar with.
So, for example, we're going to type in code reviewer and this PR link to use it on this cabana PR that adds in an opt-in mechanism to skip SFRF validation for requests authenticated via API key or bearer token. This is a security adjacent change that touches O middleware. The skill analyzes this PR and then comes back with a full security report and recommendations. Let's walk through some of its findings organized by severity level. So as a critical finding, the serverless devolve for allowed credentials headers is true with no code level enforcement of the trust model that it depends on.
The PR description actually justifies this by saying a gateway enforces cores for all serverless traffic. That's okay, but that's an architectural assumption and not something that is enforced in the code itself. So if a diverse staging environment doesn't have that proxy in place, the XFR of production silently disappears across the entire instance. As a high priority finding, the exempt schema list is typed as a string or null with no constraint on values. So the bypass compares against a closed set API key bearer, but nothing prevents a future O provider from storing a schema with mixed casing, which would silently fail to bypass XFRF as intended.
The fix is a branded type or a documented lowercase invariant. For a medium priority finding, there's no debug log when XFRF is actually bypassed. So for monitoring and instant response, knowing that a post request went through without the necessary XFRF headers because of credential O would be a very useful signal to debug. It also flagged things like missing test coverage, a naming issue, and also some maintainability concerns. So this skill basically acted like a senior security reviewer. And last but not least, let's talk about skill creator. This one is an official and topic skill and quite a meta one.
It builds skills for you. Here's how the workflow goes. You describe the process you want to make into a skill. Claude interviews you, ask clarifying questions until understands the full workflow, drafts the skill, and packages it into the proper format. You do not have to write any markdown yourself by hand. You can use this if you can't find an existing suitable skill for your use case. So, for example, let's say that I want to create an elastic search query evaluator skill in the cabana repo. So I asked Skill Creator to create me a elastic search query validator to check that any ES queries in my diff use valid DSL syntax, aren't using deprecated query types and followed the performance guidance Cabana has for avoiding expensive aggregations.
Now we're going to go ahead and answer some of Claude's questions. So we want the validator to run against the current branch diff. We wanted to understand ESDSL objects and JSON. We wanted to report findings as a markdown. And it should both report and apply fixes. and we're going to submit those answers. And pretty soon, we now have this shiny new skill. So, this workflow is now reusable for future sessions. So, in conclusion, here are five cla code skills you can use to supercharge your productivity as a software engineer. Front-end design, grill with docs, TDD, workflow, code reviewer, and skill creator.
Of course, you're not limited to those. You can explore the more than a million other skills published out there. And just a reminder, to use Cloud Code, you'll need a Claude plan. So, check out the link in the description. And that's all I have for you in this video. If you found this useful, hit the like button, hype the video, and subscribe. I post videos on AI engineering, career development, and software engineering every week. Thanks for watching, and I'll see you in the next one.
More from Maddy Zhang
Get daily recaps from
Maddy Zhang
AI-powered summaries delivered to your inbox. Save hours every week while staying fully informed.









