diff --git a/frontend/src/components/InitConfig.tsx b/frontend/src/components/InitConfig.tsx
new file mode 100644
index 0000000..22766d7
--- /dev/null
+++ b/frontend/src/components/InitConfig.tsx
@@ -0,0 +1,25 @@
+import { useEffect } from 'react'
+
+export default function InitConfig() {
+  useEffect(() => {
+    const openaiKey = localStorage.getItem('openai-key')
+    const deepseekKey = localStorage.getItem('deepseek-key')
+    const openaiBaseUrl = localStorage.getItem('openai-base-url')
+    const deepseekBaseUrl = localStorage.getItem('deepseek-base-url')
+    const aiMock = localStorage.getItem('ai-mock') ?? 'true'
+
+    const body: Record<string, string | undefined> = { aiMock }
+    if (openaiKey) body.openaiKey = openaiKey
+    if (deepseekKey) body.deepseekKey = deepseekKey
+    if (openaiBaseUrl) body.openaiBaseUrl = openaiBaseUrl
+    if (deepseekBaseUrl) body.deepseekBaseUrl = deepseekBaseUrl
+
+    fetch('/api/config', {
+      method: 'PUT',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(body),
+    }).catch(() => {})
+  }, [])
+
+  return null
+}
diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
index aa14b89..b6446c2 100644
--- a/frontend/src/main.tsx
+++ b/frontend/src/main.tsx
@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client'
 import { RouterProvider } from 'react-router-dom'
 import { QueryClientProvider } from '@tanstack/react-query'
 import { ErrorBoundary } from './components/ErrorBoundary'
+import InitConfig from './components/InitConfig'
 import { router } from './router'
 import { queryClient } from './lib/queryClient'
 import './index.css'
@@ -11,6 +12,7 @@ createRoot(document.getElementById('root')!).render(
   <StrictMode>
     <ErrorBoundary>
       <QueryClientProvider client={queryClient}>
+        <InitConfig />
         <RouterProvider router={router} />
       </QueryClientProvider>
     </ErrorBoundary>