The intent of this post is simply to explain the basics of Socket.IO, but with just a simple JavaScript background, there may be a few hurdles to jump over first, so this will be more of a "hand-holding" exercise.
Cloud9
Cloud9, simply put, is a web-based IDE for JavaScript. Go over there. Sign up. It's free, don't worry.
Also, if you want to get super adventurous, Cloud9 is open source and available over on
GitHub. I'm not going to install it on my own, but just know that's a possibility.
Now, create a new project. Name it anything. Just make sure you make it a Git project. Now, once that's done, let's jump in and start editing! But, I don't want to bore you with the drawn out stuff... so, why not just copy the code I already have?
Git
Git is another version control system. I like Git. It is a bit difficult to grasp at first, but it feels "right". Instead of having copies of files for branches and tags, like SVN does, Git has it's own nice little thing it does. Everything is just the branch you're working on. In my opinion, at least, this leads one to adopt a process of locally branching files. Branches everywhere.
Anyway, we're going to pull the current codebase from Git. So click in the console window down at the bottom of your Cloud9 project and grab it. Use the following commands to do so:
git remote add origin https://github.com/tyllyn/js-notifications.git
git pull origin master
I don't believe Cloud9 refreshes the files automatically (at least it didn't while writing this up), so refresh the page! Bam! You have files there! What exactly did we do, though. Well, the first command sets up "origin" as a remote repository - the one I have set up over on GitHub with the code we're working with. The next statement pulled the "master" branch from "origin" into our local copy. "Master" is the main branch in Git, pretty much how "trunk" is the main branch in SVN.
There's a lot more to Git, but this isn't an exercise on the specifics of it. You can always learn more on the
Git website.
node.js
I have a simple web-server set up in that repo, so let's add a new run configuration, just like this:
And click run. Your console at the bottom will now show a URL. Click this. And look, it's that file we're hosting!
socket.io
socket.io eases the communication between a server and a client. We're going to use this in one its most simplest forms - for a chat server. As you set up your run configuration for the web-server, set one up for the "svr-socket-io.js" file. And run it.
Whoa, you might have got an error about how socket.io broke into your house and stole your wife (I'm not a great reader, but I'm assuming that's what it says). This is because socket.io is not installed just yet. Trying typing these into the console, if so:
npm install socket.io
npm install socket.io-client
Anyway, I'll leave the rest of the debugging up to you. Enjoy your simple chat server, now. :)
No comments:
Post a Comment