Add a docker build step.

frontend/app/services/api.ts

@@ -6,7 +6,7 @@ import type {
   ApiError,
 } from '~/types/task'
 
-const API_BASE_URL = '/api'
+const API_BASE_URL = `${import.meta.env.VITE_API_URL || 'http://localhost:3000'}/api`
 
 class ApiClient {
   private async fetchWrapper<T>(

frontend/package.json

@@ -5,7 +5,7 @@
   "scripts": {
     "build": "react-router build",
     "dev": "react-router dev",
-    "start": "react-router-serve ./build/server/index.js",
+    "start": "PORT=5173 react-router-serve ./build/server/index.js",
     "test": "vitest",
     "test:coverage": "vitest --coverage",
     "test:run": "vitest run",

frontend/react-router.config.ts

@@ -4,4 +4,7 @@ export default {
   // Config options...
   // Server-side render by default, to enable SPA mode set this to `false`
   ssr: true,
+  serverBuildDirectory: "build/server",
+  serverModuleFormat: "esm",
+  serverMiddleware: "./middleware.js",
 } satisfies Config;

frontend/vite.config.ts

@@ -7,7 +7,7 @@ export default defineConfig({
   server: {
     proxy: {
       "/api": {
-        target: "http://localhost:3000",
+        target: process.env.VITE_API_URL || "http://127.0.0.1:3000",
         changeOrigin: true,
       },
     },