Recently at work, I have been asked to interview some candidates that would potentially join the team that I am part of. As part of any technical interview for a software development position, a list of questions allows you to get an idea of the level of knowledge that the candidate has. Additionally, there is a growing trend of conducting live coding or fizzbuzz exercises, there are ongoing debates about the usefulness or fairness of doing such exercises but personally I feel that is it is a good way to asses the ability that the candidate has to find the solution for a problem while handling the pressure of an interview.
That being said, I do believe that the exercise should be simple enough so it is possible for the right candidate to be successful, for me the goal is get an idea of the way of thinking of the interviewed rather than marking it impossible to solve in the given time. Being that most of us software engineers use Google very frequently to look up documentation and even find solutions for the specific problem we are facing in Stack Overflow, it seems unfair to expect the candidate to know every language or framework API by heart. On the other hand, if the candidate is allowed to use Google while completing the exercise, there is a possibility (more so if you happen to choose a very common exercise) that he or she would look for the actual answer of the assignment instead of looking up tools for solving it.
I did some research and found some very useful collaboration tools that allow you to share a document and work with other participants in the same code. However, I could not find any that gives you an indication when participants go away from the browser tab, which is very handy if you are conducting an interview. This gave me the idea to create such a tool myself.
I started by looking for a code editor library, Ace was the one that I chose, this library is also used by Github, codeacademy, Wikipedia and many more. It supports syntax highlighting for different programming languages out of the box, as well as many different themes that look pretty good.
After finding a proper code editor, it is only a matter of hooking everything up and connecting via Web Sockets to allow every key stroke to be sent to all participants. The client side of this project I implemented using ReactJS along with Redux and Socket.io for the Web Sockets implementation. For the server side, I created a rest API using Node.js, Express.js framework, mongoose as the ORM to connect to the mongodb database and socket.io to establish the connection with the client.
Additionally, I thought it would be really useful for users to be able to execute the code as well. In order to achieve this in the safest way possible, I needed to find a way of putting this potentially malicious code in a sandbox, so did quite a bit of research and I found a blog post by Harry Marr in which he writes about using Docker containers for precisely this same purpose.
The result its a pretty handy tool that allows you to collaborate in real time with multiple participants, with a simple chat that shows you the status of the user (the user will be shown as “away” when he or she has gone away from the window or browser tab). Participants can also run the code allowing every one to see the result, at the time, it supports Javascript (node.js), PHP, Ruby, Python and Perl.
Try it at:
http://codigo.live
Source code at:
https://github.com/luisbravoa/codigo.live