[CHORE] Github Codespaces Setup (hedyorg#4025)

**Description**

Adds a `.devcontainer` folder with a setup for Github Codespaces (and VS Code Remote Container). Getting started with Hedy development has never been easier.

.devcontainer/Dockerfile

@@ -0,0 +1,51 @@
+FROM python:3.9-slim as main
+
+# use a non-root user (https://code.visualstudio.com/remote/advancedcontainers/add-nonroot-user)
+ARG USERNAME=hedy
+ARG USER_UID=1000
+ARG USER_GID=$USER_UID
+# Create the user
+RUN groupadd --gid $USER_GID $USERNAME \
+    && useradd --uid $USER_UID --gid $USER_GID -m $USERNAME \
+    #
+    # [Optional] Add sudo support. Omit if you don't need to install software after connecting.
+    && apt-get update \
+    && apt-get install -y sudo \
+    && echo $USERNAME ALL=\(root\) NOPASSWD:ALL > /etc/sudoers.d/$USERNAME \
+    && chmod 0440 /etc/sudoers.d/$USERNAME
+
+# Install all binary dependencies (things that won't change due to our code changes)
+# git is needed / useful in github codespaces
+# make and gcc are needed for node-gyp package
+RUN apt-get install -y gcc git make g++ curl && curl -fsSL https://deb.nodesource.com/setup_lts.x | bash - && apt-get install -y nodejs
+
+# Fix cypress dependencies
+# https://docs.cypress.io/guides/continuous-integration/introduction#Dependencies
+RUN export DEBIAN_FRONTEND=noninteractive && \
+    apt-get install -y --no-install-recommends \
+    libgtk2.0-0 \
+    libgtk-3-0 \
+    libgbm-dev \
+    libnotify-dev \
+    libgconf-2-4 \
+    libnss3 \
+    libxss1 \
+    libasound2 \
+    libxtst6 xauth xvfb
+
+FROM main as node_builder
+WORKDIR /app
+COPY package* .
+RUN npm ci
+
+FROM main
+
+# Setup python packages
+COPY requirements.txt /tmp/requirements.txt
+RUN pip3 install --no-cache-dir -r /tmp/requirements.txt
+
+# Copy node modules to a tmp folder
+COPY --from=node_builder /app/node_modules /var/tmp/node_modules
+
+EXPOSE 8080
+ENV SHELL /bin/bash

.devcontainer/create.sh

@@ -0,0 +1,11 @@
+#!/bin/bash
+set -e
+pre-commit install
+pybabel compile -f -d translations
+cp -r /var/tmp/node_modules . 
+
+if [[ -z "${BASE_URL}" ]]; then
+  echo "export BASE_URL=\"https://${CODESPACE_NAME}-8080.preview.app.github.dev\"" >> ~/.bashrc
+fi
+
+

.devcontainer/devcontainer.json

@@ -0,0 +1,38 @@
+// For format details, see https://aka.ms/devcontainer.json.
+{
+    "name": "Hedy",
+    "dockerComposeFile": "docker-compose.yml",
+    "service": "dev",
+    "workspaceFolder": "/workspace",
+    "forwardPorts": [
+        8080,
+        8081
+    ],
+    // Configure tool-specific properties.
+    "customizations": {
+        // Configure properties specific to VS Code.
+        "vscode": {
+            // Add the IDs of extensions you want installed when the container is created.
+            "extensions": [
+                "ms-python.python",
+                "dirk-thomas.vscode-lark"
+            ],
+            "settings": {
+                "terminal.integrated.shell.linux": "bash",
+                "terminal.integrated.profiles.linux": {
+                    "bash (container default)": {
+                        "path": "/bin/bash",
+                        "overrideName": true
+                    }
+                }
+            }
+        }
+    },
+    // Use 'forwardPorts' to make a list of ports inside the container available locally.
+    // "forwardPorts": [],
+    "onCreateCommand": ".devcontainer/create.sh",
+    // Use 'postCreateCommand' to run commands after the container is created.
+    //"postCreateCommand": "",
+    // Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
+    "remoteUser": "hedy"
+}

.devcontainer/docker-compose.yml

@@ -0,0 +1,33 @@
+# Based on https://devopstar.com/2022/01/03/cypress-testing-in-devcontainers-and-github-codespaces/
+---
+version: '3'
+
+services:
+  dev:
+    build:
+      context: ..
+      dockerfile: .devcontainer/Dockerfile
+    command: sleep infinity
+    environment:
+      DISPLAY: ":14"
+      LIBGL_ALWAYS_INDIRECT: 0
+    volumes:
+      - ../:/workspace
+    volumes_from:
+      - x11-bridge:rw
+    depends_on:
+      - x11-bridge
+  x11-bridge:
+    # https://github.com/JAremko/docker-x11-bridge
+    image: jare/x11-bridge
+    volumes:
+      - "/tmp/.X11-unix:/tmp/.X11-unix:rw"
+    ports:
+      - "8081:8081"
+    restart: always
+    environment:
+      MODE: tcp
+      XPRA_HTML: "yes"
+      DISPLAY: ":14"
+      XPRA_TCP_PORT: "8081"
+      XPRA_PASSWORD: hedy # This password can be anything you want.

CONTRIBUTING.md

@@ -28,9 +28,29 @@ For these types of issues it is fine to ping us on GitHub before starting the wo
 The [Discussion board](https://github.com/Felienne/hedy/discussions) has ideas that are not yet detailed enough to be put into issue, like big new features or overhauls of the language or architecture.
 If you are interested in working on topics related to an open discussion, please join a meeting to discuss the plans in detail.
 
+Contributing to Hedy
+------------
+
+The easiest way to get a working development environment to work on Hedy is through [Github Codespaces](https://github.com/features/codespaces). 
+
+[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://github.com/codespaces/new?machine=basicLinux32gb&repo=226863521&ref=main&location=WestEurope)
+
+This will open up a VS Code instance in the browser and allow you to work on the Hedy code. This is really useful to quickly make some small and trivial changes without needing to install anything.
+
+Github Codespaces is only free for a certain amount of CPU-hours each month, so if you want to work on Hedy regularly, it might be better to run Hedy on your machine.
+
 Run Hedy on your machine
 ------------
 
+**With Docker, VSCode and its Remote Container Extension**
+
+VS Code has a great Dev Containers extension that allows you to connect the IDE to a development (docker) container. More info can be found on https://code.visualstudio.com/docs/devcontainers/containers
+
+After opening this repo in VS Code, they will ask whether you want to open this folder in a container. Do this and you will have a working environment in which you can develop Hedy. 
+
+
+**Local installation**
+
 If you are going to contribute to the code of Hedy, you will probably want to run the code on your own computer. For this you need to:
 - install Python 3.7 or higher;
 - install Microsoft Visual C++ 14.0 or higher, which you can [download here](https://visualstudio.microsoft.com/visual-cpp-build-tools/)