998: How to Fix Vibe Coding  🔗 **Source:** [998: How to Fix Vibe Coding](https://share.snipd.com/episode/40b2de33-35db-432f-a203-a672bd6d5381) ## Highlights - **Deterministic Tools Replace Vibe Coding** - Deterministic analysis tools beat vague AI instructions for code quality checks. - Wes and Scott say linters and analyzers give repeatable pass/fail outputs so agents stop guessing and follow rules. Transcript: Scott Tolinski Welcome to Syntax. Today, we're going to be talking about how to turn vibe codings, vibes into more deterministic solutions with facts and logic. We're going to be really getting into the depths of what are the different tools that you can add to your setup, so that way AI is not just guessing or making assumptions or anything like That. So we're going to be talking about different code quality tools, bug finding tools, formatters, linters, etc. But also the techniques in which you can use these things. That way, you're not just like, hey, make it good, please. All right, is this good? I have no idea. I have no way of figuring that. My name is Scott Tolinski. I'm a developer from Denver. With me as always is Wes Boss, what's up, Wes? Wes Bos Man, this is great because so much of this is like people have built stuff. And now that we're, what, three or four months into people building serious stuff with it, you're starting to see a lot of the sort of edges crack around it. People are, oh, this is not actually very good. And I don't have a problem on my hands, right? There was this post in the Reddit Open Claw the other day where this guy was just saying, like, I had clients and I made all these automations for them and I just lost all these clients. Wes Boss. What's because things were not working properly. They were breaking all the time. I had no way to tell that things were breaking, which is like throw a century on their brother. You'll be able to tell when things are breaking. Just it's an absolute mess. And if we can like have the like pure functional programming renaissance that we had in JavaScript eight years ago, if we can have that in this AI slop world, I think that the outputs will Become a lot better. Scott Tolinski Yeah, it's so funny because I did my video on the G stack stuff and the video was like 34,000 lines of slop. I think that's what it was called. And you get comments, especially on Twitter, where there's some non-developers on there who are going to be like, you all dinosaurs are going to learn that it doesn't matter what the Code quality is or if we shipped 26 test files to the user. It doesn't matter. But I think a lot of those people are going to wake up at some point when they just start hitting issues that are impossible to solve or you know you're just throwing ai back and forth at Wes Bos It trying to fix you push one thing and something else breaks and it's just an absolute mess and like i get it that the code doesn't matter as much, but we have come so far from you have to Worry about your initial paint times to who cares if you shipped eight megs of tests to the browser. Yeah, right. Scott Tolinski No kidding. Part of that too is if like that exists, then who knows what else exists? Like, are you shipping your social security number to everybody as well? Like if you have no idea, you don't know. Right. And a lot of these people don't know. Now, you know, systems full access. Yes. So what we're going to be diving into is really like what types of actually deterministic tools exist out there. And anytime you're working with AI, even if the output of these tools is deterministic, as in to give people context who might not be familiar with that word, it gives you the same results Every time, right? ([Time 0:00:00](https://share.snipd.com/snip/0d41a1bf-beaf-457c-bb19-f7df648bbf6c)) - **Lost Clients From Invisible AI Breakage** - Wes recounts a Reddit story where a builder lost clients because AI automations broke and they couldn't tell when things failed. - The core problem was no deterministic monitoring or quality gates, so failures were invisible until customer impact. Transcript: Wes Bos Wes Boss. What's because things were not working properly. They were breaking all the time. I had no way to tell that things were breaking, which is like throw a century on their brother. You'll be able to tell when things are breaking. Just it's an absolute mess. And if we can like have the like pure functional programming renaissance that we had in JavaScript eight years ago, if we can have that in this AI slop world, I think that the outputs will Become a lot better. Scott Tolinski Yeah, it's so funny because I did my video on the G stack stuff and the video was like 34,000 lines of slop. I think that's what it was called. And you get comments, especially on Twitter, where there's some non-developers on there who are going to be like, you all dinosaurs are going to learn that it doesn't matter what the Code quality is or if we shipped 26 test files to the user. It doesn't matter. But I think a lot of those people are going to wake up at some point when they just start hitting issues that are impossible to solve or you know you're just throwing ai back and forth at Wes Bos It trying to fix you push one thing and something else breaks and it's just an absolute mess and like i get it that the code doesn't matter as much, but we have come so far from you have to Worry about your initial paint times to who cares if you shipped eight megs of tests to the browser. Yeah, right. Scott Tolinski No kidding. Part of that too is if like that exists, then who knows what else exists? Like, are you shipping your social security number to everybody as well? Like if you have no idea, you don't know. Right. And a lot of these people don't know. Now, you know, systems full access. Yes. So what we're going to be diving into is really like what types of actually deterministic tools exist out there. ([Time 0:01:10](https://share.snipd.com/snip/690056c9-9ab4-463f-870e-ed76a5a36df0)) - **Run Fallow For Fast Cross Language Quality Checks** - Run a broad code quality analyzer like Fallow to detect duplication, dead code, complexity hotspots, and circular deps. - Fallow outputs machine-readable reports, cross-language duplication, and even auto-fix options for quick deterministic remediation. Transcript: Scott Tolinski But the code quality area is something that I think has really kind of blown up just a little bit. And I first started looking into this and I found a couple of tools. One was jscpd.dev, which is basically something that will analyze your code to find duplicated code blocks across 150 languages. So this is the very first one of these tools that I came across. And there's a MCP server included or an agent skill and AI reporter and stuff. And this, this tool, it's a CLI tool that will actually scan your code and look for lines that are duplicate because we know that ai will love to just solve a problem like where it's at oh I'm gonna write this utility function that clearly should be a global utility i'm gonna write it in this file and use it instead of importing or looking for an actual global utility so That helps with that because it can output and then your tools can then self patch, right? So it's like, oh, I recognize that this is some code duplication. Therefore, let me fix it. And then there's also nip, K-N dot dev, which is analysis for JavaScript and TypeScript projects. And this is going to find unused dependencies, exports, and files. It helps analyze your code. There's a whole bunch of different plugins, 100 plus plugins like Astro, Cypress, ESLint, etc. It's a cool tool. But I'm going to recommend, actually, instead of JSCPD or NIPip i'm going to recommend a tool that i found that does it all and does it all very fast and very reliable which is fallow now Fallow exists at docs.fallow we will have these links in the show notes fallow looks for dead code circular dependencies, it looks for code duplication, it looks for complexity hotspots, Code base health, and they just added feature flag detection, which I this fellow is an active development because every time I go to this page, there is another tool. And this again, works with everything automatically out of the box. Like there are tools to work with Svelte, and I didn't have to install a single thing. It just has that plugin baked into it. Wes Bos Complexity analysis. Find the most complex functions, per file maintainability scores, get churn hotspots, probably like code that's often touched, and ranked refactoring target. That's cool. Man, you look at your code base and say, ah, this is a piece of your code base that is often being fussed with, probably because every single time that you add a new feature, you have to touch That. It's probably a good spot where you could refactor a lot of that out into smaller reusable functions. Scott Tolinski Yes. And this all outputs in a way that AI can read. It outputs in a way that you can read. It feels just like using a CLI linter or anything like that. And one thing I really like about it is that you can configure it to be whatever you want. Like if you're looking for duplications, you can configure the minimum amount of tokens or minimum amount of lines that are duplicated or what those thresholds are or things like that. That's a cross language duplication where it will check between TypeScript and JavaScript files by stripping the TypeScript stuff to see. Yeah. Like there's a lot of great stuff in here and it's fast. It's fast. It works good. Architecture boundaries, man, there's so many interesting stuff. And there's even an auto fix feature. But I, to be honest, auto fix features kind of freaked me out, even though for some reason, I don't know if this is like an auto fix to me me out more than outputting the output into ai and Being like you fix it which i don't i don't know if that tracks in terms of reasonability i wonder if this complexity finding solves the opposite of code duplication because what i often Wes Bos Find ai does is it will modify a function just and throw a whole bunch of if statements oh you want to do this and now let me add this one case inside of this function and then you end up with This just like well if it's this or if it's this and if it's and it's like no that's not that's not good code at all you're simply just handling every single possible outcome instead of Making it into a like you could probably delete half of this function if you made it a little bit more uh reusable so yeah i hope i hope that that's what it does because i find the opposite As well as if you if you lean too hard into like, hey, make this maintainable and reusable and into a utility function, then it just starts to stuff everything into one function. Scott Tolinski The cyclomatic complexity. So it has a number of different complexity metrics. So the number of linearly independent path through a functions control flow graph, that kind of sounds like exactly what you're talking about. Man, and like cognitive complexity, cognitive density. Yes. Wes Bos How does this work? It obviously analyzes your code, but then it probably just gives scores based on different things. That's probably what the plugins are. Yes. Scott Tolinski There's a bunch of different scores. There's different, let's see, fellow uses binary coverage model. A file is either test reachable or it's not test reachable. So there's different types of essentially rubrics that it's evaluating your code on. You love a rubric. Love a rubric. Yes. This is the number one tool I think that people aren't using that can help their slob because this is the exact types of things that like you mentioned that AI loves to do. It loves just solve a problem as efficiently as it can, not as efficiently as your code base should have. And then that can lead to maintainability issues. ([Time 0:05:05](https://share.snipd.com/snip/09e41b7a-466c-4937-a8df-cce9605c44b5)) - **Use Project Wallace To Catch CSS Overspecification** - Use CSS analyzers such as Project Wallace to catch styling anti-patterns the AI often introduces (inline sizes, repeated line-heights, etc.). - Wallace surfaces variable misuse and places where AI over-specifies styles so you can enforce design system rules. Transcript: Scott Tolinski So there's also CSS. And one of the tools that I really like for CSS code quality finding is Project Wallace. Now, Project Wallace has a CLI as well. It can analyze your CSS variables and things like that. This would take a little bit more work to tell the AI how to interpret the results here. It's not just giving it a punch list of things to change. But I do think that it's a cool tool to have in your toolbox for when you're working with CSS, which is another one of the things AI sucks at. One thing that I want to see more of is tools like the Svelte AutoFixer, which comes in there, Svelte MCP, which will basically read your file and tell you what is not Svelte best practices. So I don't know what other frameworks might have tools like that. I'm very sure that other frameworks probably do. But you can search for those. I did a number of Googling around, but there's a lot of people talking. So leave a comment below if you have a specific React fixer type of deal or a view fixer for things that might be considered not best practices that might be hard to lint about. Wes Bos Man, the Project Wallace is really good for finding like one thing that AI loves to do is set font sizes and line heights explicitly on every single thing, you know? And my God, it's like, why did you set like it's the trifecta is line height, font size and letter spacing on every single text element in there. Yeah. And Project Wallace is excellent at like hunting those out and figuring out where that's gone wrong. ([Time 0:11:48](https://share.snipd.com/snip/bb21706d-def2-4d87-84fb-131392fa4205)) - **Index Components In Storybook For Reliable AI Use** - Index components with Storybook so AI agents use canonical, tested examples instead of guessing usage patterns. - Storybook MCP exposes docs and stories as authoritative usage, letting agents insert components with correct props and examples. Transcript: Scott Tolinski Next one here is for finding and using components. Now, this is a tool that requires a bit of buy in. But one of the problems that AI has is certainly like looking up and finding appropriate components, knowing when like testing components in isolation. We actually use Storybook on the Syntax website and Storybook has some really good new AI tools specifically around finding and indexing your components, testing your components. So there is a Storybook MCP server that the thing that I like most about the Storybook MCP server now does require buy into Storybook. But if you're already using Storybook, this gives you a number of things like list all documentation, get documentation, those types of things. So that way, like when you say I need this component or whatever, it's not just doing a find in your code base, looking for components and then trying to guess here. It's actually like, okay, here are all of the components, get that components documentation. And one of the more powerful things is that there becomes canonical examples, because you're using stories to show how the components used, because typically the AI is going to use The what, like the type signature, and or maybe other prior usage of that component. But this gives it like a real, here's how you use this thing. That way it can plop it in there. Wes Bos Man, if you have a really good design system and a whole suite of components that you can then use, unstoppable with AI stuff, especially when you're like simply just clicking together Like a new view. You already have all the pieces for that and you just need to like wire them up, maybe write a bit of logic and how to interact with it. Great use case. ([Time 0:14:13](https://share.snipd.com/snip/03a5f5fe-4782-4d80-9cef-6219c6e9cd83)) - **Give Agents Real Error Context With Sentry Tools** - Plug Sentry CLI and Spotlight into your dev flow so agents can fetch real error traces and local logs deterministically. - Agents can query root-cause errors and local traces rather than guessing from console snippets when fixing bugs. Transcript: Scott Tolinski Next one here is bug finding. Now, I just have these two Sentry tools, Sentry, which is, well, Sentry presents syntax. Head on over to Sentry.io forward slash syntax and I'm going to get two months for free with the coupon code TASTYTREAT, all lowercase, all one word. But these two tools I think are really fantastic. One is the Sentry CLI, which everything CLI these days, but the Sentry CLI allows you to authenticate with your Sentry. You can get the root cause of any error in your Sentry. You can see all of the relevant errors in your project directly from your CLI. The agents can connect to the CLI, and therefore the agents can look up what your errors are and get the actual root cause and then fix the thing for you. It's very seamless. So if you're using Sentry already, plug in the CLI to whatever you're doing. Super good, yeah. Yeah, check it out. Another tool that I think has gone under the radar a bit is the Spotlight tool from Sentry. Spotlightjs.com is an MCP server that gives you real-time local errors, traces, and logs. And it gives you essentially a local interface for debugging in development. And so this is a tool that is primarily used for while you're in dev, you're talking back and forth, and the agent isn't having to hunt in the browser logs, it's not having to hunt in your Terminal logs, it has all of that information directly in an organized way. So that way, again, you're not copying and pasting back and forth with the agent, or you're not having to use a headless browser that then has to scoop up those errors. Wes Bos Yeah, connect to Chrome DevTools and pasting your logs. Just a nice tidy spot for all of your info. You're probably interested in that info in in prod right and you're using century for that but in development as well sometimes that or often that info is extremely helpful especially Scott Tolinski When you're using agents yeah and you still get that root cause analysis which i think is super helpful but there's also performance so you can get database query timing api request, Component render times. Like you get all of this in your local dev flow. And I don't feel like enough people talk about this tool because I find it to be very helpful. So it's easy to install, works with everything. And I like Spotlight. ([Time 0:17:28](https://share.snipd.com/snip/0b70e9c0-8181-4212-be6e-4980815d9fcf)) - **Enforce Rules With Linters Not Just Agent Guidelines** - Enforce style and framework rules with linters and custom plugins instead of only writing guidelines in agents.md. - Scott cites Kevin from the Svelte team writing an ESLint plugin to fail when AI uses effect incorrectly. Transcript: Scott Tolinski These are tools that, again, many of us have just always used formatting and linting tools or even type checking tools like just TypeScript. But like these things become very important when you are wanting to tell your agent to always run, you know, type checking, always run linting after completing a feature, all this stuff And moving again, these general like, is this a problem or not out of the brain of an ai scanning your code for problems and into a checklist of fix this fix this fix this one thing i really Like in this regard is uh vite plus uses vp check to run linting and formatting and type checking if you wanted to uh it does so with caching. It's just the best for this type of thing. So if you're using VitePlus, the VP check is the one to use. It's really great. But otherwise, using something like ESLint is just becoming more and more important. Now, one thing I think that's really underutilized here is that a lot of us as we've mentioned have issues that ai just continues to do like in svelte it's a problem where it just uses effect Wes Bos For everything it's like yeah brother this ain't react just coerces the value you know it uses as or it just like makes up its own types oh right i expect that this is what the template looks Like so i'll just throw a type above it. And it's like, no, that should be inferred from the database, something like that. And I feel like with TypeScript a lot, as good as it is as TypeScript, it cheats it quite a bit. Cheats it, yeah. A lot of people are just like, oh, test pass, you know? There's no type errors. Yeah, because you just use assertions everywhere. Scott Tolinski Yeah, I know. And so one of the things that like I think vibe cutters might do in this situation is just put it in their agents.md saying, hey, don't do that. Please, no, don't. But that's like a sign that says don't that you can just walk past, right? Like the AI agents won't adhere to that. They're going to consider it. But if you put it into a tool like this, then that changes things quite a bit. So I think Kevin from the Svelte team was saying that he even put in his ESLint setup, it would fail if the agent used effect in SvelteKit just because of how much it was doing. So he wrote a custom ESLint plugin just to check for those types of things. And I think that's really underutilized. Writing custom ESLint plugins instead of just tossing stuff into your agents.md. Yeah. I think it's something that people don't do enough. Wes Bos Make it deterministic, you know? Don't write a wishy-washy rule. And the beautiful thing about that is that it is so easy to get the AI to write a deterministic plugin, right? ([Time 0:19:59](https://share.snipd.com/snip/0bcb024b-c0ab-4a3d-aeae-0629a6a75b1f)) - **Prefer Fast Opinionated CSS Tools Over Heavy Config** - Fast, sensible defaults for style tools reduce config friction and curb AI weirdness. - Wes prefers lean tools like Clint and new Lightning CSS–based linters over heavy StyleLint to keep checks quick and opinionated. Transcript: Scott Tolinski Yeah. I think it's something that people don't do enough. Wes Bos Make it deterministic, you know? Don't write a wishy-washy rule. And the beautiful thing about that is that it is so easy to get the AI to write a deterministic plugin, right? And then you can write tests against it and see that it actually works. It's, man, I've written like three VEAT plugins in the last like six months as well, just because it's so easy to spin one up. Scott Tolinski Yes, I know it is. And then on the CSS tip of things, stylinet is still great. It's something that is so underutilized. I think I've said that about a hundred times on this podcast. Stylinet is basically CSS linting in the same type of way. It helps you find those exact type of things. Expected custom property name, disallowed unit. Like again, like, all right, you are assigning a background color or you're assigning a box shadow without using one of our predefined shadows. It's in a variable or you're giving a color that's not in our variables. It's going to error on this. And then, you know, that can be used in addition to actual like agents at MD files about saying what to do in those types of situations. I am working on my own because stylinet is great, but I would rather a tool that was more effortless. So I made one using the Lightning CSS parser because I wanted it to be faster. I wanted it to be, you know, tuned to kind of modern CSS sensibilities. Wes Bos Yeah. So what's wrong with StyleLint? Scott Tolinski I find StyleLint to be difficult to work in. I find it to be a bit bloated. It's been around forever. It's very full featured. But I'd rather it be like, like parcel or even like with the new Vite stuff, right? Where it is just really smart defaults. Yeah. No configuration. Throw it in there. Wes Bos As long as you're okay with it. It works fast as hell. Yeah. That's what, that's what I've been telling people with like Oxlant and Oxformat and stuff. In most cases, like I just put my, I've put so much of my like ESLint and prettier config away. And I was like, I'll just, I'll just use this, you know? And for newer projects or projects where like a massive changing thing, maybe two or three changes I added to it. So I wouldn't have this massive commit that just changed the entire code base. But yeah, as long as you can just like lay down and accept the defaults, sometimes that's better. Scott Tolinski Yes. And so that's really what this is about. And man, is it fast. It works with all my stuff. It's called Clint, like CSS Lint, Clint. Check it out. And it's still early, but it does know unknown properties and valid values, duplicate selectors, duplicate declarations, empty rule sets, those types of things. And I think it does so very fast and nice. So give it a try and I'm accepting contributions to it. That'd be great. ([Time 0:22:34](https://share.snipd.com/snip/9992709d-86ef-43e8-81e2-85a7edb2db7e)) - **Use Headless Browsers For Deterministic UI Checks** - Use headless/browser automation (Agent Browser, Chrome DevTools MCP, LightPanda) so agents can interact, screenshot, and read console/network reliably. - Agent Browser supports Electron apps and can connect via remote debugging to automate real app interactions. Transcript: Scott Tolinski The king of this area is the agent browser from Vercel. Agent browser is great because it's very full featured. You can tell agents to, hey, check this in the browser. It can do screenshots and those types of things. It can handle anything that a browser would be able to really is what it comes down to. And for the most part, I don't have a lot of complaints with Agent Browser. Wes Bos No, it's great, especially because like one cool thing with Agent Browser is that you can hook it up to any Electron application. And all you have to do when you're starting the Electron application is you have to start it with like a remote debugging port, which is an argument. So you can open Slack and pass it, dash, dash, remote debugging port 9222. And then your agent browser skill will be able to connect to it. And like I sent Scott, Scott's like, well, what were you using? I was like, I use agent browser. And I sent him a message from, I just went into Claude and I was like, use the agent browser. You have to restart Slack with the flag, but it can do that because it can run terminal commands. Right. And then it just sent like Scott a little message. And I set that up the other day because we were doing a battle with CJ, Scott and myself. We were doing a battle where we couldn't use the mouse. And I thought that Randy was going to post something in Slack, like a screenshot or something like that. And we weren't allowed to copy paste it. So I was like, I'm going to get my agent browser dialed in so that if Randy posts something in Slack, I'm going to be able to get that image out of Slack into my editor. And it ended up working, but it ended up not being what Randy had planned for us. So I'm ready for the next one. Yeah. Scott Tolinski Yeah. There's also Chrome DevTools MCP, which is great for this as well. The thing I like about Chrome DevTools MCP is that it pops open a little Chrome that you can see it executing your stuff on nice and easily. I think that's the default way that it works. I don't know if you can even turn that off, if we're being honest. But I like that I can see what it's doing. Like, sometimes the AI uses, like, it just assumes. It's like, oh, this is a feed site. Of course it's on port 5173. Okay. And then it's, like, the wrong site. And it's like, huh, for some reason, the app is showing something weird here. I'm like, that's because you're at the wrong app and you didn't check the port. So yeah, Chrome DevTools, MCP, great, great usage for that as well. But having these tools are great because again, you can look at the, they can take screenshots and see what it looks like. It can read the console log and it can read the network panel and those types of things. Wes Bos Another option here is panda have you seen light panda wes i i had this on a list for another show um that i've been been mulling around so they rebuilt an entire browser um it uses it uses V8 but it's apparently way faster for headless and I went back and I looked at it. It says, the first browsers for machines, not humans. And I was like, wow, they're like, they really are going hard on this like agentic browser, which apparently is it makes it faster for interacting. Because that's the one thing about these like puppeteer and these headless browsers. They're slow as molasses because they got like take a screenshot or go to the dom and then send a click event absolutely so brutally slow so light panda is like a a new browser that they Basically just took v8 which is like the engine it can run javascript um i don't know if it runs css or not but because it just needs like the markup, right? And then apparently it's way faster. I looked into it because I was like, what is this? I was like, they didn't just build a browser from scratch, you know, like that's crazy. Ladybird is doing that, but they are crazy. Scott Tolinski Yeah, because it just says a browser engine. It's okay. Yeah, it does say LightPanda is written with Zig and it uses build the V8 engine for ZigJS runtime. Interesting. Yeah. Okay. Wes Bos Yeah. And I looked into it. I went on Wayback Machine and I was like, this is not just something that someone vibed up in the last like six months because everything, everything is agents. And they used to be a browser for scraping, which makes sense. So they were, they used to be this thing that scraped websites and got data, and it was as fast as possible. And I guess they've sort of changed. I guess it still is a big use case, right, is visiting websites and scraping. Scott Tolinski Yeah. You know what there's pricing on here? Is the pricing only for their cloud, or is it just using LightPanda in general? Wes Bos You can install this thing and run it no problem. I think the thing that nobody is talking about with these like AI agents and whatever is that you need a lot of IP addresses and you need a lot of compute to actually run these browsers. And often it doesn't make sense to like run a headless browser inside of like a serverless function, right? So you see like Cloudflare has their own like browser thing that you can use to take screenshots. And it's like it's puppeteer compatible. And then they have this thing as well. But I think the other thing that a lot of these companies that do this are not talking about is that they probably run them on either in like people's houses. I think I don't know if this is true or not, but I listen to this really good dark net diaries about these like streaming boxes. And I've also gotten lots of emails from people saying I have residential IPs available. And it's because you can't just like use a VPN and like scrape a thousand websites. They're going to block you. They don't want you doing that. Many of these places don't want you doing that. So what you need really is like something like LightPanda running on somebody's illegal streaming box. And you have like a nice clean IP address that you're able to send requests out on behalf of someone. I don't know that that's actually happening, but and I don't know that this is LightPanda is doing this, but I guarantee that's happening in some regard right now in our industry. It's very interesting. Scott Tolinski And also, if you're curious out there, you can have Agent Browser use LightPanda as the engine. So if that's like puppeteer compatible, right? Wes Bos Yeah. Scott Tolinski If you want to just have your whole setup with agent browser that you already have, and then pop in LightPanda as the edge in, it's a simple config change. ([Time 0:25:45](https://share.snipd.com/snip/aeeb39a8-2080-4c83-986d-5c1127b92c11)) - **Use Deterministic Task Systems For Agent Workflows** - Track agent tasks with deterministic to-do systems like Dex or Beads so work items are blocking and portable. - Dex writes tasks to JSON in repo, and Beads persists across Git hooks so agents can't lose context between runs. Transcript: Scott Tolinski Another thing here we have is tasks and to-dos, which man, AI loves to lift a bunch of to-dos and then not check them off or not do them. Or every single AI harness has its own to-do system and they're all crazy and they don't get saved to your database. So I have a couple of tools here and this is less for deterministically scanning your code base but this is more for a general workflow type of thing. I use Dex at dex.rip which saves everything to a JSON file. And then there's Beads, which is one that's popular that source things into a database and uses Git hooks. But either way, the thing that are nice about these is that they can be blocking, you can have tasks that are blocking other tasks, you can have a clear execution of this, then this, then This. And again, it's commits to your GitHub repo, you can take it with you. This is again, less of a code deterministic thing, but more of a plan deterministic thing. That way, if it's saying give me the next task to do, it's not just like, huh, what should we do? It's like, okay, this is blocked by this, which is blocked by this, let me pick this. And then let's implement this. And then again, you can have descriptions where you're passing in actual code paths and stuff. ([Time 0:32:11](https://share.snipd.com/snip/417e6580-fb09-4d57-9400-e3b1263766e9)) - **Give Agents Docs And A Sandbox To Reduce Tool Guessing** - Giving agents authoritative docs (Context7) and sandboxed code execution (TanStack Code Mode) reduces tool-choice confusion. - Scott and Wes note LLMs execute TypeScript reliably in sandboxes, letting MCP servers become small code runners rather than complex routers. Transcript: Scott Tolinski Next one here is Context 7 for docs. I still use Context 7 quite a bit because in this whole platform of AI agents knowing what to do, you can have best practices, you can have skills that are telling it this or that. But a lot of times just having the docs in context seven via an MCP, I find to be still the best. It just looks it up, gets the answers, possibly usage patterns stuff like that, and then is able to assess a better version of like, okay, this is what it should be done like because I have The docs. So that one's been talked about to death and again, less deterministic about your current code and your current quality. But when you're looking up patterns and examples, context seven, great. Wes Bos Did you see Tanstack code mode they released the other day and i think this is similar to the cloudflare code mode that they came out there cloudflare replaced their entire mcp server Which was they had like seven or eight different mcp servers that you could hit and and what happens is that you get so much context bloat and and it has to work really hard to figure out Which tools to call whatever and they replace the whole thing with with simply just like giving it a sandbox to run some typescript because the llm is it's pretty good at running tool Calls but it's really good at just simply writing typescript that can can be run right it's the same idea that everybody is saying don't use mcp just let it run cli the the agent is very Good at running CLI calls. So in the same way, the agent is very good at writing TypeScript. And if you give it this sandbox where it can run TypeScript, I won't get into it. We'll do a whole show on it. But you get like the schema, you can call all these different tools and then it will then execute it, right? It might return documentations, it might update your Cloudflare dashboard or whatever. And it's like a really interesting way to make an MCP server is basically just giving the LLM a little spot to run some code that is in sandbox. That's what the Cloudflare dynamic workers are. Now, Tanstack came out with their own code mode, which is really cool, a spot to run this all. So I think we should probably do a whole show on this because this is very interesting. We're all trying to figure out what all these tools are and how they best work. Scott Tolinski And I think this code mode certainly hits on some of those. Code mode is an interesting name for that. I don't know if I get the name, but I'm keeping an open mind here. ([Time 0:33:32](https://share.snipd.com/snip/570fd306-928d-4a66-8d42-9a70d3862d45)) - **Chain Quality Checks On Completion And Block Commits** - Make quality checks part of the agent's completion sequence or CI commit hooks so failing checks block merges. - Scott suggests a post-feature sequence: typecheck, lint/format, run Fallow, and prevent commits if any step fails. Transcript: Scott Tolinski So at the end of the day, how do we get AI to use these tools? We beg them. We put them into our agents.md file. We put it into skills. We tell it, hey, always. Yeah, I've had good luck with saying upon completion of any feature, always run this sequence right run fallow quality run first run type checking or vp check then run fallow checking Then do this then do that i've had good luck with that but at the end of the day you can run them yourself and give the output to the ai agent and say hey fix these things or you can say in your Agents, please do this. Or you can have skills, which is like my quality check skill commands that run the quality check commands. But it's very difficult. Besides that, you can always wrap this all up into one quality check script that then runs all of your quality checks. Wes Bos Yeah, you can run it on like a commit, which is pretty common thing to do, right? Like you're not allowed to commit any code if these things are failing. Some of them are a little bit more like annoying because you're like, oh, it surfaced that. I don't necessarily care about that. And then I'll have to go and put this weird comment in my code to ignore that. But running it on commit is maybe a good idea. That means it will never actually make its way into your code base until things pass. Yeah. ([Time 0:36:01](https://share.snipd.com/snip/78435451-36d2-48d0-9e06-a3b5bab2c6c6))