diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 00000000..d5ea7b96
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "battletrack"]
+	path = client/battletrack
+	url = git@github.com:n8kim1/battletrack.git
diff --git a/client/package.json b/client/package.json
index 9f083df8..01aed327 100644
--- a/client/package.json
+++ b/client/package.json
@@ -16,7 +16,8 @@
         "tauri-build": "npm run build && npm run tauri-pack",
         "electron-watch": "concurrently --kill-others \"npm run watch\" \"wait-on http://localhost:3000 && electron .\"",
         "electron-pack": "cross-env USE_HARD_LINKS=false CSC_IDENTITY_AUTO_DISCOVERY=false NODE_ENV=production electron-builder build --publish never",
-        "electron-build": "npm run build && npm run electron-pack"
+        "electron-build": "npm run build && npm run electron-pack",
+        "battletrack-watch": "cross-env NODE_ENV=development webpack serve --config webpack-battletrack.config.js --mode development --env dev"
     },
     "build": {
         "asar": false,
diff --git a/client/src/components/sidebar/sidebar.tsx b/client/src/components/sidebar/sidebar.tsx
index 33c07c69..5e746982 100644
--- a/client/src/components/sidebar/sidebar.tsx
+++ b/client/src/components/sidebar/sidebar.tsx
@@ -19,6 +19,20 @@ import { ConfigPage } from '../../client-config'
 import { UpdateWarning } from './update-warning'
 import Game from '../../playback/Game'
 
+export const fetchTournamentPage = (tournamentSource: string, rawGames: JsonTournamentGame[]) => {
+    fetch(tournamentSource)
+        .then((response) => response.text())
+        .then((text) => {
+            const data = JSON.parse(text)
+            const newGames = data.results as JsonTournamentGame[]
+            rawGames.push(...newGames)
+
+            if (data.next) {
+                fetchTournamentPage(data.next, rawGames)
+            }
+        })
+}
+
 export const Sidebar: React.FC = () => {
     const { width, height } = useWindowDimensions()
     const [page, setPage] = usePage()
@@ -40,24 +54,13 @@ export const Sidebar: React.FC = () => {
     const [localTournament] = useSearchParamBool('localTournament', false)
 
     const [tournamentSource, setTournamentSource] = useSearchParamString('tournamentSource', '')
-    const fetchTournamentPage = (tournamentSource: string, rawGames: JsonTournamentGame[]) => {
-        fetch(tournamentSource)
-            .then((response) => response.text())
-            .then((text) => {
-                const data = JSON.parse(text)
-                const newGames = data.results as JsonTournamentGame[]
-                rawGames.push(...newGames)
-
-                if (data.next) {
-                    fetchTournamentPage(data.next, rawGames)
-                } else {
-                    context.setState((prevState) => ({
-                        ...prevState,
-                        tournament: new Tournament(rawGames),
-                        loadingRemoteContent: ''
-                    }))
-                }
-            })
+    const loadTournamentPage = (tournamentSource: string, rawGames: JsonTournamentGame[]) => {
+        fetchTournamentPage(tournamentSource, rawGames)
+        context.setState((prevState) => ({
+            ...prevState,
+            tournament: new Tournament(rawGames),
+            loadingRemoteContent: ''
+        }))
     }
     React.useEffect(() => {
         if (tournamentSource) {
@@ -65,7 +68,7 @@ export const Sidebar: React.FC = () => {
                 ...prevState,
                 loadingRemoteContent: 'tournament'
             }))
-            fetchTournamentPage(tournamentSource, [])
+            loadTournamentPage(tournamentSource, [])
             setPage(PageType.TOURNAMENT)
         }
     }, [tournamentSource])
diff --git a/client/src/playback/Match.ts b/client/src/playback/Match.ts
index 0ddb1fe0..7757dfad 100644
--- a/client/src/playback/Match.ts
+++ b/client/src/playback/Match.ts
@@ -161,8 +161,8 @@ export default class Match {
     /**
      * Change the rounds current turn to the current turn + delta.
      */
-    public stepTurn(delta: number, rerender: boolean = true): void {
-        this.jumpToTurn(this.currentTurn.turnNumber + delta, rerender)
+    public stepTurn(delta: number, rerender: boolean = true, headless: boolean = false): void {
+        this.jumpToTurn(this.currentTurn.turnNumber + delta, rerender, headless)
     }
 
     /**
@@ -175,7 +175,7 @@ export default class Match {
     /**
      * Sets the current turn to the turn at the given turn number.
      */
-    public jumpToTurn(turnNumber: number, rerender: boolean = true): void {
+    public jumpToTurn(turnNumber: number, rerender: boolean = true, headless: boolean = false): void {
         if (!this.game.playable) return
 
         turnNumber = Math.max(0, Math.min(turnNumber, this.deltas.length))
@@ -209,7 +209,9 @@ export default class Match {
         }
 
         this.currentTurn = updatingTurn
-        publishEvent(EventType.TURN_PROGRESS, {})
+        if (!headless) {
+            publishEvent(EventType.TURN_PROGRESS, {})
+        }
         if (rerender) this.rerender()
     }
 }
diff --git a/client/webpack-battletrack.config.js b/client/webpack-battletrack.config.js
new file mode 100644
index 00000000..111dce24
--- /dev/null
+++ b/client/webpack-battletrack.config.js
@@ -0,0 +1,69 @@
+const webpack = require('webpack')
+const path = require('path')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const CopyPlugin = require('copy-webpack-plugin')
+
+module.exports = (env) => {
+    const development = env.dev
+
+    var config = {
+        entry: './battletrack/src/app.tsx',
+        target: 'web',
+        devtool: development ? 'source-map' : undefined,
+        resolve: {
+            extensions: ['.tsx', '.ts', '.js'],
+            fallback: {
+                assert: require.resolve('assert/')
+            }
+        },
+        module: {
+            rules: [
+                {
+                    test: /\.ts(x?)$/,
+                    exclude: [/node_modules/, /src-tauri/, /packaged-client/],
+                    loader: 'ts-loader'
+                },
+                {
+                    test: /\.css$/,
+                    exclude: [/node_modules/, /src-tauri/, /packaged-client/],
+                    use: ['style-loader', 'css-loader', 'postcss-loader']
+                },
+                {
+                    test: /\.(png|jpg|jpeg|gif|svg|ttf|otf|woff|woff2|eot)$/,
+                    exclude: [/node_modules/, /src-tauri/, /packaged-client/],
+                    loader: 'url-loader'
+                }
+            ]
+        },
+        devServer: {
+            compress: true,
+            hot: true,
+            port: 3000,
+            static: {
+                directory: path.join(__dirname, '/src')
+            }
+        },
+        output: {
+            path: path.resolve(__dirname, './dist'),
+            filename: 'bundle.js'
+        },
+        plugins: [
+            new HtmlWebpackPlugin({
+                template: './index.html',
+                favicon: './icons/icon.ico'
+            }),
+            new webpack.LoaderOptionsPlugin({
+                minimize: !development,
+                debug: development
+            }),
+            new webpack.ProvidePlugin({
+                process: 'process/browser'
+            }),
+            new CopyPlugin({
+                patterns: [{ from: 'src/static', to: 'static' }]
+            })
+        ]
+    }
+
+    return config
+}