The senior engineer's guide to AI coding: Context loading, custom hooks, and automation

1. 0:00 – 3:15

   Introduction to John Lindquist

   1. CVClaire Vo0:00

      There are people out there definitely like me, that really want to know the advanced techniques that can leverage the most powerful parts of these AI-powered coding tools. Where do you want us to get started that you think many people don't think about in terms of how they can use these tools?

   2. JLJohn Lindquist0:15

      Context and diagrams is a great place to start. They're definitely the best way to get AI to do what you want. So they have what are called Mermaid diagrams. This is a way of visualizing database operations, and it's a way of essentially compressing your application down into very small lines of text that show how your application works. Now, for a human to read this, this is a big challenge, but an AI can consume this easily. I could even just say, "Please explain the authentication flow," and because it already has it in the context, it's not gonna have to do a bunch of file reads and code-based exploration to figure this out. It's gonna come up with the results much quicker.

   3. CVClaire Vo0:53

      If I gave you infinite junior-to-mid-career talent, who is always available, who would do the work you would do if you had unlimited amount of time and no meetings, what would you do when a ticket came in? Like, what would you do? [upbeat music] Welcome back to How I AI. I'm Claire Vo, product leader and AI obsessive, here on a mission to help you build better with these new tools. Today, we have John Lindquist at egghead.io, who is a superuser of AI-powered engineering tools like Cursor and Claude Code. Now, I love all you non-technical folks out there, but this is an episode for the senior software engineers who really want to understand how they can use the power features of some of these AI engineering tools to really both optimize the quality of code that they're generating, but also become more efficient as they use their IDE, terminal, and AI assistants to write, check, and deploy code. This is a great episode for any of our advanced users out there, VPs of engineering, CTO, pay attention, send this to your staff engineers. Let's get to it. This episode is brought to you by WorkOS. AI has already changed how we work. Tools are helping teams write better code, analyze customer data, and even handle support tickets automatically. But there's a catch: these tools only work well when they have deep access to company systems. Your copilot needs to see your entire codebase. Your chatbot needs to search across internal docs, and for enterprise buyers, that raises serious security concerns. That's why these apps face intense IT scrutiny from day one. To pass, they need secure authentication, access controls, audit logs, the whole suite of enterprise features. Building all that from scratch, it's a massive lift. That's where WorkOS comes in. WorkOS gives you drop-in APIs for enterprise features, so your app can become enterprise-ready and scale upmarket faster. Think of it like Stripe for enterprise features. OpenAI, Perplexity, and Cursor are already using WorkOS to move faster and meet enterprise demands. Join them and hundreds of other industry leaders at workos.com. Start building today.

2. 3:15 – 5:38

   Using context and diagrams to provide context to AI tools

   1. CVClaire Vo3:15

      John, welcome to How I AI. I have to put some context here, which is we have done quite a bit of coding with Cursor, vibe coding episodes, but a lot of what our audience has asked for is early maturity, less technical introductions to these tools. But there are people out there definitely like me, um, and definitely like folks that follow you, that really do know how to write great software and want to, you know, as people say, "Of course, I'm a 9X engineer, but how do I become a 10X engineer?" [chuckles] With some of these tools, want to know really the advanced techniques that can leverage the most powerful parts of these AI-powered coding tools and get you really high-quality software. So I'm really excited about what you're going to show us today. And so, where do you want us to get started that you think many people don't think about in terms of how they can use these tools?

   2. JLJohn Lindquist4:09

      Yeah, I think, uh, context and diagrams is a great place to start for us. Um, they're definitely the best way to get AI, AI to do what you want. So, um, and we'll be using Claude Code throughout.

   3. CVClaire Vo4:21

      Oh, great. Okay, and so yeah, we've, we've gotten a lot of kind of, um, markdown files in How I AI, but not a lot of diagrams. So why don't you walk us through-

   4. JLJohn Lindquist4:32

      Yeah

   5. CVClaire Vo4:32

      ... how you use those, those assets to help you code better?

   6. JLJohn Lindquist4:38

      Yeah, so these diagrams are all generated from... I can share a prompt with however you wanna share with the audience, um, that can walk through codebase and generate diagrams based on, uh, user actions or user interactions, the events, the channels, whatever happens in your code to help the AI understand the flow and how the pieces are connected. Um, I think Windsurf recently came out with something called Code Maps, a similar concept. Um, uh, essentially pre-loading valuable context so that you have to remember that every time an AI starts, it has no memory, no idea of what's going on in your application, and people try and set up lots of rules and all this stuff around it. Um, but they usually don't include a lot of: how does my application work, and how do the pieces fit? And so you get a lot of really bad edits because it doesn't understand if it mo- if it modifies A, how does that impact B? Um, so we wanna pre-load a lot of that. We can do that using diagrams.

3. 5:38 – 6:48

   Demo: Mermaid diagrams

   1. JLJohn Lindquist5:38

      Uh, so for example, one of these diagrams, um, will have... I, I, I call them markdown files with diagrams in them. So they have what are called Mermaid diagrams, and Mermaid is a standard format for rendering diagrams inside of Markdown. So this is a, a way of visualizing, uh, database operations, and if you were to zoom, zoom in and look at, uh, how... If a record exists, then do this and that, yes, no. And it's a-... A way of essentially compressing your application down into very small lines of text that show how your application works. Now, for a human to read this, this is a big challenge. Uh, we need to open up this big visual, and it turns into, like, looks like an image. But an AI can consume this easily, and it's like a very compressed, very, um, robust way of explaining an application. So we can feed these into our application at, at the startup time. Um, and for the more advanced pro- or the larger projects you get on, the more diagrams you'll have, and you can kind of pick and choose which ones to load. Um, I'm going to load them all

4. 6:48 – 10:30

   Preloading context with system prompts in Claude Code

   1. JLJohn Lindquist6:48

      in, and I'm just gonna open, um, a terminal up in the editor area. So the way I'm gonna do this, if we look at Claude and we look at, look at its options, um, you'll see a bunch of options. The one we're gonna focus on is called Append System Prompt. So in there, before we load in, uh, any sort of user prompt or anything, we're actually gonna say, "Claude, append system prompt," and system prompt, and then you can drop in some text. And we're gonna drop in a command, and this command can read in from our memory, from AI/diagrams, and then this is going to read through, this is a gl- called a glob pattern, read through all of the markdown files, essentially force them into Claude once I do this. So this is reading all the files, all the markdown files, and this is... Cat will kind of, uh, concatenate them all together into a single, uh, text stream.

   2. CVClaire Vo7:53

      Yeah. One thing I wanna call out for folks that are watching this, that... Or, or are listening and maybe not watching, is two things. It seems like, you know, in your, in your standard repos, you're creating a, a memory, um, directory, where you're gonna structure some of the context and files you might want any of these AI tools to use. And I think-

   3. JLJohn Lindquist8:13

      Yeah

   4. CVClaire Vo8:13

      ... everybody's like, "Oh yeah, I've created my agents' markdown file or my Claude one," and I think you can actually structure your, um, context for these tools a lot more purposefully, and so I think this is a really good example of this. The other thing that I, I think a lot of people are quite lazy about is they haven't explored the surface area of all the system commands available in Claude Code.

   5. JLJohn Lindquist8:36

      Yeah.

   6. CVClaire Vo8:36

      And so by using that help command, you can actually see things that, not just chatting with Claude Code you can do, but you can actually inject into how Claude operates, and appending system prompt is one of those ones that I think people probably underuse.

   7. JLJohn Lindquist8:51

      Yeah, absolutely. Um, it's one I use constantly. Um, great points there. Um, so when, when I let this run, you'll notice that there's, um... It's now prompting the user to do something, and we don't have to try and reference all the files, which you'd normally do with at. We don't have to try and tell it, you know, what we're gonna work on. I could even just say, like, I use dictation all the time, "Uh, please explain the authentication flow." [keyboard clicking] And because it already has it in the context, it's not gonna have to do a bunch of file reads and code-based exploration to figure this out. It's gonna come up with the results much quicker. This, this does come at the cost of a lot more context and a lot more, um, tokens being used up front, but the work that you do, the time that you spend on these tasks, is more valuable than that to me. So you'll notice that there were no file reads in this. There were no, um-- It did not search the code base. It didn't do any of that stuff. It just simply had all that in context, and now I can take this and look through it, start creating plans. Let's swap her to plan mode to how we wanna, uh, update and, um, change authentication. So this saves... Again, the, the, the trade-off here is the cost of many tokens up front, but the value is you get a lot faster and a lot more valuable output. As the tasks complete much faster, the tasks are much more reliable because it understands what's going on in

5. 10:30 – 13:23

   The rise of specialized file formats for AI consumption

   1. JLJohn Lindquist10:30

      the code base.

   2. CVClaire Vo10:31

      Two things I think people should think about with this flow. One is, I've said this in a couple episodes, and, and we'll call it out again in yours, is I think that with LLM starting to become more of a part of how we do work and feed context and understand things like documentation or business context, this is the era of the, the file type. And I think so many people think about markdown and JSON files [lips smack] as effective ways to inject context into LLMs. I see a lot of, of course, markdown files. I think more people now write markdown [chuckles] than they, than they have in many, many years. And then a lot of- we've had some episodes on using JSON, for example, to put realistic or semi-realistic data into prototypes. But we're having more and more episodes where people are discovering specific file types that have a specific context structure that are really useful for a use case. In this one, you have Mermaid diagrams, which again, are hard to parse as a human, and even if they turn into graphics, are still hard to parse as a human. Like, I looked at that big diagram, and my eyes crossed, and I said, "I don't wanna, I don't wanna read this." But to a machine, it's very effective. We've also, in some episodes, talked about, um, image and multimedia file formats that not only contain image data, but contain metadata that you can use. And so I think this is an interesting moment where we can all use different file types in a more extensive way than our kind of human brains could, because the machines are so good at using the different component structures or syntax of, of those files. So I think that's pretty interesting, and I think Mermaid diagrams are one of those examples, um, of something that could be used really well.

   3. JLJohn Lindquist12:16

      ... Yeah, absolutely. There's a lot of research being done into how they can compress all of this information down to, like, a single image. So if I could take all of the diagram files and somehow come up with an image format that would store everything in there, could- would the trade-off on tokens be there, and would the trade-off on understanding be there as well? Um, it's, uh... We'll, we'll see if there's more file types that emerge, and I, I'm huge, um, on video and using videos. Uh, Gemini being the best model for uploading video and understanding. Um, and recently built a tool that can take one of my six-hour workshops and, uh, process the entire thing, and take out notes, and examples, and thoughts, and frequently asked questions, so ev- each time I teach a workshop, I can iterate on it, and, um, I don't have to go, like, search through the video some other way. It's-

   4. CVClaire Vo13:07

      Y- you and I will have to trade notes, 'cause I did a very similar thing with our episodes, which is it takes a video of our episode, it pulls out all the learnings, all the code snippets, screenshots where the guest and I look cute [chuckles] and, and put it into, into a blog post. So, so I

6. 13:23 – 19:01

   Mermaid diagram use cases

   1. CVClaire Vo13:23

      agree on that. You know, the second question I had for you, though, is going back to these diagram files in this memory directory, where in your development process do you find that you generate those files? So for me, I actually have a GitHub action that generates files almost exactly like you have, with documentation and diagrams for new features, um, of a, of a specific scope. And so I do it when a pull request is closed, and then I go back and, um, update, update our diagrams. I wonder... I'm, I'm curious where this falls in your- where documentation like this falls into your workflow.

   2. JLJohn Lindquist13:59

      Yeah, usually I think pull request is a, a good paradigm there. Uh, as soon as you have something working where you want it to be working, and then you can say, "Okay, now this is working as expected, please diagram it." I think for a lot of the projects, we already have pre-existing, um, code bases that don't have diagrams, and so that's, that's been the major use case, is taking existing stuff and, um, diagramming all of that so that our AI development is accelerated, I guess, is the buzzword. Um, but yeah, if you're starting from scratch, you definitely just wanna spike, spike things out, get it working. Um, don't worry about diagrams upfront. Um, just use a plan mode, build something, and once it's working, then diagram it out. And then even with the diagrams, um, they're great to help walk you through, like, "What did I just build? Like, I didn't look at any of this code. Uh, show me diagrams of what the code is doing." And then if the diagrams look kind of wonky, you can just say... There, there's, there's tools in there that people are working on, where you can, like, drag around pieces of the diagram to say, "Well, I don't want this to navigate there. I don't want this either to do that," and you could... I don't- there's gonna be so many tools in the next few years that emerge from all this.

   3. CVClaire Vo15:10

      Yeah, and then I will give folks just a couple other use cases of generating Mermaid diagrams from code that are not just about improving the efficiency of using something like Claude Code. Um, I use a lot of diagram generating out of our repo to answer very complex security and data flow requirements from our customers. This is a- it's a workflow that is actually, like, pretty expensive if you ask an engineer to do it, which is, I have specific customer A, they need a very specific data flow diagram of this part of our application, so that they can understand the third-party parts of it. Again, also, if you're going through SOC 2 compliance or any compliance, like, these are, these are assets that historically have just been so tedious to create efficiently and effectively-

   4. JLJohn Lindquist15:55

      Mm-hmm

   5. CVClaire Vo15:55

      ... and now you can kind of generate them on demand. My last question for you on this diagram flow is: do you find that you have the AI write or you would write documentation any differently than you would for a human audience, or do you feel like there's enough overlap that the content, format, et cetera, can be pretty consistent between the two?

   6. JLJohn Lindquist16:17

      I would say it could be pretty consistent. I, I think they serve as a nice bridge between kind of human and AI. Um, definitely think... I, I know people generate documents, like you'll write code and then generate documentation around it using AI for both steps, which is just wild. But, um, yeah, I, I think the markdown is kind of the language of the future for a lot of this, um, text, and then, uh, there you can do images and everything inside of markdown files as well, so they can kind of, um... A- and the front matter of metadata, um, you'll- y- you see Claude using that extensively for their, um, skills and commands-

   7. CVClaire Vo16:55

      Yep

   8. JLJohn Lindquist16:56

      ... and everything, so. Um, and Anthropic is pretty good at pioneering all this stuff. So-

   9. CVClaire Vo17:02

      Yeah

   10. JLJohn Lindquist17:02

       ... if they're using markdown, then-

   11. CVClaire Vo17:04

       Everybody else can.

   12. JLJohn Lindquist17:05

       Yeah.

   13. CVClaire Vo17:06

       Yeah. Uh, again, for people who wanna, like, pull the thread a little further, uh, what, what I do is, yeah, we generate a lot of AI code. Then on pull request, we generate AI documentation internally for our engineers and for AI, obviously, to use as context, and then we take that code, and we generate markdown customer-facing support documents. Again, that really benefit from these workflows, 'cause then you say, "Click button A, move to section B, save this." And so you can really pull the thread on [chuckles] documentation from one asset, and I think you're showing a place where it's really useful from the engineering perspective, but it can start to become customer-facing and all sorts of interesting things.

   14. JLJohn Lindquist17:45

       Yeah, a- and you could summarise the documents for customers. Um, you could have it build little interactive demos. I mean, there's- the sky's the limit. Uh, like, how- however much you wanna support the customer is there, is... You know, if this is enough, then, then great. If it's not, then it's an AI prompt away from-

   15. CVClaire Vo18:02

       Yeah [chuckles]

   16. JLJohn Lindquist18:03

       ... something pretty, I guess.

   17. CVClaire Vo18:04

       This episode is brought to you by Tines, the intelligent workflow platform powering the world's most important work. Business moves faster than the systems meant to support it. Teams are stuck with repetitive tasks-... scattered tools, and hard-to-reach data. AI has huge promise, but struggles when everything underneath is fragmented. Tines fixes that. It unifies your tools, data, and processes in one secure, flexible platform, blending agentic AI, automation, and human-led intervention. Teams get their time back, workflows run smarter, and AI actually delivers real value. Customers now automate over 1.5 billion actions every week. Tines is trusted by companies like Canva, Coinbase, Databricks, GitLab, Mars, and Reddit. Try Tines at tines.com/howiai.

7. 19:01 – 21:05

   Demo: Creating aliases for common AI commands

   1. CVClaire Vo19:01

      Great. So you showed us how to just pull all of these documents into a system prompt. You get much more, um, performant use of something like Claude Code, and this seems like a command that you're using over and over again, and that's something you and I talked about before we started recording, which is how to alias and make more efficient your use of, of different commands. So should we, should we pop over to that, or anything else you wanna show-

   2. JLJohn Lindquist19:27

      Yeah

   3. CVClaire Vo19:27

      ... on diagrams?

   4. JLJohn Lindquist19:28

      That's, that's great. Let's do that. Um, so there are a lot of, uh, with, with... On Mac, it's Zsh is the default shell. Um, on Windows, you do PowerShell, so those look very different. Um, but depending on what tools you use the most, uh, you can easily set up aliases for things like setting the default model for, for Claude, or setting, like, if you want to do something completely dangerously, so that once you open a new terminal, if you just type X, now anything I type has bypass permissions enabled. Or if I type H, this will be haiku. It'll be much faster, but not quite as smart. Um, or if I type in the scenario CDI, um, this will do that diagram loading, um, where once you have these systems in place and these commands in place, then you can just, uh, kind of capture them in the smallest, like... Because I on- because I use these a lot, I, I, I keep them in very short shortcuts, so.

   5. CVClaire Vo20:31

      Yeah, and I can imagine you could, you could do something like this for project-specific context. So you could do, like, CC dash whatever project you're working on. You could pull in the diagrams for just that initiative. So if you're going back over and over again into specific things that need specific context, this would be just a cheap shortcut to, to get you into the mode of, for example, Claude Code, that you want.

   6. JLJohn Lindquist20:55

      Yeah, absolutely.

   7. CVClaire Vo20:57

      You showed a lot of Claude examples here. Are there any other ones that you think are really, really useful for folks, or creative uses of this you think we should think about?

8. 21:05 – 26:39

   Building custom command-line tools for AI workflows

   1. JLJohn Lindquist21:05

      So I tend to build any idea I come up with. Um, so for example, this is one I'm working on called Sketch, and this feeds into the Gemini, uh, Gemini CLI. So, uh, like, what type of website do I want, do I wanna build? Let's do a store for selling, uh, Christmas decorations, and then let's make the homepage of that. Let's make it creative and artistic. For a desktop website, we'll do the GitHub light theme for it, no reference image. Let's do five images, and go ahead and generate it. And this is the sort of thing where, um, kind of beyond, beyond the simple alias, if you, uh, if you've never dived into creating s- what's called a CLI, you can tell an AI, like, "Listen, I wanna use..." Like, this is a wrapper around, um, Gemini, um, where it will execute Gemini with specific prompts. So you have to remember that you have these tools on your desktop, which can do incredible things, but you can also script them, and this is a scripted way of generated, generating images based on all of these, um, all these topics with- or these concepts with preloaded prompts. And yeah, I can say if I wanna add another feature, like, you can just go in there and say, "Please tweak the prompts," or, "Please add this feature," "Please do this," and then instead of, um, constantly thinking of, "Oh, what was that prompt again?" Or, "What was that idea I had?" You can have these little CLIs and these little projects that are just for you, um, because you just, like, build the tools that you need now. And, um, this is just spitting out these, um... My, my mom lives with me, and she's setting up Christmas decorations upstairs. This is why I'm thinking about this. So this-

   2. CVClaire Vo23:02

      Oh, look at that!

   3. JLJohn Lindquist23:03

      Yeah, this is Gemini generating based on the prompt we fed in, based on the color scheme. This is GitHub light Christmas store color theme. Um, and I told it to generate five variations of it, and then we could take one of these images and drop it into one of the, um, drop it into one of the AIs and say, "Let's start building out this website. Let's break this into sections and go from there." And this is kind of like my, uh, ideation, inspiration sort of thing that, that I use.

   4. CVClaire Vo23:30

      One reason I want to make sure people are paying attention to this use case, which is essentially you've exposed a command line interface to do a couple... You know, script a couple workflows around calling, um, NanoBanana and some of the Gemini models to, um-

   5. JLJohn Lindquist23:47

      Mm-hmm

   6. CVClaire Vo23:48

      ... to, to do some things, and there are two benefits, I think, to this that are really important. One is building command line tools has been so opaque and just-

   7. JLJohn Lindquist24:00

      Mm

   8. CVClaire Vo24:00

      ... kind of not fun for so many people for so long. Um, I've built lots of them, and how easy it is to build a really nice command line tool is-

   9. JLJohn Lindquist24:10

      Yep

   10. CVClaire Vo24:10

       ... such a treat for anybody who's ever had to build them and make them look good. Everybody has these cool ASCII-only logos in, in their, in their command line tools, which have been very tedious to make before. So I think one thing is these tools are just a lot easier to build.... two, from a product builder perspective, the reason why I like this move to these command line tools is the constrained UI space of the terminal actually makes sure you don't get distracted in building UI around something as simple as this, right? You just had, like, five questions you had to answer, a couple multi-select. You could tab through those with your keyboard. If you were creating, like, a little WYSIWYG walkthrough web editor thing here, I mean, one, I would've gotten really distracted about how it looks.

   11. JLJohn Lindquist24:55

       Yeah.

   12. CVClaire Vo24:55

       Two, you'd have to type into, you know, you'd have to run local host and type into, um, your, your, your w- your web browser. And so I actually like the constrained UI space for speed of, of prototyping on some of these ideas, because you just don't get distracted by anything but the essential kind of toolkit. Um, and then you can get a really cool thing out the other end.

   13. JLJohn Lindquist25:18

       My only problem is I've built more tools than I can remember, and sometimes-

   14. CVClaire Vo25:22

       Right

   15. JLJohn Lindquist25:23

       ... I have to think, "Where was that thing?" Um-

   16. CVClaire Vo25:25

       Yeah. I, uh, I also like what you- how you started this, this little segment, which is you said you just build every idea you have. I think that-

   17. JLJohn Lindquist25:34

       Yeah

   18. CVClaire Vo25:34

       ... is totally the move. While you have an idea, kick off something, get it built, build yourself a little throwaway repo. Um, you know, eventually, the AI can crawl it and remind you everything that you built before, but this is pretty cool.

   19. JLJohn Lindquist25:49

       And that's, that's why I love dictation, because all you have to do is start up a new terminal in a new folder and just kind of brain dump in there, and then it'll try something.

   20. CVClaire Vo26:01

       Yeah.

   21. JLJohn Lindquist26:01

       And once you have something, even if it's wrong, you can iterate on it.

   22. CVClaire Vo26:05

       Yep.

   23. JLJohn Lindquist26:05

       If you have nothing, you can't iterate on nothing.

   24. CVClaire Vo26:07

       Yeah.

   25. JLJohn Lindquist26:07

       And I think that's the magic of, uh, even for people who, who hate AI tools, like, a sheet of paper full of things that are wrong is much better than a blank- than, than nothing. Because even if it's wrong, you, you recognise it's wrong, and it helps you think of what's right and what, what you wanna build. Um-

   26. CVClaire Vo26:28

       Yeah, I say this a lot: It's easier to edit than author.

   27. JLJohn Lindquist26:31

       Oh, yeah.

   28. CVClaire Vo26:31

       So let's get the authoring out of the way, and then even if you completely revise the whole thing, it's a much easier starting, sprouting point

9. 26:39 – 35:16

   Demo: Setting up stop hooks for automated code quality checks

   1. CVClaire Vo26:39

      to work with something.

   2. JLJohn Lindquist26:40

      Yep.

   3. CVClaire Vo26:40

      Okay, so I think we're gonna close out and spend, uh, a little bit of time on your w- workflow for when you're doing more complex coding projects or features, how you keep those really high quality using some advanced techniques in, um, I think in Claude Code and Cursor.

   4. JLJohn Lindquist26:58

      So when working on a... Excuse me. When working on a project, um, often when the AI is generating code, it'll often build out mistakes, and so even- it will say it's done, but you're like, "Wait a second, there were a ton of mistakes there. Why'd you stop? Just fix it until the mistakes are done." So, for example, um, let's say it wrote out this code, and there was this error in here, and this error is something you'd usually catch with tools such as TypeScript, uh, or maybe it's formatting or linting or any sort of complexity tools, um, that there are code quality tools that you run before, before you think the work is done. So you would run something like bun typecheck, and you would see that it has this error, but your, uh, Claude Code and the other agents don't know that this error exists. What Claude has and what Cursor, Cursor and a few others have, is the concept of hooks. And what this can do is, so inside of Claude... Let's go here. You can set up what are called hooks, and, um, I'm gonna set what's called a stop hook and hit Add New Hook, and just it shows you a bunch of examples. I'm accepting responsibility for all this, a bunch of warnings, because it can run scripts that aren't checked by the AI. And I'm gonna say the command for now is just we echo, which does nothing, and I'm gonna add it to my project local settings. And now we have this echo hook, and this is defined in this settings local, uh, dot JSON file, and this is for, uh- this is a local file for me. If you want it to be with your team, it would be settings.json, settings.local.json, it's just for you. What we're gonna do is, instead of running this command, we're gonna run a custom, uh, Claude, Claude hook, which I've defined inside of Claude hooks, uh, and I called it index.index.ts. You could call it stop or whatever. So from this script, which is in this directory, um, I need to run this, uh, install for this package because I don't have it installed right now. So I'm gonna bun install anthropic, and this is their, um, their Claude Agent SDK. Now, in the SDK, they have, um, what are called hook inputs and other types you can use, so that when you're dealing with hooks, you have a lot more information. So, like, on this input, you have all of this information around what the input name is and then what the session ID is, and the current working directory, permission mode, and all that, and you can use that to customise your hook. But we're gonna- but what we are gonna focus on is, we're gonna see, step one, were there files changed, uh, be- when we stopped? And a stop is once, uh, Claude has kind of finished its conversation, and it's now waiting for you to do something. So we're gonna check, are there files changed? And we're going to... If there's files changed, we're going to say, "Okay, then let's go ahead and run that bun type check."... and if there is a type check, then we can say back to Claude, we can say: "Hey, there were TypeScript errors. This is the report," and then send them back the output that we showed in the terminal before, and it'll continue. Otherwise, if there were files changed, then we can tell Claude to please... There's a prompt way down here that says, "Please commit," essentially, uh, "Look at the files, don't commit anything, anything sensitive, then go ahead and commit it." So we set up this workflow of once a conversation is finished, check to see if any files have changed. If they have, you check to see if there's any TypeScript errors, which could be a type check or build errors or any sort of other, um, code quality, uh, guards you have in place, and if there are none, then go ahead and commit. And this saves you a lot of the overhead in your mind of, uh, "Here's all this extra stuff I have to do once something's done."

   5. CVClaire Vo31:22

      Yeah.

   6. JLJohn Lindquist31:22

      Uh-

   7. CVClaire Vo31:22

      And what I wanna call out for folks that are maybe listening and not seeing this code here is it's really... What's nice about this is it's a combination of commands that you would run in the terminal to, to just generate errors and see them yourselves, but then you can feed those back into Claude Code in a more natural language way and give natural language instructions on what to fix, or again, default to some command, um, that's different, which is this GitHub commit command. And so I like this combination of kind of like structured commands in, in the terminal, combined with natural language calls back into Clau- Claude to then kind of put the bow on the end of any work that this AI system does. Is that kind of how you think about it?

   8. JLJohn Lindquist32:11

      Yeah, exactly. Um, the, the gotchas you have to think about here are when you're, uh, when you're communicating from a hook back to Claude, you're essentially using console.log, which is one of the first things any JavaScript developer learns, and you're sending back a JSON object. So it's gonna find that first console.log, and whatever it gets back, uh, that's what it's going to see as its, uh, as its input, its standard input. So you have to be careful if you're running commands like this. You, you tell this one, "Please be quiet," because if it's not quiet, then it would log back to the console and maybe interfere with something. Or if you want other logs, or you're debugging the script, just use console error or an- any other way of showing logs. Um, otherwise, console.log tu- it turns into this feeding instructions back to the agent. So it, it's one of those gotchas that everyone falls into when, when building this out. Uh, and just to, just to demo it real quick, um, I'll just turn on Claude, and I'll say, um... Well, actually, for this to work correctly, let's make sure we have everything staged and set up so that when it does the Git check, um... Let's just generate a message. So yeah, let's, uh, please create a foo.ts file on the root of the project. And we'll go ahead and accept this, and you'll see that it says, "Stop hook returned a blocking error," and that error it returned is, "Please fix the TypeScript errors," and here's our prompt right here with this block. And it says, "I've... I'll fix the TypeScript error." So this is when it would have stopped. It would have stopped right here, but we hit the stop hook. Now it sees these errors, so it's gonna go ahead and read that. It says, "Oh, I found the mismatched quote. I fixed it," and now behind the scenes, there's a Claude running, which should it commit that fix. Maybe make this a bit smaller, show our graph here, and you'll see, um, this is the fix that it made, was correct the quote syntax. This is what the little haiku did in the background. So the stop hook ran twice. It ran once where it found the error and had files changed, and then the second time, there were no more errors, and so it ran the commit. And so that saved us all of that work of both passes, and now we have a completed task that has been error-checked, fixed, and then commit, um, and conditionally encrypted in a way where this will be different for every single project based on your requirements, based on your code base. Um, so this is definitely something that you have to, like, think through and set up yourself. It definitely saves so much time where you don't have to go back in and say, "Well, please fix this" or "Please run this command," or, "Please do this," when you know part of your workflow is always the- like, if these things should always run, you might as well run them automatically.

10. 35:16 – 36:40

    Investing in quality outputs

    1. CVClaire Vo35:16

       And something I have to say is I get so much pushback from software engineers saying, "These tools don't really make me faster. The quality isn't as good." And I think if you make the investment, as you've shown us, in, "Okay, well, what things would it do to make the quality better, or what things would it do that you can automate that would make you a little bit faster?" And you put that effort in to understanding all the things that these, um, tools can do for you, either programmatically or through prompting, I think you can actually see a lot of those efficiencies. And then I wanna call out something that, that you said, which is you have this local settings, but you can create settings that are shared across your team for anybody that's working in the repo, and that's for our engineering leaders out there or larger engineering teams to really think about. If you haven't created these hooks for key repos or key projects where everybody is benefiting from this when they're using something like Claude Code, then you're missing out on some of the scaled leverage, I think, of, of these tools. And so I'd love to put somebody in charge in an engineering organization of figuring how stuff like this can work inside your code base and then scaling it out, either through training or through configuration.... and to all the other engineers, so that everybody's getting this baseline quality and this baseline efficiency?

    2. JLJohn Lindquist36:38

       Yeah.

11. 36:40 – 39:19

    Additional use cases for hooks beyond code quality

    1. JLJohn Lindquist36:40

       Yeah.

    2. CVClaire Vo36:40

       Amazing! Well, okay, other than, you know, type, TypeScript errors, just prattle off a couple other use cases. You deleted a bunch of stuff from this hook, so what are the things you think that people should bake into a stop hook like this for Claude Code?

    3. JLJohn Lindquist36:55

       Uh, definitely formatting. Um, I- there's, there's kind of the, the mindset we've always had before of, like, pre-commit hooks or pre-push hooks, things that operate on the CI. And these are a lot of the things that can be, um, fixed before those are even run. So whether it's... There's a lot of tools around, um, with linting, it, it could constrain the length of files. Um, there's things like, uh, circular dependencies, where it could check the imports to make sure that files don't reference each other. Um, there's code complexity, there's tools that say, "Does this code look like any other code in the codebase, where, um, this could be extracted into a function or something?" Because there's, like, duplicate code throughout the codebase. And there's all sorts of analytics and tools you could run. Um, uh, some of them probably not as often as others, because it, it's more expensive, and you just have to make those, um, decisions based on, you know, the size of your team, the size of your application. But, um, there's... Just, just put into an AI prompt of ChatGPT or any of them, just say: "What are all..." Make a long list of, uh, developer tools people run on pre-push or, uh, on pre-commit, and you'll see the, a huge list of them that you could, uh, pick and choose from, so.

    4. CVClaire Vo38:15

       Well, and I'm gonna take a tiny detour for, um, our very patient non-technical audience members that have maybe listened to this, which is these, um, post-tool call hooks or post-stop hooks in Claude can also be used when you're working on non-code. So we have so many people using Claude Code to write documents, to do all sorts of things, and so you could just think about, "What do I want automated after this tool is called?" Or, "What do I want automated after Claude finishes writing my, my document?" And you could think about ways to use something like this, not even for code quality review, just for a post kind of task completion-

    5. JLJohn Lindquist38:56

       Right

    6. CVClaire Vo38:56

       ... check. So I think just the general framework's really useful. It's obviously highly applicable to software development, but I think people can think of other creative use cases for this as well.

    7. JLJohn Lindquist39:05

       Yeah, absolutely. The, the diagramming stuff, create an image of what we just did and send it to my mom to show her I'm working hard. [chuckles] Like, anything you want, right? It's, it's... The sky's the limit, so.

12. 39:19 – 41:14

    Quick review

    1. CVClaire Vo39:19

       Okay, so just to wrap up, these have been super useful use cases. I wanna call them out. One is using, um, documentation and diagramming, specifically Mermaid diagrams, to preload as a system prompt in your Claude Code instance, so that you don't have to waste the time of doing context discovery, and you can really make sure that the context is preloaded. It's a little more expensive on the token side, but a lot faster, and these diagrams are much more, um, easily read by machines than by humans, so it's a good format to get things in. We looked at aliasing some of your favorite Claude Code instances and settings, so that you can pop into your live dangerously mode, you can pop into your you have all my diagrams mode. Um, you can just pop into those with one, you know, one, one or two letters, which I like. Uh, we got a little side preview that we didn't call out, but just how casually you use voice and transcription to enter in and out of these tools. What I like about the way you use AI is you're just, like, highly efficient. You're like, "The minimum number of things I can type, the better," and you're pretty fluent in switching between voice and typing. So we saw, we saw a little of that. Uh, you encouraged us to create, in particular, little command line tools to build one-off ideas or tools. Yours was a website design generator using NanoBanana. And then you showed us how to use, um, Claude hooks, and in particular, a stop hook, to do some quality and other checks on code written by these AI tools, and automate some of the processes, um, that you might do as a software engineer that you want our little AI software engineers to do instead. Just that in-

    2. JLJohn Lindquist41:10

       Just that

    3. CVClaire Vo41:10

       ... I'm looking, 40 minutes. We did it pretty fast.

    4. JLJohn Lindquist41:13

       Nice.

13. 41:14 – 45:35

    Terminal UI vs. IDE

    1. CVClaire Vo41:14

       This is great. Okay, well, I'm gonna ask you a couple lightning round questions, and then we will get you back to your very efficient AI coding. My first question... Again, you're like me. We love Cursor, we love Claude, we love VS Code. We have all of them open. You know, I think everybody's... I think there's interface wars happening right now. Are, are people gonna love these terminal UIs and command line tools like Claude Code? Do people want the, the IDE? I, I noticed that you're on Cursor 2.0, so you have the agents view, which is very simple and abstracts away some of the code, and you're in the editor view. I'm gonna give you two, two wars. I wanted your quick opinion right now, we won't hold you to it, of what you think wins, for, I would say, real software engineers, you know, writing real code out there. Um, the, the friends that I talk to. You know, Terminal UI, IDE, or both? And then do you, do you, do you have any hypotheses on, I think particular in the, the VS Fork world, VS Code Fork world, are there any moats or, you know, what do you think... How do you think people can compete in the IDE world?

    2. JLJohn Lindquist42:26

       Yeah, so I think you need both. I think you need an IDE, and there are so many use cases for the CLIs. Uh, the reason being that the CLIs have-... A lot of configuration and a lot of settings where, um, as you saw with aliases, I could launch a version of Claude that loaded up a specific set of MCPs or a specific set of prompts and preload a bunch of things, and do that in a single terminal command and be very, um, quick and fast with that, and then set it off in the background and just have it running. Um, currently, inside of, uh, inside of a Cursor, inside of any of these, um, IDEs, there's usually a lot of: okay, open the UI, navigate to this, and then navigate that, then switch over to this, and then switch over to that. Um, and they try and streamline as much as possible with slash commands and whatnot, um, but it's just not quite the same. But if you have an IDE, and you're reading through the files, and you're selecting lines, and you wanna modify certain bits, like focused work, um, there's so many use cases for IDEs where, um... There, there's a recent Claude tool where it has a IDE integration, where I can check the diagnostics from the IDE, and you'll see that with VS Code as well. Like, the extensions you put into an IDE can be fed back into the agent. So there's a whole robust extensions ecosystem from IDEs because people build on top of these things their own workflows, and I don't think we've quite reached-- like we build our own CLIs from AI. I don't see a lot of people building their own Cursor extensions or VS Code extensions, which is very possible, and you could feed those errors and warnings and company rules and everything, um, in very complex ways back into the agents. Um, so that, that will happen as well, and I think for one IDE to stand out above the other, they have to separate themselves, like Cursor is doing with their agent mode. Um, they have to make something unique and user-friendly that once... Like, people are not gonna give you a bunch of time to convince them. Uh, you're gonna have to open the agent, and you're gonna have to, like, see that, click on browser mode, and it's gonna have to launch your dev server, and you're gonna have to click on the element and say, "I want this to look, uh, uh, with more pink or purple," or whatever, and then, um, and then they want that to just work. Um, we'll see any sort of friction or frustration from any AI tool anybody puts out there, um, is, is just instant, uh, dismissal from so many people. Like, there's just-- the bar for quality is so high in the AI landscape because everyone can build anything, that you have to focus on the UX, and you have to make that experience better than everyone else. And that's where you, you can see, you know, Cursor making the bold moves of like: "Okay, let's go full-on agents." Like, you have to make those leaps.

14. 45:35 – 51:57

    Selling AI to skeptical teams

    1. CVClaire Vo45:35

       Yeah, I, I agree. And, you know, just talking about this skepticism and high bar, what I love about this episode that we recorded today is it's really most relevant for software engineers with more experience who are shipping high-quality code and who want to write production-level code more efficiently using some of these tools. It's-- this is not, you know... I hope you all hung out and listened to it, but it's not for our vibe coders and our non-technical folks. Um, and so what would you tell kind of senior principal software engineers, engineering leaders? I get asked this a lot about, how do I sell the value proposition of these tools into very skeptical organizations, and what are, as a more advanced software engineer, the things that have just changed your life in the last year, so you should never go back to doing it this way? Kinda how do you, how do you make that pitch?

    2. JLJohn Lindquist46:31

       The, the, the first thing that jumps to mind is any time an issue is opened, like, you can set up streamlined workflows that someone opens an issue, and you can have Claude automatically tackle it. You can set up triggers for Linear, GitHub, whatever, that once something happens, you can get that first pass to see, okay, can we at least find this without doing any work? Can we at least get that initial, uh, review in there of what's going on so that once we jump into the task... I mean, for my entire career, someone throws an issue at you, you spend the first, you know, probably day or two orienting yourself to like, okay, I didn't write this code. This is legacy from someone. Let's-- do you get blame? Let's do all this stuff. Like, all of that busy drudgery that you're going through to even get started on the issue, um, it can wipe out so much of that. It can find who touched the files, who did this. Like, if, if you have the diagram set up, well, what are the risks, the impacts? Are there potential security things? Are there... Like, it, it's so great at surfacing, um, the you don't know what you don't know sort of scenarios, where you hire so many contractors, you hire so many people who, uh, are new to these things, and then you throw them into these tasks, and they just don't know, like, they haven't spent time with the code base, and then, um, you ask them to fix these things, and they just have zero idea what sort of impact their changes are gonna have. The AIs can surface a lot of that, and they can just be like: "Okay, we need to be super careful. This is, you know, in production, and, um, this is cost, gonna cost us money if this goes wrong. Just tell me everything I need to look at. Like, find every single debug path, find every single, um, uh, e- every-- why has this file changed over the course of history? Like, write a summary of everybody who's touched this file, so I can know why this function is the way it is." Like, there's just so much work that is just not writing code. Um, and all the exploration work is just so much easier to just say-... like, everything I just said over the past, you know, 30 seconds is a prompt, which I could've just dictated, right? Um, and you just have to walk up to your computer and say, "I have this issue. Like, guide me through all this stuff." And, um, it's just, it blows my mind that people would be hesitant for those sorts of tools. I, I understand if they're like, "Okay, maybe some of the code isn't perfect." We still have to do code reviews. We still have to, like, check for quality. We still have to run our tools to validate things. But if you're not using it to do- to, like, inspect and investigate and write orientation and all that stuff, then, like, you're really missing out, like-

    3. CVClaire Vo49:27

       Yeah

    4. JLJohn Lindquist49:27

       ... in, in the enterprise space.

    5. CVClaire Vo49:29

       Yeah, and on the other end, if you're not using it to document, so the next time somebody has to do that investigation, you have a little bit of an easier time, um, you're als- also missing out. So I do think on that, that front and the back end, and what I often tell people is, a good way to think about how to design your AI workflows is do not think in a task-level orientation, like, "I'm gonna write code." I say think about if I gave you infinite junior-to-mid-career talent, who is always available, who would do the work you would do if you had unlimited amount of time and no meetings, what would you do when a ticket came in? Like, what would you do? And you'd say, "Well, I'd go trace who wrote the code. I would go figure out the history. I would make myself a really good tech spec. I would call out the risks. I would publish this in a way that my team could review it. I would have a senior engineer look at it and give me some really hard feedback." All of that could just become a prompt. And then, you know, but so many people are just constrained by their time and, and cognitive capacity, and so they just go, "Well, I'm gonna read the issue and bounce around in the code a little bit, and then I guess I'm gonna start coding." And so, um, you can kind of get to this model of optimal, not perfect, but, like, optimal workflow, and then figure out how you can prompt or build workflows or hooks that would replicate that at least in an 80% way, um, which is a lot better than not doing it.

    6. JLJohn Lindquist51:03

       And, and, uh, something as simple as the commit messages are so much better than they used to be-

    7. CVClaire Vo51:07

       Yeah

    8. JLJohn Lindquist51:07

       ... because developers don't have to write them. I-

    9. CVClaire Vo51:10

       So much better.

    10. JLJohn Lindquist51:11

        Uh, for, for people who are new to programming, um, commit messages used to be, like, second attempt-

    11. CVClaire Vo51:18

        Yeah

    12. JLJohn Lindquist51:18

        ... or, like, please work or swear words. Like-

    13. CVClaire Vo51:21

        Uh, my, my favorite one is just, like, 17 F's, like, uh-

    14. JLJohn Lindquist51:24

        [chuckles]

    15. CVClaire Vo51:24

        ... or, like, trying this, trying that-

    16. JLJohn Lindquist51:27

        Yeah

    17. CVClaire Vo51:27

        ... trying this other thing.

    18. JLJohn Lindquist51:29

        Yeah. Not, not please work, P-L-Z.

    19. CVClaire Vo51:32

        Yes.

    20. JLJohn Lindquist51:32

        It's too good.

    21. CVClaire Vo51:33

        Of course.

    22. JLJohn Lindquist51:33

        Yeah.

    23. CVClaire Vo51:34

        You know, if anybody wants to vibe code a product, I always thought that startups would want a printed book of all their first year's commit messages-

    24. JLJohn Lindquist51:43

        Oh, yeah

    25. CVClaire Vo51:43

        ... with, like, calling out the really funny ones. [chuckles] So if somebody wants to vibe code a little, a GitHub API-powered print, uh, business, I'm sure you could get a couple startups to print those out. Okay, last question.

15. 51:57 – 56:37

    Prompting reset tricks

    1. JLJohn Lindquist51:57

       Yeah.

    2. CVClaire Vo51:57

       This is probably challenging for you because you do a lot of dictation, so you're probably actually pretty polite to AI, given you would have to say-

    3. JLJohn Lindquist52:05

       Mm-hmm

    4. CVClaire Vo52:05

       ... frustrating things to it if you wanted to be mean. But when our, our little friend Claude is going off the rails, or you're really not getting what you want, what is your prompting reset, start over technique? Have you found any, any tricks that work particularly well?

    5. JLJohn Lindquist52:23

       Yeah, it's, it's really the, um, take the conversation, export it. A lot of them have the export commands.

    6. CVClaire Vo52:31

       Mm-hmm.

    7. JLJohn Lindquist52:31

       Um, drop the conversation with some of the code files into the, um, into ChatGPT Pro Five or whatever it's called, or Gemini, uh, Deep Think, I believe is the... And have it, have them do a second set of eyes on it, and then kind of start over, rather than... Like, if, if things go off the rails, and you can't fix it in about maybe one prompt of, like, where you see what's going wrong, then just revert to the previous commit and kind of start over. Um, because there, there, there's always this underlying, the AI is trying to go somewhere, and you want it to go over here, and you keep on telling it to, to join on your path, but it still wants to, like, get somewhere else that you don't quite understand. And so starting over from, uh, ground zero and, like, revising your original prompt is better than, like, trying to steer it to where you are when you've, like, drifted so far away. Um, and that has to do... It's so different with every model. It's so different with every prompt and all the context and project, that it's... Like, I can't give you, like, the, "here's instructions that work every time," but, like, starting over works every time. Tossing a second set of eyes on the entire conversation, where that AI isn't, uh, isn't invested in that conversation, it's instead critiquing the conversation. Um, tho- those are my, my two.

    8. CVClaire Vo54:02

       I think that second, um, that second workflow is so funny because I- [chuckles]

    9. JLJohn Lindquist54:07

       Mm-hmm

    10. CVClaire Vo54:07

        ... I think as somebody who's been a manager and a leader so many times, sometimes I feel like I'm the reasoning model being brought in to mediate the, the misunderstanding between two smart but misaligned, [chuckles] misaligned resources. And so it's really funny to hear the idea, okay, like, I'm having a debate with my AI. Let's bring in, like, the third party. Let's mediate this conversation, have an objective set of eyes to see where we maybe are misunderstanding each other or going wrong, and then reset and start, start over. So again, I think, you know, this is the moment for folks with a lot of organizational and social skill thinking, um, to apply this to how you might design some of these flows, um, for, for AI, even though they are, um, beep-boop machines that we're really using.

    11. JLJohn Lindquist54:55

        Yeah, and, and I would say, kind of last thought on that, is the recent planning modes that have been released with Claude Code-

    12. CVClaire Vo55:02

        Yeah

    13. JLJohn Lindquist55:02

        ... and Cursor and all of them, have eliminated a vast majority of that-

    14. CVClaire Vo55:05

        Yeah

    15. JLJohn Lindquist55:06

        ... of that drift.

    16. CVClaire Vo55:07

        Yep.

    17. JLJohn Lindquist55:07

        Um, so they, they've been fantastic releases, which I strongly recommend for anything beyond, like, a small file change. Planning is awesome.

    18. CVClaire Vo55:15

        Yeah, I love, I love those features, too. Okay, well, John, this has been great. Where can we find you, and how can we be helpful?

    19. JLJohn Lindquist55:22

        Yeah, I'm on egghead.io. Um, that is, I have tons of courses on AI tooling. I teach workshops through egghead.io. I send a newsletter out every week called AI Dev Essentials. Um, you can find me on X and other platforms as well under my name, and that's it. I love to talk with anyone about all this stuff. Um, my workshops are fun, and we talk, go way deeper into this super advanced stuff. So yeah.

    20. CVClaire Vo55:51

        Great, and then maybe some of us can shop your possibly to-be-created Christmas and holiday decorations site.

    21. JLJohn Lindquist55:58

        Oh, yeah.

    22. CVClaire Vo55:58

        So you let us know.

    23. JLJohn Lindquist55:59

        We're working on that.

    24. CVClaire Vo56:01

        You let us know if that goes live, and we'll drop it into the show notes. Thank you so much for joining us and sharing your workflows.

    25. JLJohn Lindquist56:07

        Of course. Thanks, Claire. [upbeat music]

    26. CVClaire Vo56:10

        Thanks so much for watching. If you enjoyed the show, please like and subscribe here on YouTube, or even better, leave us a comment with your thoughts. You can also find this podcast on Apple Podcasts, Spotify, or your favorite podcast app. Please consider leaving us a rating and review, which will help others find the show. You can see all our episodes and learn more about the show at howiaipod.com. See you next time! [upbeat music]

Episode duration: 56:37