From 4e0a545f1247a95618aa893b68c4d6bc7bfb6da9 Mon Sep 17 00:00:00 2001
From: Rizwan Mustafa <rizwanmustafa0000@gmail.com>
Date: Wed, 1 Jun 2022 23:04:00 +0500
Subject: [PATCH] Create docker-compose.yaml file for frontend (#3058)

* Create docker-compose.yaml file for frontend

* Move docker-compose.yaml file

* change name

* Add docker instructions

* Add docker installation link
---
 CONTRIBUTING_ADVANCED.md     | 10 ++++++++++
 frontend/docker-compose.yaml | 10 ++++++++++
 2 files changed, 20 insertions(+)
 create mode 100644 frontend/docker-compose.yaml

diff --git a/CONTRIBUTING_ADVANCED.md b/CONTRIBUTING_ADVANCED.md
index 85e023276..72c99369d 100644
--- a/CONTRIBUTING_ADVANCED.md
+++ b/CONTRIBUTING_ADVANCED.md
@@ -6,6 +6,7 @@
   - [Git](#git)
   - [NodeJS and NPM](#nodejs-and-npm)
   - [Firebase](#firebase)
+  - [Docker (Recommended but Optional)](#docker-recommended-but-optional)
   - [Backend (optional)](#backend-optional)
 - [Building and Running Monkeytype](#building-and-running-monkeytype)
 - [Standards and Guidelines](#standards-and-guidelines)
@@ -71,6 +72,15 @@ Alternatively, if you use `nvm` then you can run `nvm install` and `nvm use` (yo
    - Click "Generate New Private Key"
    - Save as `serviceAccountKey.json` inside the `backend/credentials/` directory.
 
+#### Docker (Recommended but Optional)
+
+You can use docker to run the frontend development environment. This will take care of OS specific problems. After installing [Docker](https://www.docker.com/get-started/#h_installation) run the following command to start the frontend server:
+
+```bash
+cd frontend && docker-compose up
+```
+Once wepback has compiled, the frontend will be served on [port 3000](http://localhost:3000)
+
 #### Backend (optional)
 
 Follow these steps if you want to work on anything involving the database/account system. Otherwise, you can skip this section.
diff --git a/frontend/docker-compose.yaml b/frontend/docker-compose.yaml
new file mode 100644
index 000000000..37820545f
--- /dev/null
+++ b/frontend/docker-compose.yaml
@@ -0,0 +1,10 @@
+services:
+  monkeytype-frontend:
+    container_name: monkeytype-frontend
+    image: node:gallium-bullseye
+    restart: on-failure
+    ports:
+      - "3000:3000"
+    volumes:
+      - ../:/monkeytype
+    entrypoint: 'bash -c "cd /monkeytype && npm run dev-fe"'