TickTickTick

Winning hackathon project (1st place, $10,000)

I participated in Slack's inaugural Slackathon. Teams were challenged to "build the Slack of tomorrow" in just 10 hours using the Slack API.

Slack currently supports formatted code in chat messages. My team created TickTickTick, a feature to execute this code remotely and display the result in the conversation, including any generated images (demo below). The feature has several applications: Inline code and devops tooling that "participates" in the conversation, code help and debugging, data analytics and visualizations, and working with designers on a website. TickTickTick makes Slack a codeversational platform.

I worked on the the containerization and backend aspects of the project with my teammates: Ram Goli (ramsgoli), Nathan Kamm (nieroda), Ahsan Naveed (ahsannaveed007), and Suyash Saxena (suyashsax).

GitHub

Features

Codeversational: Run code in Slack without without leaving the conversation.
Customizable environments.
- Limitless environments tailored to a group's particular needs.
- We implemented environments for C++, JavaScript, Python, and Bash with supporting libraries.
- Consistent execution environment for all parties.
Auto-detect syntax.
Works on mobile.

Implementation

Use Slack's /command API to push text (code) to the server.
Auto-detect syntax (if not specified).
Run the code in the appropriate, pre-built Docker container.
Capture stdout and send the result to the client.
Move any generated images to a fileserver and send the URL to the client.

Syntax

To trigger remote code execution, use the slash command /``` (tick tick tick).

Demo

Hello, World!

The compulsory "Hello, World!" (Bash) and FizzBuzz (Python). Code is executed remotely and stdout is posted in the conversation.

Code debugging

In this example, the code (C++) encounters a runtime error because it indexes an item outside the vector's bounds. We can run and fix the code without needing to leave the conversation (e.g. when helping a colleague debug their code). All parties work on the same code in a consistent environment.

Data analytics and visualization

Visualization is essential when analyzing data and equations. Remote code execution is especially important for data scientists who need a distributed system to crunch their massive datasets. In this example, we plot the equation for the Batman Insignia (Python with Matplotlib) and display the rendered image in the chat.

Web Design

Designers and developers often work together to refine how a website looks. In this example, we render a React web component and display the result in the chat. This makes it possible for designers and developers to build and polish a website's look without leaving the conversation.

Presentation