Start frontend project

frontend/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "frontend",
+  "version": "1.0.0",
+  "description": "",
+  "private": true,
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "webpack"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "webpack": "^5.31.0",
+    "webpack-cli": "^4.6.0"
+  },
+  "dependencies": {
+    "lodash": "^4.17.21"
+  }
+}

frontend/src/index.js

@@ -0,0 +1,20 @@
+import _ from "lodash";
+import "./style.css";
+import Icon from './ship.png';
+
+function component() {
+  const element = document.createElement("div");
+
+  // Lodash, currently included via a script, is required for this line to work
+  element.innerHTML = _.join(["Hello", "webpack"], " ");
+  element.classList.add("hello");
+
+  const myIcon = new Image();
+  myIcon.src = Icon;
+
+  element.appendChild(myIcon);
+
+  return element;
+}
+
+document.body.appendChild(component());

frontend/webpack.config.js

@@ -0,0 +1,9 @@
+const path = require("path");
+
+module.exports = {
+  entry: "./src/index.js",
+  output: {
+    filename: "bundle.js",
+    path: path.resolve(__dirname, "dist"),
+  },
+};