Crowd Code

crowdsourced, collaborative integration testing

A web app designed to help CS students work together towards better code via end to end integration testing. The idea is that for programming assignments where everyone's code must comply with a standard interface, anyone can upload a test to the project site and everyone can run all of the tests against their implementation.

Created in 24 hours with ❤️ and 🍕 by Geoffrey Xue, Aiden Cohen, Akshay Joshi, and Michael Noguera.

🥉 Won third place at the 2022 UPL Hatathon.

Demo

In this example, the sample tests are:

1. checking if expr will output 2 when asked to calculate 1+1
2. checking if echo will output "hello world" when given "hello world" as input
3. checking if echo "hello world" outputs "yeet", demonstrating what a failed test case looks like

In reality, you would not use this program to test built-in system utilities, but rather invoke your own program to check its output.

hatathon.compressed.x264.mp4

Live Project Site

You can access our web app at https://hatathon.web.app/. At the time of this writing, it is online and working.

Design

The project is built with a React frontend that communicates via a Flask backend to the local test runner program. Tests and state data are stored in a MySQL database managed by the Flask server. This diagram illustrates how important this communication is to making everything work.

Backend

HackathonUW/HatathonBackend

Client Script

HackathonUW/hatathon-client

This script is needed to use the application. Please be careful when running it, because it will execute whatever code internet people have entered in the web app on your system. You should probably try this in a VM if you have important files on your computer. (Ideally, the project would be built to run within Docker, but that feature wasn't realized during the 24-hour period.)

Developed using:

• React (Frontend)
• Flask (Backend)
• Firebase (Firebase Hosting)
• Heroku (Backend Hosting)
• Google Auth (Login and User Management)
• Python and the requests library (Platform-independent Test Runner)

React primary dependencies:

• Chakra (React component library for styling, icons, responsive design, positioning)
• React Router (react-router-dom for switching between tabs)
• React Fade In (Basic fade in animations)
• React Typewriter Effect (Typewriting effect)