July 21st, 2025 ×
AI Coding Roadmap for Newbies (And Skeptics)

Wes Bos Host

Scott Tolinski Host
Transcript
Wes Bos
Welcome to Syntax. Today, we got an episode for you on an AI coding Node map for anyone who maybe has has put it off for a while. You're or you're relatively new to coding with AI, like writing code with AI, as well as writing code for AI, meaning that you, like, use the libraries as part of your application.
Wes Bos
So we're saying for newbies, but we're also saying for skeptics. Wes I I know there's probably quite a few people, probably myself included in, to some degree, hopefully, all of us to some degree, where you're kinda sitting there being like, JS it really that good? Is it really going to change how we how we do this type of thing? So we're gonna we're gonna run through, basically, how to actually write code, all the different interfaces, and then also building things with AI. So, like, understanding all of the different parts, context, tokens, prompting, all of the different models that are out there, streaming, embedding, rag, all those words that you're gonna be hearing about. What's up? My name is Wes. I'm at the cottage right now, and I forgot my nice camera. So this is actually not not bad, though. This is my iPhone 13 just on a tripod, and it's that's that's decent
Scott Tolinski
video quality. Hey, man. It looks great. And, yeah, happy you're out there at the cabin. That's a great time of year for doing that kinda thing. Right? So,
Wes Bos
I'm up at the cottage right now, and we're just talking about it. And me and Scott were not be able to talk to each other, and the video was glitching out. And I was doing I'm on Starlink, and I was getting, like like, a 100, a 120 megabits down. I was getting about 10 to 12 up, which is is usually not an issue, but it was just not working. Right? And and the pings were were decent. So I switched to my LTE cell phone, and I'm getting four down, two up, and the video is way better. And the the ping is the ping is fine. So I don't know, man. That's
Scott Tolinski
Yeah. It's bizarre.
Scott Tolinski
Yeah. Definitely bizarre.
Scott Tolinski
And it definitely is easier to talk to right now.
Scott Tolinski
Hey, Wes. I did some soldering, yesterday. No. This weekend. Not yesterday. On Sunday.
Scott Tolinski
Well, I have this. I've I've been digitizing all my band's old footage, which are on, like, Hi eight d v, tapes. I don't even know if it's d v. They're on Hi eight tapes, which are these, like, tapes this size. And so I've been digitizing it all, throwing it on YouTube because, like, hey, man. You know, that stuff's just gonna get lost to time if I don't.
Scott Tolinski
I have a little device that takes in RCA in and does HDMI out, so that way I can do the cam link and whatever.
Scott Tolinski
And the USB micro USB came unsoldered from the board, and I soldered it back on.
Wes Bos
That's impressive. Wow. That I That's a pair of pretty tiny.
Scott Tolinski
It's it's tiny. I'm doing the little thing. Listen. If I bump it the wrong way, it it the connection goes out. So I just gotta, like, leave it. It's not it's by no means a professional job, but I am a a terrible, solderer. So I I just wanted to to, you know, toot my own horn here for a second.
Scott Tolinski
Can we say that micro USB was the worst? The worst. Wes all connectors? It's got those little prongs in it. So every time you pull it in or out, it either stays in or, like, comes right out immediately.
Wes Bos
Yeah. Yeah. Yeah. Mini USB was far superior to micro USB.
Scott Tolinski
In terms of shape or design or what?
Wes Bos
I don't know. It just was better. It it was easier easier to figure out which which way it went in. Micro USB sucked.
Wes Bos
Yeah. It sucked for sure. Probably, it goes lightning as the very lowest of all. Yes.
Wes Bos
And then all the way up to, like, you what? USB c, although they got their own problems on the top. Lightning decided that a wafer was the best design of a Vercel wafer that could just snap off at any time.
Wes Bos
Alright. Let's get on into it.
Wes Bos
First, we're gonna talk about how to actually interface with AI AI when you're writing code. So the probably the most entry level one, and maybe you've experienced this, is just like ghost text or or auto completion. So you fire up an IDE editor and whatever editor you're using. So, obviously, Versus Code, Windsurf, and Cursor, probably the big three right now, but any editor using will have some sort of AI plug in for it. And then as you're typing, it will try to autocomplete it. That can be a little bit frustrating at at times, but I also find myself Wes it's turned off, I'm almost at a point now where I'm just like or, like, you're writing code somewhere that it doesn't have that, like a text area or or, like, even, like, on Twitter, and you're just like, I need that. You know? Where where's the the autocomplete for it?
Scott Tolinski
Yeah. And and I will say that this is the lowest barrier to entry one and, honestly, probably the least intimidating version because most of us are used to working with autocomplete of some regard inside of our text editor, and that ghost text popping in there shows you what it's gonna be. You can choose to just toss it in there or not. So for me, this is like, if we're talking dollar signs in terms of intimidation factor, this is this is like a $1 sign. It pops in there. You can choose to accept it or not. And, I I I think that is a relatively easy way to get get going with working with AI and and not have it not feel super icky. Right? I know there's lots of people who don't even like autocomplete. Like, not even like, AISI, people like people don't like autocomplete at all. So if that's you, maybe you wanna check out,
Wes Bos
one of the ways to sort of chat with your code base. So all of these IDEs are gonna have a sidebar where you can go ahead and select a model and be able to to chat with it.
Wes Bos
Most of them now have defaulted to what's called agent mode.
Wes Bos
And what agent mode will do is you type into the box, add a component that does x, y, and z, and update the data bay database, and it will go ahead and do it. But there are other modes, where you it will either just give you the answer, which JS, like, the very basic chat. You can ask it to summarize something. You can ask it to modify something. It'll just give you the answer, and you can go ahead and copy paste it. Or it will allow you to apply the edits manually, which quite honestly is is kind of kind of slow. And a lot of people didn't use that this, like, chat feature until the agents came along where it just sort of staged all of the changes. And then you can either you can go through every single change and accept them one by one, or you can just kinda YOLO accept everything.
Scott Tolinski
Yeah. And and the way a lot of these things, especially, like, Cursor works now, is that, like, once it makes the changes, those changes are ready for you to use in the browser. Before you accept. Yeah. Before you accept. Without without you having to commit to those changes, you can actually try that stuff out. You can see what it looks like. You can see what it feels like. Beyond just having to go through the code, you can see really quickly if it did the job by looking at the the end result and trying it out, which is, one of the things I I feel like I've had a harder time with some of the CLI agent platforms. I'm interested to get your take on that. But that's the one reason I tend to reach for the IDE chat first and foremost as my main means of working with AI currently, specifically because I do like to be constantly trying it, constantly seeing it in action, and then go through the code and then choose to accept it or not.
Wes Bos
The fact that you can always decline the changes or roll back your code to a certain point in time is really nice. It's it's a a feature that I really like about all of these AI agents because you otherwise, if it if it tries to do too much or you're a bit, like, spooked about how much it's it's done, then I have the same thing as well. Maybe we'll talk about that. So, like, the the third thing here is is CLI agents. So instead of asking Cursor inside of the IDE to do something, the we're seeing a lot of people use terminal UIs to interact with your code Bos. So the big ones being probably, by far, the biggest one is Cloud Node. And then couple as of recording, couple days ago, Google rolled out their own Gemini code.
Wes Bos
There is Node from OpenAI.
Wes Bos
There's OpenCode, which will allow you to bring your own thing. There's several others out there. We'll probably do a whole show on on these CLI agents themselves, but the ideas oh, and Warp. The Warp, my favorite terminal, has, like, totally pivoted their business Yep. Into being, like, a coding tool, via the terminal, which is like I had a call with them a couple months ago. He's he's like, I really think that, like, the the terminal is the UI for for building software.
Wes Bos
And I was like, really? And then, like, here we are. Couple months later, everybody's going bananas over terminal UI. So it's kinda interesting.
Scott Tolinski
I still as much as I use cloud code, I still Yep.
Scott Tolinski
Don't buy it as being the best way to work compared to the Node approach.
Wes Bos
Yeah. I agree. And I think that they are different approaches. So the idea with something like cloud code is you you type into the box, hey. Build x, y, and z, and it will make a plan, and it will go off and do do that thing. And I think the idea with those is that you're not necessarily just sitting there waiting for it to complete JS you're firing off three or four of them, and they all work Right. In in parallel. But for for times when you do wanna sit there and and and do it, I don't like that interface at all. If I hit the wrong key, the whole thing quit.
Wes Bos
Granted, the Sanity, I think the quality of cloud code is significantly better. Yes. I think that I think that's why a lot of people like it. And you can also build cloud code into other tooling because it's at the end of the day, it's just a NPM script that you can go go ahead and run. But quite honestly, I much prefer the IDE experience where you have a full blown GUI, and you can click on things. You can roll things back. You can accept things.
Wes Bos
And I know cloud code, you can do these things. You can open it up in an editor. You can view the Wes, but it's not as good. Not nearly in my opinion, not nearly as good as as using, like, a cursor or Versus Node
Scott Tolinski
in in the editor. If we're talking about skeptics and newbies too, I feel like they might have a harder time with this. Because especially if it's not getting it exactly right and you're constantly having to go back and forth with it, you you might be getting a little frustrated using the CLI.
Scott Tolinski
Especially, like like I said, skeptics are gonna be like, move. Let me do it. You know? Yeah. And I think that's harder to do from the CLI than it is from the IDE itself.
Wes Bos
I agree. I agree.
Wes Bos
So we've got ghost text agents, chat agents, background agents. Right? CLI tooling that we can use. The next next way that you can interface with this is MCP servers. This one's not necessarily direct, but the idea with MCP server is that they are are kind of just like plug ins for your AI, and they will allow you to bring more contacts, more tools to the AI agent. So a big one that I I found out about a couple weeks ago was contact seven. This one will give you the ability to inject the documentation for different, libraries into your actual prompt. And you don't have to do it yourself. You just say, go read the docs for Tailwind four or Svelte five, and then it will go off, download the docs, stick that into the prompt, for you, which is I honestly quite like that a lot better than the, like, cursor built in documentation. I've never felt that the cursor built in documentation worked very well. I'm not sure if you have the thoughts on that. It's obnoxious because in so folks who don't know, newbies, skeptics, anybody,
Scott Tolinski
in Cursor, the editor, in the settings, you can attach, docs and to, like, a keyword, essentially, like Svelte five docs, and you're pasting in either a link to the docs page or the l l m's dot t x t file, which we'll talk about. And with that, you are able to access the up to date documentation and reference it. However, with Cursor, you, like, frequently have to do at the docs in, like, every message.
Scott Tolinski
At least I have found to get specific syntax, I'm always having to reference constantly those docs to say Node. Yeah.
Scott Tolinski
Please, for real, actually use these docs these times. I'm begging you. I've given you the docs. You have the docs. You can look at them. You've indexed them. Just use them, please.
Wes Bos
And especially for docs that don't have, like, a single page that you can grab them, a lot of documentation now will will publish their documentation either as a single markdown file or, like, l l m's dot t x t or as, like, multiple markdown files, which you can easily gather up and and inject as you need it. But I I've had some documentation for very small libraries where it's, like, thirty, forty pages, and I just hadn't found a good way to provide all of that.
Scott Tolinski
So I'm still still kinda working on that. Yeah. My my biggest frustrations do still revolve around versioning modern software.
Scott Tolinski
It's like, if you are if there's a reason why, it seems like we're converging on a handful of tools because AI is really good at a specific era of specific tools.
Scott Tolinski
And, like, once you get ESLint, oh, Svelte is now releasing, wow. They changed their on colon click to on click, and, like, AI is just like, I've never heard of that even though I have all the documentation in front of me. Yeah.
Wes Bos
Anytime you find that you you say the AI is really dumb at x, y, and z. The AI, for example, AI can't do math. I talked about this in our MCP episode.
Wes Bos
Right? If that is your, like, thing, oh, it sucks at x, y, and z Yeah. The answer to that is very likely Scott, oh, okay. Well, scrap it. It's not very good. But the answer almost always is, yeah, there should be some sort of tool added to it via probably via MCP that will give it the the powers that you need.
Scott Tolinski
Yeah. Totally word. There's also a handful of GUI apps, v zero probably being the most, most popular one. It's it's basically a way to build things very quickly using Vercel, v zero well, not using Vercel specifically, but it's it's built on Vercel.
Wes Bos
And this works for chat. You should say that. It's basically like a visual chat that will It's a visual chat. The UI and and some of the functionality.
Scott Tolinski
Yeah. And a handful of these tools all work very similarly.
Scott Tolinski
And the the branding on a lot of them is really like, we can build something very easily for you.
Scott Tolinski
So another popular one would be Lovable in this space. Lovable has pretty much the exact same landing page as v v zero in many ways. Like, you Sanity tell just by looking at the landing pages, like, kind of what the vibe is for some of these things.
Scott Tolinski
Bolt.new, another one.
Scott Tolinski
Basically, hey. You wanna build something? You wanna start with a chat inside of a a a GUI? Then, like, hey. This is the way to go. This is maybe in my mind I know a lot of people like v zero, but in my mind, this is for more of the person who doesn't want to get into the code as quickly themselves in terms of, like, in your in your editor, in your in your dev environment, like, up and running. Like, this is somebody who wants to build something with the least amount of effort, but also maybe the least amount of, human human interaction with it right off the bat.
Wes Bos
And it's certainly a lot more UI focused than it is like like, all of these tools can do back end now.
Wes Bos
Initially, it was just UI focused, but it's much more based on the visual prompting and going back and forth, which is is really cool, quite honestly. And and, also, Windsurf has this feature built in as well. Right? Because the type that wanna just, like, have it generate code are more more going towards the IDE, and then the type that wanted to just build a visual website are more going towards warp and, like, components and whatnot, they're going towards these tools.
Wes Bos
So Wes Surf is trying to at least, I think, they're trying to attack, those tools as well. So Yeah. I wouldn't write these off because they don't seem to be as popular in our circles of people who already know how to Node, but That's what I'm saying. I'm always oh, and Repl dot it. Repl dot it's huge in this in this one as Wes. And Yep. Especially repl.it because it seems like nobody in my circles uses repl. It. And it seems like repl. It is absolutely huge, which tells me that there's, like, a whole generation of people who are building stuff Yarn just sort of coming at it. Like, they don't care.
Wes Bos
People that just want a website don't care if they're doing it the right way. They just want it to work, and they want it to to they want it to build what they want. Right? So Yeah. Those are pretty interesting things.
Scott Tolinski
A lot of these tools are popular within the I built a app with AI, and now it makes me $5 a month crowd, Twitter thread boys down below type of, audience. So just, like you said, I should say, more popular with maybe not our kind of deeply tech audience. And as far as, like, the AI skeptics go, might be most skeptical of this type of thing just because of the type of individual that most Yeah. The brain Node. Is No.
Wes Bos
No. I certainly am very careful to write these off because I think that they are very good. And, also, if you were to give me a tool like this for something that I was not good at, like, for example, making art, chat apps, you know, being able to generate photos, or, I use I use the Eleven Labs one to create sound effects for my my Captcha one. You know? And I'm sure the audio people are sitting there being like these idiots are just typing in what they want, and they're getting these awful sound effects out the other end. But I don't care. I don't care. It it gave me a really fun, you burned it, audio audio little clip, and it worked great.
Scott Tolinski
Yeah. I Node it's it's definitely great for that.
Scott Tolinski
The the last one here is just like chat apps, like chat g p t. And I gotta say Yeah. I used AI to do coding like this for a long time. Because for a little while, before you had things like before the the chat interface was any good. Because that for a while, the chat interface was really bad inside of both Vercel Node, and, you know, it made more sense to either do the autocomplete.
Scott Tolinski
But if you really wanted maybe, like, a back and forth with some Node, iterating on a code, copying and pasting your code into chat g p t, and then working with it and then copying it back into your app, for a while was, like, the best way to work in AI before we we got a lot of these newer tools. So, this is certainly still something you can do if you're the type of person who's like, I really wanna dial in on this. Like, I wanna copy and pay. I wanna work back and forth with this in a chat way. But at the end of the day, it's not a text editor. You're not getting into there to modify the code. You're doing a lot of copying and pasting and trying a lot of back and forth, and it is really super inefficient compared to most of the newer styles of working with this stuff. So I probably wouldn't recommend this. If you're talking to me and you're new to this stuff, I would say you can either start with the ghost text if you're scared of it.
Scott Tolinski
But the IDE chat is probably the least scary way to start using AI in your app in small dosages, instead of, like, trying to go whole hog into this thing. Yeah. I will I will still use chat apps for
Wes Bos
research and reference where I don't want it to take my entire repo into consideration. Because sometimes you ask it questions, and I'm like, no. I don't want your your I don't want your idea to be slanted based on the code I've written. I want you to just give me an idea of what you think in general. So if if I'm looking at how CSS features work or how to best approach something, I'll I'll paste it in. But I put this in here because, at at least, maybe even three or four months ago, it seemed like a lot of people thought that coding with AI was was that. You're just copy pasting it into CheckatGPT and copy pasting it out and, like, no. That's slow that's slow as hell. And the I I wouldn't wanna do that either.
Scott Tolinski
For sure. And I gotta say, Wes, your your note on research in those types of things, I have completely changed how I do that in the past month, with code and in general.
Scott Tolinski
I'm almost entirely using Dia browser now for that specific thing. The chat window in Dia browser is so good because you know how some documentation sites have, like, the chat with AI feature Yeah. In their? Dia basically gives you that for any project.
Scott Tolinski
So you can reference the docs in the browser from Dia with your code. You're pasting back and forth. You're referencing other tabs.
Scott Tolinski
Oh, I have this library, and I have this library. They're in two different tabs. I can pop open a little chat on the one and say, hey. If I were to integrate it with this other service here in this other tab, how might I do that? Here's some of my Node, and it's, like, so stinking good for that.
Scott Tolinski
So, Deno, man. It's been and I I actually just signed up for the Perplexity Comet browser beta JS well. So I think we're gonna start seeing agentic browsers more and more. Cool.
Wes Bos
Yeah. Yeah. I'll I'll have to give that a shot.
Wes Bos
Let's move into the second portion of this episode, which is actually building stuff with AI. So this is not writing getting AI to write code for you.
Wes Bos
It's kind of the other way around JS is you or, I guess, the AI is writing the Node. But I feel like in order for you to get good at writing code with AI, you need to actually build something with these tools in order to understand what all of the pieces are and how all they all fit together. And if you build, like, a small little application that has a few of the features, I think it will give you a good idea of, like, token counting, pricing, contacts, prompting, the different models that are out there, streaming text versus not, embedding, what the warp called rag is. So if you build something that includes all of these features let's go each of these features one by one and sort of talk about them one. First one is just like custom prompting. Right? You you wanna build an application, and you're going to send some data, most likely text, but it could be multi multimedia.
Wes Bos
If you're going to be sending it to an AI and getting the data back, custom prompts JS probably the the most table stakes. Right? When you build something, you you give it an initial system prompt, and you can say, you are an expert at, identifying birds given, given the sounds that they make when they Yarn scared. You know? Something absolutely silly like that. And and that will sort of set the stage for us. So a custom prompt is the very basics there. Yeah.
Scott Tolinski
Have you solved the getting data back piece? Like, I need the data back in this specific format. I understand that there's OpenAI functions and things like that. Yeah. Yeah. The being able to get data back in the
Wes Bos
format that you want has has pretty much been solved.
Wes Bos
Even, like, the Syntax website, we have AI stuff on it. This was before you were able to or the OpenAI SDK, it has a has the ability to just pass, like, a JSON flag to it, and it will always return you JSON.
Wes Bos
If you're not using an OpenAI compatible provider, which we should say almost all of them Yarn, you use the OpenAI Wes, and you can use it with, obviously, OpenAI, but you can also use it with with Claude and Gemini and, like, pretty much all of the other services have been compatible with it, which is really nice because you can always just swap out models, and you don't have to, like you're not hard coding your app against using just OpenAI models. But, yeah, it's that's largely solved.
Wes Bos
Generally, these AI AIs are best at returning either JSON or markdown, but you can ask for it to return other formats as well JS well. I think JSON and markdown is is probably the best. Like, Cloudflare changed their Wrangler format from TOML to JSON, and I kinda have a feeling that I I wonder if partially the the AI being able to modify and generate those things better in JSON JS versus TOML is is part of the reason why they did that.
Scott Tolinski
Yeah. And I've been seeing a lot of, JSONL as being the way that people have been working within LLMs with JSON.
Wes Bos
Have have you been seeing that yourself? Pnpm. I know I know JSON c is with JSON with comments.
Scott Tolinski
Yeah. JSON l is basically line separated objects.
Scott Tolinski
So if you were to have just a a JavaScript object on a line, you could have just another JavaScript on an object without a line without having that. Yeah.
Scott Tolinski
Each line represents a JSON object, ideal for handling large datasets, streaming data scenarios.
Wes Bos
JSONL's efficiency makes it popular for choice with fine tuning language models. So Oh, that makes sense. Because with JSON, you'd have to wait for it to return the entire thing before you can go ahead and parse it. Right? That's a pain in the butt. So JSONL will allow you to parse the data. So maybe we'll we'll jump ahead to one of them, which is the idea of streaming. So Mhmm. These AI models are often very slow if you wanna simply send a request, sit there, and wait for the entire thing to come back. So what you have to do is you have to start streaming the data as it's coming back from the AI.
Wes Bos
And if you have stuff in there that needs to be parsed, most likely markdown or JSON, you wanna be able to display it in some way as it's coming in.
Wes Bos
You need to be able to obviously parse it. That's why sometimes when the the result is coming in, like, let's say you're streaming in a markdown table, for a split second, you might see, like, a weird half formatted markdown table, and that's because the whole table syntax hasn't come back. So with the idea of with the idea of JSON lines JS you get simply one object each time, and at least you can you know, you can safely parse that entire line
Scott Tolinski
before you go ahead and and use it. Yeah. Because that is something now that you you actually have to worry about because, yeah, like like you said, if if you're waiting for that entire JSON object to come in or you're having to figure out where the lines are or where the new objects are or where the new rows are, whatever. That makes the process of streaming data in front just way more complex and obnoxious. So for sure. Let's talk about embeddings
Wes Bos
and RAG. So this is something you'll you'll hear quite a bit about.
Wes Bos
So when you want to prompt a model with custom information, a lot of people think that you you would train a model on something. Like, let's say, for example, we have, well, almost a thousand syntax episodes, and you wanna ask it a question about a specific, in what episode did Scott do x, y, and z, or what are Scott's thoughts on Svelte five? Mhmm.
Wes Bos
The AI model doesn't know about Scott's thoughts on Solviva. Actually, it does actually, it does know what it is now.
Wes Bos
Well, they will also confidently
Scott Tolinski
know about it. Even if it doesn't, it'll just give you hallucinations about it. Yes.
Wes Bos
No. But what needs to happen is if you have custom data that is the AI model JS not trained on, you have to then provide that data as part of the prompt.
Wes Bos
And you we can't take the transcript of a thousand episodes and stuff that into the prompt and then ask it what you want. So what you need to do is you need to basically search your data and then find the pieces of data that make sense, and then you give it to the AM model. Say, given the following context, please answer the question, what does Scott think about cell five? And then you might give three or four different pieces of the the transcript.
Wes Bos
And in order to find which of those pieces of the transcripts you need to provide to the prompt, you need to first convert your data to embeddings.
Wes Bos
And text can be converted into embeddings, which is essentially just like a a large vector, array of of data, and then you can find items that are closer to it. So what you would do is you would convert your question to an embedding. That will return this array of of numbers. And then you maybe you convert, each of your episode transcripts into into embeddings or you you convert, like, three or four sentences at once into embeddings.
Wes Bos
You can get pretty complex with it. But, essentially, what you do is you say, I'm searching for this. These are the things that are these are, like, the pieces of the transcript that are close enough to it.
Wes Bos
Then you can take those three or four and then provide it to the prompt and get your answer. And and the same thing works with images as well. That's how Google similar images work.
Wes Bos
So you might take an image, convert it to an embedding, and then you take every other image in the world and convert those two embeddings.
Wes Bos
And if if images have similar, like, items inside of it, the embeddings might be might close, or if they're similar colors, they might be close to them as well.
Wes Bos
And that is really nice way to add additional context to that prompt. That's called RAG, retrieval augmented generation.
Scott Tolinski
Yeah. Alright. The next one is an MCP Vercel. And I gotta say, CJ just released an incredible video giving a deep explainer on actually building with MCP. We've done episodes on MCP here, some very recently as well. So MCP is largely a means of using AI to connect with other items via, like, an API. So, like, if you want to connect with something else via your chat or via your AI, it can use MCP as an interface to go off and and do other work, whether that is interfacing even with, like, a full on other application or another service, another server somewhere.
Scott Tolinski
So I highly recommend giving CJ's video a watch because nobody explains it quite like him in terms of, like, getting your hands dirty and really building something.
Wes Bos
Hey. Even even Figma, has a MCP server as well. If you wanna get details about a component, I was watching Adam Woth, and he was trying to figure out how to convert Figma components to Tailwind code, like, pixel perfectly. And he got pretty far using the, Figma MCP server.
Scott Tolinski
Yeah. Yeah. I've been like I mentioned, I've been using MCP in Godot to change things in the Godot interface.
Scott Tolinski
There's MCP for things like DaVinci Resolve. I mean, there's a lot of different MCP out there for interfacing with different applications.
Scott Tolinski
The Sentry MCP is the is a a great example. So Sanity, as Century .io, is the perfect place to track all of your bugs to fix them.
Scott Tolinski
Seer is a new product from Century that allows you to debug your code and find out exactly why it sucks with AI. It's amazing. Yeah. It's pretty authentic. It it figures it out for you.
Scott Tolinski
It is crazy good. But there's also a a Sanity MCP server that, again, allows you to interact with your Sentry and gain access to understanding your your code Bos and errors in your entire, everything that's happening, because Century essentially is is insight into how your application is functioning.
Scott Tolinski
You can gain so much information from interacting with the Century MCP server. So check it out at century.i0/syntax.
Wes Bos
Next up is, multimodel. So if you wanna build something, probably text is is the most common way you're gonna be getting responses, but dip into to the different models. Right? There's models out there that will allow you to send an image as part of the prompt. There's models out there that will return images or video as part of the part of the prompt. There's models out there that will transcribe audio. Right? It'll do speech to text. There's models out there that will do text to speech. I did a a really silly one, probably a year, year and a half ago Wes it took the webcam photo of me, took, and then took a photo. And then it sent that off to OpenAI and said, describe this image as if you were Ricky from Trailer Park Boys.
Wes Bos
And then I took that response, and I piped that into Eleven Labs, which was a custom model trained on Ricky from Trailer Park's voice, and then it played it back to me. Right? And, like, just like putting those two things together is just so much fun because you can obviously string these things together and then throw MCP into into the mix. And before you know it, you got Ricky from Trailer Park Boys, like, fixing your Sanity bugs or something hilarious like that.
Scott Tolinski
Yes. And and for those of you who might be listening to that and being like, what's the point of that? What's the point? The point is is that you're building things that are at least getting you interested to have some sort of output to explore and to give these things a a rip so that way you're not learning about in some dry context or something without, you know, an idea in general. And you say, I wonder if I can do this and this and this. You start connecting these things, and it's going to help you really figure out the whys and hows. So that way, when you wanna build something, practical, you you have an exact idea of how the pieces fit together.
Wes Bos
Exactly. And and, like, the multimodels as well is you'll get a very good understanding of how much does this cost. You know? There's models out there that are fast and cheap, but not very good. There's models out there that are slow and expensive, but very good. And trying them all out will give you a much better feeling for the trade offs on that for for at least two weeks before they're all deprecated and new ones come out, and you have no idea that three is better than four and everything has an o in it, and you're you're all confused.
Wes Bos
I love that. But, yeah, just man, also, like, dipping into, like, local AI stuff as Wes. We've got a note coming up, but just, like, try out transformers. Js, try out TensorFlow.
Wes Bos
If you are able to run them locally, you you don't have to pay for them. They're they're pretty dirt cheap to run by communicating with APIs. But if you wanna do it absolutely free, you wanna try some really neat stuff just locally or doing it entirely in the browser, that's kind of a fun way to do it as well. Yeah. Totally. Let's talk real quick about some libs, that you can use to code the AI. We talked we said the OpenAI SDK is probably your your one of your first interactions with talking back and forth with these different models out there.
Wes Bos
The Vercel AI SDK is really, really nice. So this is a TypeScript toolkit for building it it's kind of like if you wanna build a chat app or you wanna, like, build common stuff and be able to interact with all these different AI providers.
Wes Bos
There's just a whole bunch of handy tools in there. So if you wanna go ahead and build a little chat app, you wanna work with streaming, and then, also, you wanna integrate it with, like, React or Vue or Svelte, it's an awesome little toolkit that you need to grab. It's not a a lot of people think it's since it's from Vercel, you have to host it with Vercel and have to use React and Next. Js. That is that is not the case here.
Scott Tolinski
Yeah. It it is basically just a library for interacting with the AI SDKs themselves.
Wes Bos
It's kind of like a middleman, so that way you don't have to use the OpenAI library and the anthropic library or do just fetch calls for everything. Right? Yeah. And I I think it it it goes a little bit further than that as well. Like, it will give you Right. UI components for that will help you streaming, and it's really nice. Like, Vercel is is really good at building SDKs, so I highly recommend you check that out. Yes.
Scott Tolinski
There's also Cloudflare agents, which I have not used yet. This is one there's folks, if if you're feeling overwhelmed, my job is to use this stuff. I've picked up so many of these tools, and I still cannot find time to use all of them.
Wes Bos
Yeah. The Cloudflare agent stuff is it's funny. A lot of the Cloudflare examples use the Vercel AI SDK, which should tell you that it's not just for posting on Vercel if if Cloudflare is using it. Yeah. The, Cloudflare agents one is a little SDK that will allow you to, persist state if you wanna, like, store stuff in a database or you wanna have long running tasks, if you wanna query the web, you wanna have, synchronous workflows.
Wes Bos
They provide a whole bunch of of tools on there as well. So the, the Vercel AI SDK, well, that's more of like, something for interacting with the providers and providing UI.
Wes Bos
The agents SDK is more of a infrastructure level thing. So if you wanna schedule tasks and persist state and tell something to run, like a like a cron job every single time, it hooks into the CloudFlare infrastructure, all of their tooling that they have. So they're they have tons of examples on their GitHub as well if you wanna dip into that. But I would probably tell you, if you're just trying to build something here, you don't have to use all of these. I would probably just start with the OpenAI SDK.
Wes Bos
Just start with some calls back and forth in a Node. Js script. And then as you say, this is kind of annoying that I have to do this a thousand times. I wish there was something that made it a little bit easier, then check out the AI SDK, the Cloudflare agents. And then there's there's also, like, Langchain as well, which will, have you used Langchain in the past there, Scott? It's been about a year for me.
Scott Tolinski
I haven't used it, especially since well, I've used it in the past, but I have not used it since their website has undergone a major glow up, I Wes, you could say. It's very purple looking now. So Langchain allows you to
Wes Bos
chain together, different AI stuff. So you're able to, like like, ingest a whole bunch of documents and then send them off to one thing. So you end up just, like, clicking together a lot of these things Yeah.
Wes Bos
Wes you're you're building an AI application.
Wes Bos
And lang chain is a a toolkit for for doing that as well. I haven't found my there's a there's a JavaScript version and a Python version, which is really nice, but I haven't found myself needing that, in quite a while Wes I I feel like I can get away with just using the the previous libraries we talked about. That's what I'm saying too. Yeah. And there's also transformers.
Scott Tolinski
Js.
Scott Tolinski
It's basically, allows you to interact with Hugging Face, which Hugging Face is one of those I don't know how you feel about Hugging Face. I love I love it. It is intimidating.
Scott Tolinski
This is one of those things to me that if I was a newbie or a skeptic coming into AI and I were to go to Hugging Face, I would feel intimidated by it because there's so much stuff. And there's so much good stuff on here, and it does a great job of giving you demos and examples and how to use these things. But in the same regard, it's a lot of words. And all of a sudden, you're feeling like, wow. There's a ton of stuff in here that I might not understand, how so many things exist here, how so many people are using this. But, basically, it it allows you to use all kinds of AI stuff, from different models to, different datasets.
Scott Tolinski
You you can integrate these things into your application with transformers. Js, or you can just bounce around hugging face and give some of them a try to see if they are the type of thing you wanna use.
Wes Bos
Yeah. So transformers.
Wes Bos
Js allows you to use local AI models Yes. In JavaScript runtimes. Meaning that if you're in Node. Js, you're in Deno, you're in the browser, you want to be running an AI Node. Because these these big models, like OpenAI, they're good they're very good at lots of stuff. But sometimes that is too expensive or too large to do it, and you want a very specific model that's, like, very good at doing one thing. So Or you just wanna be running it locally.
Wes Bos
You know? Yeah. Or you or you just wanna be able to run it locally because you don't you don't wanna, have to send that off to to the cloud. Right? So they do, like, natural language processing, vision depth estimation, image segmentation.
Wes Bos
You Node? Like, if you wanna be able to painting.
Wes Bos
Yeah. If you wanna yeah. If you wanted to build something like Photoshop where you you draw over something and then it tries to fill it in, you could reach for one of their computer vision models in there, or, like, I've done it in the past where you can try to filter out bad messages from people. You know? There's toxicity detection in there.
Wes Bos
The whole AI world is so deep on very specific models that are for specific tasks. Mhmm. And it's absolutely nuts how deep all of this goes. So certainly check out I'm I'm such a huge fan of transformers. Js. I've built so many things with it. Even just like smile detection.
Wes Bos
Right. If Wes wanted to feed it, I built something that it took, I don't know, 6,000 screenshots from an image and fed it through it and and tried to figure out which one had the largest smile in or which one had the most scared face in and filter it on. Like, that would cost a lot of money to send 3,000 images off. And that would be extremely slow as well to have to upload 3,000, high resolution screenshots to an external service.
Scott Tolinski
I I will say that if you're the type of person who wants to build fun things and and, you know, explore a little bit, transformers, JS, and explore a little bit, transformers, JS, and via Hugging Face, JS a great way to do so. I I think that, like you mentioned, all those things that you you you said are are a great way to to get your hands dirty with some interesting, things. So I I guess that leads us to some process things we've mentioned throughout this episode. But, like, I think one of the biggest things that I can suggest to people is to explore.
Scott Tolinski
You Node, we mentioned that there's all these, like, fun and interesting things.
Scott Tolinski
I do think that if you're the type of person sitting on the sidelines and saying, I don't need that stuff, I I I think you need to explore your curiosity a little bit because we are all about making cool things. We're about exploring technology.
Scott Tolinski
We're about building things. And, like, if you leave the word AI out of it, and I were to tell you JS a developer that you could build something that detected a smile and took a screenshot when there was a smile, or I could build something that, you know, did this or that really fascinating thing, like generated in an image or something like that. If you leave the entire big AI,
Wes Bos
scary cloud out of it for some people Just call it machine learning. It sounds so much more scientific and sick.
Scott Tolinski
JS that not exciting? That is exciting that you can build that kind of stuff. And and, like, who would have told me five years ago, ten years ago that I'd be able to build some of this stuff or do some of this stuff, I would have been like, that is incredible. There's so many neat things I wanna do with these ideas.
Scott Tolinski
So explore. Don't be afraid to go out there. Explore. If it breaks, if it doesn't work, toss it out. I have a directory on my computer called temp inside of my sites folder. It is used for a scratch pad websites. I throw up together demos. Some of them work. Some of them don't. The cool thing about my temp folder is it automatically deletes itself. So because of that, like, I I can just toss stuff in there. And if I ever actually like the process that's happening, I can move it into a real project or whatever. Otherwise, it's just scratch. It's just exploration.
Scott Tolinski
And I think that is an important, feature that I think some of us lose because we we really like we take in the the the I don't know if it was, like, the social context or, like, you know, we latch on There's a lot of awful stuff around it. You know? Like, there's Yes.
Wes Bos
The they're stealing content. It uses a ton of energy. You know? The whales are dying.
Wes Bos
There's there's a lot of awful stuff around AI, and I I I don't wanna discount that. But I do think that a lot there's a lot of benefits of of it as well, and I do think that this industry is certainly changing quite a bit.
Wes Bos
So if you're a bit of a a skeptic, just know that, we understand, but this is this is kind of exciting stuff. And you can build some really neat stuff. I especially if you're, like, at all a little bit burned out, Build some fun stuff. So build some Build some fun stuff. Pokemon indexer thing, and and Wes you can go ahead with it. Turn off the, like, people generating the, like, dogs that are warp are playing poker or whatever.
Wes Bos
Just turn off all that garbage and and build something. Do that. If that if that's what scratches
Scott Tolinski
your edge, if that's what scratches the ear behind the edge, itch behind the ear, then do the dog's thing. That's fine too.
Scott Tolinski
Also, another tip I have is if you're getting started with these things, especially for the first or second time or you failed at them in the past, use tech that you already know because you can tell if it's generating Node. Like, if you're working with, with AI tooling, it it you can tell if it's generating code that you want to actually use because you know the code. You know what good code looks like. And, therefore, if you're choosing to accept or bring in code into your code Bos from AI, you're gonna know a lot better and faster if it's it's code you actually want to have, if it's code that you know and understand. So use tech that you already know if possible here.
Wes Bos
Alright. That's all we have for you today. We got no sick picks for you today because we are recording ahead for the summer, and I am I am out. I'm flat out of sick picks. So We can only buy so many things here.
Scott Tolinski
We're gonna go broke trying to find sick picks.
Wes Bos
No sick pick. But down in the comments below, let us know your sick pick. I'd love to to hear it. And, is that that's all you got today, Scott? That's all I got. Alright. Thanks for tuning in. We will catch you later. Peace.
Wes Bos
Peace.