Install Project Dependencies

[00:00:00]
>> Brian Holt: We are gonna build our first MCP server and you're gonna find out very quickly that this is actually much more simple than I anticipated, right? I don't know about you. It's like one of those things I came into it thinking I'm about to summit this mountain of complexity.

[00:00:15]
And then you get into it like, what the hell was this? Why was I so afraid of this? Containers was definitely one of those as well, where I came in thinking I have to put on my Linux hacker hat and had to enter the matrix. In reality, it was just like a couple of commands that you run and you're like, okay.

[00:00:28]
I guess that's what a container is, right? It's a zip and a couple of Linux commands. Same thing here. It's kind of just a dumb server. That's really what an MCP server is. It seems more complicated than it should be. So there are three ways currently to make an MCP server.

[00:00:47]
There is the old way, which is not. That one is still useful. You still use the old way, which is the standard IO way of doing it. There is the SSE way, which was introduced in November of 2024 and deprecated in March of 2025. So had a very short life, but they're still around.

[00:01:11]
There's a bunch of them that still exist. We still support ours at Neon, so I will tell you what they are. But we're not going to build one today because I don't really see the point. Because then we came out with streamable HTTP which is like the. I have a remote MCP server, so I want to call Neon remotely, as opposed to running like Neon's MCP server locally.

[00:01:31]
We'll build one of those as well. So we keep the standard IOA one around because sometimes you still want something to happen locally. If you had a MCP server that you wanted to create and delete files, for example, you can't do that remotely. Something has to be running on your computer to do that, has privileges to be able to do that, which is why this will never go away.

[00:01:52]
Or at least some version of a local MCP server will never go away. Does that make sense? If you're not familiar with standard IO, that's like a Linux term of it's how things get input into a Linux process. It's how things come out of it. It's how errors are shown.

[00:02:14]
There is a Linux course by a dashing gentleman on frontend Masters that you can also catch if you're interested in learning more about that. It's from me, if that was not so obvious. Complete intro to Linux and the command line. And we talk a lot about standard IO, so that actually would be very helpful in this particular case.

[00:02:36]
But in theory, it's really just like you are passing messages into a process and you're getting information back out of it. That's the whole gist of what standard IO means here. So you can kind of treat it like a web server. I think most of us, if you're joining us on frontend Masters, learning about MCP servers, you probably have used some sort of web server before.

[00:02:59]
Whether that's Next JS or Express JS or Fast API or something like that. Same idea. But instead of having an HTTP client connect, send a message and then disconnect, this is just going to be like passing things into a process and getting them back out of it via Linux piping instead of using HTTP.

[00:03:22]
Does that make sense? You'll see here in just a second. We're gonna be using this SDK here called @modelcontextprotocol. Obviously that's the official one /SDK. I will just warn you in advance, this was not packaged by a Node person, so you kind of have to reach directly into it and find the correct JavaScript files to import.

[00:03:45]
So I'm sure they'll fix this someday. Again, it's all open source, so go fix it yourselves. You can see I'm complaining about it and I haven't fixed it myself. So yeah, I'm in a glass house and I'm definitely casting stones. So all this to say, let's go make some MCP server stuff.

[00:04:05]
So open your terminal here. I'm just gonna go to my desktop. You don't have to do this in the terminal as well. You can just create a folder on your desktop. We'll call it MyMCP. And open this in your favorite coding apparatus. Mine's gonna be VS code because I'm broken.

[00:04:29]
Minimize that one. I don't want agent mode at the moment. You could totally build this with a cursor or something like that. I have no problem with that. Again, the code here is not terribly interesting. So let's go ahead. And we're gonna npm init. I'm just gonna put -Y, which just means don't ask me any questions, just do it.

[00:04:56]
Actually, you know what? This would be a good way. The way this is receiving all this information, this would be considered standard IO. The fact that I'm hitting enter here. That's all going in through standard IO at the moment. Too many temp questions, okay, now I'm going to put -Y.

[00:05:14]
There we go. So now I have a package JSON I'm going to npm install. We're going to do odelcontext protocol SDK and I'm going to pin this version to one. I think I have 16 in my course. I think 18 is the most recent version. Let's YOLO and try 18.

[00:05:48]
Nope, 16. Okay, 16. By the time that you watch this, I guarantee you they will have a new version of this out. But it'll break all my code, right? So if you're watching this, just follow along with 1.16 and then ask your agent to update it to to the most recent version.

[00:06:08]
That's probably what I would do. Okay, so now if we look at our. We have a package package lock and some node modules. And now we can open this in VS code and get started with it. I'm going to create a new file here and I'm just going to call it something like MCP js not a typescript.

[00:06:34]
Course we're not going to write this in typescript, but by all means, agents do really well with TypeScript. So if you are working with an agent, by all means, you probably should be using TypeScript. But I find I just confused too many people in these courses otherwise. All right, we're going to import a couple of things up here at the top.

[00:06:51]
We're going to McpServer, From. This is going to be annoying. Model Context Protocol SDK server MCP JS I told you this was not packaged by a node person. import (StdIoServerTransport) from @modelcontextprotocol/sdk/server. Yeah, that one actually is correct. sdk/server/stdio.js, we have to npm install ZOD as well. So you're going to import ( z ) from Zod.

[00:07:40]
If you're not familiar with Zod, Zod is a very common package for basically defining what type of something is. And it's like a test to make sure. It's like this has to be an integer, and if it's not an integer, then you're going to throw an error, right?

[00:07:58]
If you ever used Joy, that was like a previous version of this. Zod is just like the more common one, and it's one that the MCP server community has kind of adopted full sail. Yeah, who else? OpenAI was like one of the first ones to like really adopt Zod.

[00:08:17]
So we have to go install Zod as well. We'll just come back to here. And we're also going to npm install ZOD @ that version that I grabbed, which is 3.25.76. And probably most importantly here, the MCP server package depends on Zod, right? Like, you have to have it.