I registered the Socket.IO channel on Freenode right after I started the project. Even though it was super easy to start, we still had a major problem: onboarding new people to IRC.
It’s hard to create a welcoming community around something fundamentally difficult to use. It lacks basic features like the ability to receive messages offline without setting up a server.
One of the best decisions for the project was starting a public Slack community around it instead. For the uninitiated, it’s a cloud chat service with first-class mobile support and a polished mobile and desktop experience, with lots of great features.
I wrote a quick integration between our website and Slack to show how many users we had online, and to automate the process of inviting new ones.
In less than two weeks, we already had a community of more than 400 users. Not only did it dramatically outpace the growth rate of our IRC server, but it fostered a much stronger sense of community. I’ve already seen a great exchange of technical knowledge, new ideas and even business opportunities for those involved.
A lot of people reached out to ask how we’d managed the integration, so I’m open sourcing a little project that will help you do it efficiently.
It’s called slackin and it will do three things for you:
- Set up a landing page to invite users
-
Give you an HTML badge with inline invitation capabilities
-
Give you a SVG badge for your GitHub projects
A few technical highlights of the project:
- The presence counts update in realtime. It sets clear expectations of the level of activity users are going to find upon joining your channel(s).
-
The badge uses an interesting technique I first saw implemented by Facebook for their “Message” widget button. It consists of a script that injects an iframe, and communicates with it to detect interaction. When clicked, it injects another iframe for the inline dialog and positions it accordingly. This guarantees near-perfect isolation of style and behavior across all browsers.
Embedding the badge then becomes as easy as copy-pasting the script:
<script async defer src="slackin.js">