Code sharing

Posted on 2019-10-27 Disqus:

As part of a shared coding demo I’m hoping to deliver in the near future I decided to document some of the tooling that seems to work pretty well for me and how I’m using it!

ttyd

The ttyd tool allows for sharing a terminal session over a web browser, and works fantastically! The github repository for ttyd is https://github.com/tsl0922/ttyd.

Installation

Grab the binary releases from the release page and de-compress the archive
Move the binary to a path it can be ran from and ensure it is named ttyd

Usage

The usage of ttyd is well explained on the github page, however for quick usage it’s typically ttyd -p <port num> [cmd]. Any user can now connect to the IP address where ttyd is running (on the specified port) and they will instantly access the program specified at the end of the command [cmd].

Shared session with ttyd

One of the requirements of what I want to do is to have all users share the same session, and for that session to be read-only. Luckily we can easily do this with an additional utility called screen.

Create a shared screen session

The first thing we need to do is to create our shared screen session and give it a name, which we can do with the following command:

screen -S ttyd

This will create our screen session that we’ve named ttyd and can be easily viewed with screen -ls.

Read-only ttyd sessions

The behaviour that we went from when a user connects to ttyd in their browser is to connect and view the one master share and have it read-only. We can accomplish this with using the screen -x <session> command and starting ttyd in read-only mode. The following command will start ttyd on a particular port, in read-only mode -R and when a client connects it will connect to the master screen session.

ttyd -R -p <port num> screen -x ttyd.

Keppler

Keppler is a fantastic tool for allowing people to remotely see code updates in a very friendly UI, along with browsing the differences as the code is modified. The github repository for keppler is https://github.com/brunosimon/keppler

To make life easier for myself, i’ve wrapped the usage of keppler in a docker container so I can just move to a directory where I want to expose what I’m working on and just run an alias keppler!

Fixes to file watchers

On Linux the below is required so that keppler wont panic when trying to monitor source code files changing.

1
2
3

echo fs.inotify.max_user_instances=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
echo fs.inotify.max_queued_events=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

Keppler Dockerfile

Below is my Docker file that will create an image with everything needed to start keppler and expose it on port 1234.

FROM node
RUN npm install -g keppler
RUN mkdir /keppler
WORKDIR /keppler
CMD keppler "keppler" --port 1234

Build the dockerfile with the below command, which will create our image keppler:1.0.

docker build -t keppler:1.0 .

Keppler alias

The shell alias below will create automatically start the keppler container and expose the contents of the directory where it is started.

1	alias keppler="docker run --rm -d -v \`pwd\`:/keppler -p1234:1234 --name keppler keppler:1.0"

Stopping Keppler

As it is running as a docker container, it can be simply stopped with the command:

docker stop keppler

Code Sharing tooling