Heads up! To view this whole video, sign in with your Courses Plus account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
The Code Racer server is built using Node.js, a JavaScript environment that is suited for servers that need to relay a lot of information very quickly. Because code racer is a game, Node.js is an excellent choice, since most of the server's responsibility is passing information between the players in the game.
The first step is to get Node.js installed, along with some other basic foundations, like NPM, a package manager that will allow us to include other useful libraries. In this video we install Node.js and run our first Node.js script.
Now, Code Racer is a very complex project,
0:00
and that means we don't have time to do all of the different parts
0:02
of Code Racer in these videos.
0:04
But what we will do is create a project that has the major components of Code Racer
0:06
and see how to build it piece by piece with Node.js,
0:10
Express, and Socket.io.
0:13
Let's get started.
0:15
[? Music ?]
0:17
The first thing that we need to do on this project is create
0:22
a basic skeleton application.
0:25
This will be the application that we're going to get running
0:28
as fast as possible so that
0:31
the developers have something to work off of
0:34
as well as having the designers be able to create the templates
0:36
directly in the application.
0:39
Now, it's going to be a little while before we actually need to integrate
0:41
the designs from the designers into our real application.
0:44
But the sooner we get the environment for them to actually code
0:48
real-live templates in, the better, so that's what we want to do right now
0:51
is get a basic Node server up and running
0:54
and some basic templates that our designers can work with
0:57
and experiment with.
1:00
[nodejs.org]
1:02
The main technologies we're going to be working with are Node.js,
1:04
and to install this, we'll just go to nodejs.org,
1:06
and we can use the Macintosh installer.
1:09
I've actually installed it via Homebrew,
1:12
which is the package manager, which you can read about down here.
1:14
But any of these options will get a Node installation up and running fairly quickly.
1:18
So, we can see that I've installed it, and we can actually check on our Node version
1:23
by typing in "node -v."
1:26
And we'll see we're running 0.6.7, which is a fairly recent release for us.
1:28
Now obviously, depending on when you download and install Node,
1:34
you'll get a different version, but 0.6.7 is what we'll be using right now.
1:37
So notice the programming environment we'll be using,
1:41
but we'll also be using another tool called NPM,
1:44
and as of now, NPM is actually installed alongside of Node,
1:47
so if we type in "npm -v" we'll see we get
1:51
an NPM version of 1.1.0-beta-10.
1:55
NPM is the tool we'll be using to manage the dependencies in our projects
1:58
to bring in outside libraries as well as to manage the version of those libraries
2:01
and even just keep track of the meta information of our application.
2:06
You can learn more at npmjs.org.
2:10
We'll also be working in CoffeeScript, which is a small language
2:13
built on top of JavaScript that compiles to JavaScript.
2:16
It has much of the same semantics but a slightly different syntax.
2:20
Typically, CoffeeScript tends to be a little bit smaller
2:24
in the amount of characters used to express certain objects.
2:28
If you want to learn more about CoffeeScript and the type of JavaScript it creates,
2:32
you can learn more at coffeescript.org.
2:35
We'll be using a couple of libraries as we go along.
2:38
The first one we're going to encounter is called Express,
2:41
and this is a small web application framework for Node.js
2:43
that allows us to easily create different pages
2:46
and some different interactions on our site.
2:49
A little bit later on we'll be learning about Socket.io or Socket IO,
2:51
which is a library for using web sockets.
2:56
And this will allow us to create an application
2:59
that runs in sort of real time,
3:01
meaning that the server can actually push data down to each of the players
3:04
so all of them can keep their state in sync.
3:08
As one player does one thing, it will be communicated instantly
3:10
to all of the other players, which is what we want for our game.
3:13
This is the main reason we're choosing Node.js for our game application
3:16
because the support for sockets in Socket.io is pretty good.
3:20
The architecture of Node lends itself well to using sockets,
3:25
which require a lot of connections to be left open at once,
3:28
even though they're going to be mostly idle.
3:32
This is where the event-based Node.js is the strongest.
3:34
What I have right now is an empty folder called Code Racer,
3:37
and this is where all of our code will be, and I have a terminal window open
3:41
to that directory.
3:44
I also have my editor looking at this directory right here.
3:46
This is our Code Racer directory, and right now there is nothing in it.
3:49
The first thing I want to do is set up our project.
3:52
Now, there's actually a couple of dependencies I want to install
3:54
globally on my system via NPM.
3:57
These 2 packages are CoffeeScript, which obviously allows us
3:59
to run CoffeeScript files directly, and Supervisor,
4:02
which is a way for us to run our application,
4:06
but any time the application crashes, Supervisor will restart it.
4:08
Also, any time we save a file, Supervisor will again restart our application.
4:12
This is great for development since you can simply save a file
4:17
and immediately go to your server without having to stop and start your server
4:20
to reload your code changes.
4:24
We're going to install Supervisor and CoffeeScript via NPM.
4:26
I'm going to type "npm install coffee-script"
4:30
as well as "supervisor."
4:36
And I'm going to pass it the -g flag for global.
4:40
This will install it to our global environment
4:43
instead of installing it as a dependency of this particular application.
4:46
We got a little bit of an error here, and that's because
4:53
the way this computer is set up, we don't have the permissions
4:55
in the right place for us to simply run this command,
4:58
so instead I'll have to write "sudo,"
5:01
and I'm going to use ! ! to run sudo on the last application.
5:05
And when I hit Enter here, you can see that my shell has brought up
5:11
"sudo npm install coffee-script supervisor -g."
5:14
When I hit Enter, we'll now run it with sudo,
5:19
which will actually run it as a privileged user,
5:21
which means we should be able to install into the directories
5:24
that we didn't have access to as our normal user.
5:27
I'll just type in my password,
5:31
and everything is running just fine.
5:36
If I type in "coffee -v," you can see we have a CoffeeScript version,
5:39
so that means we have installed it properly.
5:44
The next step for us is to initialize a new NPM package.
5:46
This will allow us to declare the dependencies for our application
5:51
and manage its version through NPM.
5:55
This is very easy to do.
5:58
We'll type in "npm init,"
6:00
and now it's going to interactively prompt us for some information.
6:03
Right now we'll call our package name Code Racer.
6:06
We'll say its description is "An awesome game."
6:09
And all of this stuff besides the package name is optional
6:13
and not really necessary for us to worry about right now.
6:16
We'll just enter through it.
6:21
It confirms "Is this okay?"
6:23
We'll say yes.
6:25
And now if we go to our editor here,
6:27
we'll see there is now a package.json file,
6:30
and our package.json file includes the information
6:33
that we just put in through the interactive prompt.
6:35
But what we're going to be worrying about here is
6:38
the dependencies object here, and this is where we'll be defining
6:40
the dependencies that we're going to be using in our application.
6:43
For instance, things like Express.
6:47
The way we define our dependencies is
6:49
we will give it key value pairs where a key
6:51
is the name of the package we want to use
6:53
and the value is going to be a version string.
6:56
Right now, I want to include CoffeeScript
6:59
since we'll be writing our project in CoffeeScript.
7:01
So write "coffee-script,"
7:04
and for its version string, I'm just going to use * for right now
7:07
because I don't know what the latest version of CoffeeScript is.
7:10
However, later on we'll put a more specific version number in here
7:13
to lock it down so we have a little bit more control
7:15
over what version of each package is compatible
7:19
with our Code Racer package.
7:22
And the next one I'm going to want to do is to install Express.
7:24
And that's just using Express, and again,
7:29
we'll use the wild card version here.
7:32
We'll be coming back to this file every time we need a new dependency
7:34
for our application, but let's just save this right now.
7:37
So, our NPM command will always be working off of this package.json file.
7:41
We saw how to use the npm init command to
7:45
create our package.json, but we'll see another command
7:48
called install.
7:51
We'll type in "npm install."
7:53
And what this will do is it will read the package.json file,
7:55
grab all the packages and install them
7:58
into a local directory called "node modules."
8:00
So, if we hit Enter, we can see it's going out to get some information,
8:02
grab our packages, and this will include
8:06
all of the sub dependencies of our packages.
8:09
For instance, Express itself depends on qs, mime, mkdirp and connect.
8:12
NPM manages all those dependencies for us
8:18
and makes them available in our project.
8:20
So, if we were to go into our editor here,
8:23
we'll see we have a new directory called "node_modules."
8:27
And this is where all of our modules have been installed.
8:30
The way Node works when looking for dependencies
8:34
when we use the require statement is it will try to find
8:36
Node modules folders in the directory that it's executing in.
8:39
Otherwise it will try to find any globally installed modules,
8:43
like we had globally installed CoffeeScript,
8:46
and then it will fail if it can't find those packages in any of those directories.
8:48
Let's create what will be our server file.
8:52
We'll create a new file, and I'm going to save it
8:54
as server.coffee.
8:58
And I'm going to just change our indentation here to 2 spaces.
9:05
Let's just do a very simple file, and let's just create a Hello world file
9:10
for our server.coffee right now.
9:14
What we'll do is console.log "Hello."
9:16
And let's go to our terminal and see if we can run this file.
9:22
You need to sign up for Treehouse in order to download course files.
Sign up