Skip to main content
921

July 21st, 2025 ×

AI Coding Roadmap for Newbies (And Skeptics)

or
Topic 0 00:00

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.

Share