11
Apr 11

Sending your clients to purgatory (a node.js/socket.io tutorial)

Updated As has been pointed out, sending the username and password hash over to the client is not the most secure thing you can do. I wholeheartedly agree. Please do not do this on anything for real-ish. Treat this tutorial as a simple demo of how to isolate a connection until you give it some sort of approval. A much better approach would be to use a one-time throw away key or create a salted hash using the incoming client’s IP address. Or probably a million other things. The concept of isolating a connection to socket.io within a closure still applies.

Now back to your regularly scheduled programming:

One of the problems I have had with nodechat.js is that using sessions to handle the transition of authenticated users between express and socket.io has always been somewhat finicky.

Nodechat.js and the previous nodechat-tutorials have used sessions to manage this transition by storing a username and password in the session after initial login and making it available to the socket.io listener on new connections and during each message. While adequate most of the time, this method never worked correctly with all the various socket.io transports and it seemed like clients would frequently get stuck when reconnecting, requiring them to reload the page to get back into nodechat.js.

I now have a pretty decent way to address this issue and I am going to share it with you. A little technique I came up with that I call Purgatory…

Continue reading →

27
Mar 11

Nodechat.js continued – authentication, profiles, ponies, and a meaner socket.io

As promised, here is a follow up tutorial on the node.js/socket.io/backbone.js/express/connect/jade/redis stack that powers nodechat.js.

The first nodechat.js tutorial introduced some fancy ideas, like using backbone.js on the server and streaming models over socket.io which is all well and great, but it left some of the more practical questions unanswered. Issues like coordinating authentication between express/connect and socket.io and creating, storing, and retrieving user profiles, are less sexy, but still quite important for real world use. So that is what the next this tutorial will look at. Practical stuff. Besides, everything is more fun when you do it in node, right?

I will also sprinkle you with some other neat wisdom nuggets along the way. If you want.

Continue reading →

14
Mar 11

nodechat achieves glorious internet notoriety

Two weeks ago, I released a tutorial on using node.js, backbone.js, socket.io, and redis to make a simple realtime chat app. Someone posted it to Hacker News and it made it the front page. fzysqr.com enjoyed brief fame and notoriety. The number one complaint (other than my awesome user interface) was that there was no demo. So without thinking (at all) I threw the code up on a Joyent no.de (Joyent are a bunch of node-ninjas and no.de is the best thing since ponies, check them out) and posted the link on HN and on fzysqr.com. Whups.

I have learned a few things over the last couple weeks. Good “lessons” I will share with you now:

  1. Don’t actually put your crappy code online, publicly, for abuse. It will crash.
  2. Sanitize inputs for your crappy demo code before you try to run it (in violation of rule number 1). XSS attacks will significantly lessen the quality of the experience you are trying to provide your audience.
  3. Check for nulls. Everywhere. The internet is a cruel place and people are mean. They will look through your crappy demo code and figure out how to crash your crappy demo.
  4. Running production-ish code on node.js requires a different mindset. If anything takes the process down, it is down for everyone. Coming from a typical web-development background, it took much crashing before I realized this. Writing robust, fault tolerant code is CRITICAL if you are hosting it on node.js
  5. If you write a silly chat room and hang out it in all day, you will meet many interesting people.
  6. There is a ton of interest in node.js. People are really excited to work with this stack.

People seemed to enjoy nodechat.js so I have been hacking out new features as fast as I can. Things that have changed since the demo:

  • Authentication: reserve your username now, before they are all gone!
  • Rightside up chat
  • Mashtags: like #hashtags but #mashier
  • Users online: now people are more than numbers
  • Direct messages: now you can tell @jslatts how much you hate the UI in private
  • Notifications: blinky tab thingies
  • Linkify URLS / em / bold
  • Flood control (yes, that one guy who knows who he is, I am thinking of you)
  • Works in Firefox (sorry FF, I don’t test in you)
  • Still Fun Chat Messages only

As always, you can find the latest code at github.

I am working on a follow up tutorial to cover authentication and some other fun tidbits I have discovered in the last couple weeks. Stay tuned.

11
Mar 11

pgrep – Using PowerShell to fill the Windows grep void. Of pain.

I use windows at work. I hate the windows command line. I REALLY miss grep. PowerShell has Select-String which kinda/almost/sorta does grep things. Here is how you would actually use it in a grepish way:

Get-ChildItem -recurse -include *.txt | Select-String -CaseSensitive "SomeString"

Recursively searches all text files in the current directory tree for SomeString with case sensitivity.

This sucks to type. So let’s alias it to a function.

function pgrep { param([string]$search, [string]$inc) Get-ChildItem -recurse -include $inc | Select-String -CaseSensitive $search }

Now we can:

pgrep SomeStringToSearch *.txt

Then to really make it magical, add the function alias to your PowerShell Profile and you can almost dull the pain of not having proper command line tools.

07
Mar 11

Debugging in Node.js

Is as easy as:

  1. npm install node-inspector
  2. node-inspector &
  3. chrome to http://localhost:8080/debug
28
Feb 11

nodechat.js – Using node.js, backbone.js, socket.io, and redis to make a real time chat app

UPDATE 5 – This tutorial refers to intermediate builds of nodechat, referenced by tags. These will not work quite right due to breaking changes in Socket.io 0.8.X. The latest commit in Github has been updated to be fully functional and I will continue to maintain it as long as there is interest. I do not plan to fix the intermediate tags, so please keep that in mind as you go.

UPDATE 4 – The hosted instance of nodechat is no longer. The last round of changes from socket.io and Google Chrome have broken it and I am not particularly interested in fixing it. IRC does the multi-user realtime chat job quite nicely!

UPDATE 3 – There is now a follow up tutorial dealing with user profiles and socket.io authentication: Nodechat.js continued – authentication, profiles, ponies, and a meaner socket.io.

UPDATE 2Joyent has kindly give me a permanent home for nodechat.js: http://nodechat.no.de/. I made some more FUN minor improvements. Continue being ware.

UPDATE – For the fun of it, here is the demo code hosted on a Joyent no.de smart machine: http://nodechat.no.de/ . Have fun. Beware.

Sorry folks. I know it has been awhile since I have posted anything. Even longer since I have posted something worth reading. Life, busy, etc. No excuses.

I’ll be better from now on, I promise. To start, here is something so cool it hurts my brain. I present nodechat.js!

nodechat.js is a simple, realtime chat app that leverages node.js, backbone.js, socket.IO, and redis. I wrote it as an exercise and I am sharing it because there are relatively few working examples using all these pieces together.

Continue reading →

12
Dec 10

VimRepressed

In my September post about my blogging workflow, I mentioned that I was using a modified version of Vimpress. I decided to post it on github so anyone who is interested can check it out or change it. Check it out here: VimRepressed

I don’t really have any specific plans to update it. Let me know if you have any suggestions for potential features!

26
Nov 10

Fake your Chrome user agent to look like an iOS device

Another quick one: fake your user agent in Chrome to look like the latest and greatest iOS iPhone:

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome 
    -user-agent="Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_2_1 like Mac OS X; en-us) 
    AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8C148 Safari/6533.18.5"

This is for a mac, but the same idea works on a PC, just fire up Chrome from the command line with the –user-agent flag.

26
Nov 10

iPhone application icons for your site

I finally got around to creating an application icon for fzysqr.com. It is super easy:

  1. Create a 114px x 114px PNG (retina display compatible).
  2. Upload it to your website somewhere it can be accessed (http://fzysqr.com/images/apple-touch-icon.png in my example).
  3. Create a link in your site header:

    <link rel="apple-touch-icon" href="/images/apple-touch-icon.png"/>
    
  4. If you want to keep iOS from automatically glossifying your icon, use rel=”apple-touch-icon-precomposed” instead.

13
Nov 10

New look for fzysqr

If you are visiting today, you might notice that things look a bit different around here. I finally got around to rolling my own theme for WordPress. I wanted to get away from the noise and the clutter of pretty much every WordPress theme I have ever seen and get back to basic usability and readability.

It should be HTML5 compliant (according to the W3C Markup Validator so please let me know if you come across any issues in Chrome, Safari, or Firefox. If you come across any issues in Internet Explorer (any version), don’t. When IE cares about web standards, I’ll care about IE.

You may also notice that comments have been disabled. I am tired of fighting the battle against spam. I still welcome your questions, insights, or complaints. Please send them directly to me at comments@fzysqr.com.