923: Getting the Most Out of AI Coding  ## Metadata - Author: [[Syntax - Tasty Web Development Treats]] - Full Title: 923: Getting the Most Out of AI Coding - Category: #podcasts - URL: https://share.snipd.com/episode/60fdf956-6c01-498b-b0b7-02c426c0c5ca ## Document Notes ## Highlights - **Pre-Scaffold Your Project** - Scaffold out your project manually before using AI coding tools for better control and speed. - Let AI handle tasks after your initial setup to avoid repetitive corrections and save time. Transcript: Wes Bos Yeah. So I think a lot of people think like these AI apps, you're just going to like one shot, type in what you want. It's going to poop out an app the other end. It's going to be absolutely perfect. Scott Tolinski Make an app, no bugs, thanks. Wes Bos Yeah, part of me has been like, recently I've been like starting apps, being like build an app that does X, Y, and Z. And I found myself having to create like a starter prompt being like, don't use Axios, don't use Express, don't use tailwind three use tailwind four instead don't use tailwind don't Use tailwind at all there's all these like things that i've had to say and then i find myself using the like the next 20 minutes being like don't use stop using this and this set of this and Like i forgot that and quite honestly it's not worth your time to try to scaffold out the application with all of the choices that you want with ai so what you should do is scaffold it out Yourself at least install all the dependencies that you want you know go ahead because almost always what it does for me is it just does like a v init typescript template and then it goes In and npm installs everything that it wants and then it changes everything that it wants i'm like i could have done this in just like in like six minutes instead of just sitting here waiting For it to to do all of its work so my tip there is scaffold out that very first 5%, 2% yourself, and then you have a really good ([Time 0:03:14](https://share.snipd.com/snip/1f4a66f5-aabf-4342-987c-1149084fb3ae)) - **Be Explicit in AI Prompts** - Be exceptionally clear and explicit in your AI prompts, specifying exact versions and preferences. - Clear instructions prevent AI from making unwanted assumptions and improve output quality. Transcript: Scott Tolinski Another one is to be clear with your prompts. Because we might think sometimes that the thing, the words that we're saying or whatever can be received well by the LLMs and understood. But if you are very clear, like, do not use blank, use blank, as opposed to use blank, not blank. It sounds like a subtle difference, but I do think that like being very clear with these prompts is the way to go. For me, it's always a battle with Svelte. Use Svelte 5 syntax always. Like that is like one of the big ones for me that I always have to tell it or have inside of my rules or any of these things like ([Time 0:05:39](https://share.snipd.com/snip/4c37b4e9-17b6-494e-9e41-1b8aee9f70bb)) - **Use XML Tags for Clarity** - Use made-up XML-style tags around sets of instructions or preferences to give AI clear contextual boundaries. - This technique improves AI understanding of where a data segment starts and ends. Transcript: Scott Tolinski Yes. More better. Clear is more better. Wes Bos One tip I've gotten from a lot of like cursor rules or LLMs.txt, things like this, is that using XML tags around your specific items is a very good way to tell the AI where you are starting And stopping. And And what I mean by XML tags is you're just making up tags. So you might say like coding-style, open tag, and then write all of your preferences in there, and then close it. And that's a really neat way to specify to the LLM that this is a contained piece of data. Or example Open it up and then close it up. And any time that you want to clearly delineate a start and stop of something, is just wrap it in a made-up tag, and that will really go further to give context ([Time 0:07:43](https://share.snipd.com/snip/cc6b09ee-0ceb-47e9-a53a-0fed515775ad)) - **Utilize Rules Files** - Utilize editor features like Cursor or Copilot rules files to persist coding styles and preferences. - These files prevent repeating style instructions in every AI session, streamlining your workflow. Transcript: Scott Tolinski Thing. And in that same regard, let's keep going on this utilize these files. A lot of these editors, you know, the IDs that have these things, whether that is copilot, copilot rules, or cursor rules, use these features, because nowadays, they're getting better And better where you can even have folders of different rules and organized rules and multiple files or using Markdown for these things for better organization. Utilize the rules files because they will help you not have to continually stress rules inside of your chats, of your AI sessions here. We're like, if I have to continually say, please use this syntax, please do this, please do that, you may still have to at some point continue to reference rules and code styles and things That you want. But the editors have these features for a reason. So use these files to specify how you want your application to be, where you want things, what coding style, what versions. ([Time 0:08:47](https://share.snipd.com/snip/bbe6df7f-e50b-456e-93da-4acc814869f8)) - **Custom Modernization Prompt Example** - Wes created a custom modernization prompt to keep AI coding up-to-date with technologies like ES modules and TypeScript. - This helped avoid AI using outdated tech like CommonJS or unnecessary packages. Transcript: Wes Bos I've been working on one for myself, which is like a standard modernization prompt. Because one of my biggest frustrations is when it tries to use old tech. I was talking about that just earlier, right? So I've been working on this one myself, which is just like, here, here, this is just like my, my, my little prompt, create a full stack Airbnb clone, blah, blah, blah, blah. And as I was working on this, I was realizing, yeah, it doesn't make sense to tell it to scaffold it out yourself. It's probably faster to just scaffold it out yourself. Unless specified, generate code with these rules. Use TypeScript, not JavaScript. Add appropriate TypeScript types. Use ES modules exclusively, never common JS. You may need to set type module and package JSON. So that's another one is it just tries to use to require syntax all the time. If you're using TypeScript, it tries to go to use TSNode or TSX, which you don't need those things all the time. You can use the strip types flag in Node.js now and just use TypeScript in Node.js. Same with env file. It always tries to install.env package and then you have to use it. You don't need that anymore. Node.js has these things built in, right? So I just have been collecting these things. Scott Tolinski That's a great way to do it. And you can bring it from project to project, right? Wes Bos What my next move here is, is once I'm like happy with this, I'm going to publish this as an MCP server. Because the MCP server has, of course, it has tools. But another part of the MCP server is prompts. So you can just use the prompts in there. You can say, hey, use my modern JavaScript prompt. And then it will just go and grab the modern JavaScript prompt, inject that into the thing. And then I can install that MCP server globally or in whichever ([Time 0:10:01](https://share.snipd.com/snip/68aa5d63-4034-4454-8b35-713c96380dd4)) - **Create Rules From Codebase** - Ask AI to generate coding rules by analyzing your existing codebase. - This automates creating rules that ensure new code aligns with your project's style. Transcript: Wes Bos For each other or not. I'd love to hear anyone who's listening what their thoughts are on that. Scott Tolinski Yeah, totally. Word. Yeah. Another one is you can ask AI itself to create rules based on your existing code base. If you have code and you want the new code to adhere to the code base, yeah, these things can be aware of your code base. But it works better if you have rules, right? So being able to have a rules file that is generated that you don't have to type is also a good option. Wes Bos Yeah, it's always hilarious that like the things that these LLMs need, they can also just generate themselves. So you're going to say, hey, this is a code base that I like. Or if you're starting a new code base and you really like the way that another code base has worked, you can ask it, hey, create a summary of the standards and coding styles and technologies Used in this project and export it to a file. And then you can just take that file and throw it in somewhere else. Scott Tolinski Yeah, it's also along the lines of the previous ([Time 0:13:13](https://share.snipd.com/snip/4fe2092b-6130-49f1-8d60-ff3e37972371)) - **Break Project Into Clear Tasks** - Break down tasks into clear, concise, actionable items for AI to work on sequentially. - Smaller tasks improve code quality and simplify review and debugging. Transcript: Wes Bos In markdown yeah this next one is probably the most important tip for getting good quality code out of an LLM and that is breaking your project down into very clear, concise tasks. When you ask an LLM to do too much, it will do too much and it will get muddy. So if you can break down what you want into clear, concise, actionable items, give it a nice clear task list, the ability to figure out if it did it right, then it is able to attack each of Those one at a time and do a much better job. And also just from like your point of view as well, is if you're, hey, build an entire app that does Uber, but also has dog walking built in and just go. You know, like it's just going to create a mash of garbage. But if you're very clear with what it needs to do, especially if you're working on an existing project, create a component that does X, Y and Z, and then go ahead and scaffold out the database And then go ahead and make an API that it can talk to. And it will do those things separately and you get much better quality code out of there. And you, the developer, has a much easier time reviewing what needs to be accepted and modified. Scott Tolinski Yes, for sure. And just to give people some even ([Time 0:16:01](https://share.snipd.com/snip/a1e7909c-0f59-47c6-84a9-897d1a4624d4)) - **Use Markdown Task Lists** - Store task lists or PRD documents in markdown files with checkboxes. - AI can check off completed tasks and log progress automatically. Transcript: Scott Tolinski PRD documents? Like, where do you store that? Wes Bos I will either pop it into a markdown file that is in the root. And it's kind of cool because you can put checkboxes beside each of the tasks and you can have the AI just mark it as checked. And it can also just inject any logging that it needs to do, you know, like how things work, how it approached it. So I'll either do that, like I'll put it in like a spec.md and it will go through that and check things off as it's done. Or you can just dump the entire document into the prompt. That works well to a certain point. But if ([Time 0:17:30](https://share.snipd.com/snip/a8b307ba-7d3b-4455-9d83-ae89db1a75e7)) - **Use llms.txt Documentation** - Use llms.txt files from libraries as text documentation for AI to reference. - These files help AI code aligned with the latest official library docs without manual searching. Transcript: Scott Tolinski Out. I'm definitely more of a hands-on type of person. Yes. I get that. Yeah. Utilize llms.txt files where possible. This is something that it's a trend that you're seeing now. You know, I don't know who started this first Svelte was the first library I saw do this when they released their new version. But many of these libraries now inside of their documentations, they do have llms.txt, which is just a text version of their documentation for llms to consume, you can add them as docs Inside of cursor, or you can just use them to reference at any time when you need to reference them inside of your LLMs in general. These are good things to know that they exist, especially if you're working with more modern documentation and things like that. But you also, ([Time 0:18:33](https://share.snipd.com/snip/8fda11dd-de05-4247-a383-95962c10bd43)) - **Leverage MCP For Docs** - Use MCP servers like Context 7 to enable AI to fetch and reference live documentation automatically. - This removes manual lookup and keeps AI answers current and accurate. Transcript: Scott Tolinski Is slightly different here. Wes Bos Yeah, the Context 7, we've talked about this on a couple of shows already, but Context 7 is an MCP server. And what that will do is you hook it up to your IDE or you hook it up to whatever accepts MCP, a chat app or an IDE or literally anything. And it provides it with tools to search for and download documentation for the different libraries so i can do a really simple one where i just say uh what do the docs on tail when four say About margin and then it will go off and and search for it by the library name and then it gets some results and then it will pick the one that has the highest confidence and then it'll go Off and download the documentation for that and then it'll inject into the prompt and then it will run your query right so a couple back and forth and that's great because then you don't Have to go find the svelte llms.txt simply just say reference the docs for svelte 5 and and do, Y, and Z, and it will go off, download it, inject that into your prompt. Word. ([Time 0:19:22](https://share.snipd.com/snip/6dabf68d-b1ef-4c2f-9e75-c87c0690794f)) - **Tag Files and Functions** - Tag specific files or functions you want AI to work on to direct it precisely. - Clear labels prevent AI from modifying unrelated code accidentally. Transcript: Scott Tolinski Tag the files or functions, et cetera, that you want to be working on. Because if you're in a chat window and you start saying, hey, do this and do that, it can go off and choose where it wants to do this or that. But the chat windows have an ability to say at function, at file, and you just start typing the function name or the file name. And then that can give it more direction in terms of like where exactly, or like, I don't know if you've ever had this before where you ask it to do something and it like starts creating A new function for you when you already had one that's like doing, you just want it to modify. So, you know, giving it that picture, like, again, you're talking to a junior developer or something, you're talking to an assistant coder. Hey, give me this function that does this. Instead of like that, you could say, hey, reference this function, use this function, modify this function, whatever, and give it clearer instructions. Wes Bos I have to use that a lot when I have like a folder that just has like six or seven different random scripts for something I'm working on. And it will just try to go and modify all of those scripts because it thinks that they work together. So you have to tell it, hey, use this example. Yes. Next one we have here is feed ([Time 0:20:29](https://share.snipd.com/snip/bfcd6df8-7e81-406d-89c0-a031fc5a9955)) - **Feed Logs Back To AI** - Feed error logs back into AI when troubleshooting code issues. - Logs help AI understand problems better and suggest accurate fixes. Transcript: Wes Bos Back into the AI. This is pretty simple, but if you don't have your IDE hooked up to your terminal and or your browser so that the IDE can see the actual logs that are coming in and out, then it's a great idea When you have troubles, simply just copy paste what went wrong and dump that in there. So being able to feed all of the logs and also going through debugging if you hit a problem where you go back and forth six or seven times like it's still not working it's still not working It's still not doing that i found that what it will do is say okay let's implement some debugging and then it will try to console log add a whole bunch of console logs, or add a whole bunch Of tests for you. And then it will say, all right, go get me those logs if it's not hooked up already. And you just copy paste them back in. So there's so much value in logging in your errors. And that's why the Sentry MCP is so helpful as well, because there's so much value in what went wrong. And being able to prompt the LLM and provide that context is ([Time 0:21:40](https://share.snipd.com/snip/ee2b7f83-bf33-47ad-9636-600130033a14)) - **Avoid Long-Running Chats** - Start a new chat session when an AI conversation becomes repetitive or confusing. - Long chats degrade due to context limits, causing circular and less useful responses. Transcript: Scott Tolinski Your long-running chats. Man, what about long-running chats inside of AI? The longer you have a single chat going, likely the worse it will get in terms of like forgetting things that you've already told it because its context window has been filled up or just Giving you kind of, you know, you get into a situation where you're just going in a circle and you're looping and looping and like, no, you already tried that. And at that point, if you're getting into that point, it's best to start a new chat because, yeah, they will just get into loops over time. Wes Bos I find myself creating a new chat every time I'm working on like a different feature or problem. I like to keep the existing one in case I have to come back to that one because the context windows are getting much larger. And that problem of it getting overwhelmed is starting to go away, but it still can happen, especially if you've gone back and forth like 200, 300 times. It's just like, this is a mess. I need to totally scrap it. So I find myself just, yeah, fresh, new window and doesn't have the memory of everything that went wrong. Especially if you've ([Time 0:24:16](https://share.snipd.com/snip/38d62f19-4dd5-4d79-8113-f67e7a60a16e))