diff --git a/ui/src/App.tsx b/ui/src/App.tsx
index 32be4b42..f9591273 100644
--- a/ui/src/App.tsx
+++ b/ui/src/App.tsx
@@ -7,9 +7,12 @@ import { store } from './store'
 import { DynamicRoutesProvider } from './routes/dynamicRoutesContext'
 import { ComponentProvider } from './contexts/ComponentContext'
 import ComponentRegistryProvider from './contexts/ComponentRegistryContext'
+import { registerServiceWorker } from './views/version/swRegistration'
 
 const queryClient = new QueryClient()
 
+registerServiceWorker()
+
 function App() {
   return (
     <StoreProvider store={store}>
diff --git a/ui/src/views/version/UpdateNotifier.tsx b/ui/src/views/version/UpdateNotifier.tsx
index e9543fbd..cee3297c 100644
--- a/ui/src/views/version/UpdateNotifier.tsx
+++ b/ui/src/views/version/UpdateNotifier.tsx
@@ -1,56 +1,65 @@
 import { ROUTES_ENUM } from '@/routes/route.constant'
 import { useState, useEffect } from 'react'
-import { useNavigate } from 'react-router-dom'
 import { HiOutlineRefresh, HiX } from 'react-icons/hi'
-import { useStoreState, useStoreActions } from '@/store'
+import { useStoreActions } from '@/store'
 
 const UpdateNotifier = () => {
-  const [lastUiVersion, setLastUiVersion] = useState('')
   const [updateAvailable, setUpdateAvailable] = useState(false)
-  const navigate = useNavigate()
+  const [newVersion, setNewVersion] = useState<string | null>(null)
 
-  const { currentUiVersion } = useStoreState((s) => s.locale)
   const { setUiVersion } = useStoreActions((s) => s.locale)
 
+  // SW update olayını dinle
   useEffect(() => {
-    const checkVersion = async () => {
+    const handler = async () => {
       try {
         const res = await fetch('/version.json?ts=' + Date.now())
         const data = await res.json()
-        const latestVersion = data?.releases?.[0]?.version
-        if (latestVersion && latestVersion !== currentUiVersion) {
-          setUpdateAvailable(true)
-          setLastUiVersion(latestVersion)
+        const latest = data?.releases?.[0]?.version
+        if (latest) {
+          setNewVersion(latest)
         }
-      } catch (err) {
-        console.error('Version check failed', err)
+      } catch {
+        console.warn('Yeni versiyon bilgisi alınamadı')
       }
+      setUpdateAvailable(true)
     }
 
-    checkVersion()
-    const interval = setInterval(checkVersion, 30000) // 30s’de bir kontrol
-    return () => clearInterval(interval)
-  }, [currentUiVersion])
+    window.addEventListener('sw-update-available', handler)
+    return () => window.removeEventListener('sw-update-available', handler)
+  }, [])
 
   if (!updateAvailable) return null
 
   return (
-    <div
-      className="fixed bottom-5 right-5 z-50 flex items-center justify-between gap-4 rounded-lg bg-sky-500 p-4 text-white shadow-lg animate-bounce"
-    >
+    <div className="fixed bottom-5 right-5 z-50 flex items-center justify-between gap-4 rounded-lg bg-sky-500 p-4 text-white shadow-lg animate-bounce">
       <div className="flex items-center gap-3">
         <HiOutlineRefresh className="h-8 w-8 animate-spin" />
         <div>
-          <p className="font-semibold">Yeni güncelleme mevcut! (v{lastUiVersion})</p>
+          <p className="font-semibold">
+            Yeni güncelleme mevcut {newVersion && `(v${newVersion})`}!
+          </p>
           <p className="text-sm">En son özellikler için sayfayı yenileyin.</p>
         </div>
       </div>
       <div className="flex items-center gap-2">
         <button
           onClick={() => {
-            setUiVersion(lastUiVersion)
+            navigator.serviceWorker.getRegistration().then((reg) => {
+              if (reg?.waiting) {
+                reg.waiting.postMessage({ type: 'SKIP_WAITING' })
+              }
+            })
+
+            if (newVersion) {
+              setUiVersion(newVersion)
+              window.location.href =
+                ROUTES_ENUM.protected.admin.changeLog + `?v=${newVersion}`
+            } else {
+              window.location.reload()
+            }
+
             setUpdateAvailable(false)
-            window.location.href = ROUTES_ENUM.protected.admin.changeLog + `?v=${lastUiVersion}`
           }}
           className="rounded bg-white px-4 py-2 text-sm font-bold text-sky-600 transition hover:bg-sky-100"
         >
diff --git a/ui/src/views/version/swRegistration.ts b/ui/src/views/version/swRegistration.ts
new file mode 100644
index 00000000..c5a57b16
--- /dev/null
+++ b/ui/src/views/version/swRegistration.ts
@@ -0,0 +1,15 @@
+// src/swRegistration.ts
+import { registerSW } from 'virtual:pwa-register'
+
+export const registerServiceWorker = () => {
+  registerSW({
+    immediate: true, // Yeni SW hemen yüklensin
+    onNeedRefresh() {
+      const event = new CustomEvent('sw-update-available')
+      window.dispatchEvent(event)
+    },
+    onOfflineReady() {
+      console.log('App offline ready')
+    },
+  })
+}
diff --git a/ui/src/vite-env.d.ts b/ui/src/vite-env.d.ts
index c05b61fa..ffe5534d 100644
--- a/ui/src/vite-env.d.ts
+++ b/ui/src/vite-env.d.ts
@@ -1,4 +1,5 @@
 /// <reference types="vite/client" />
+/// <reference types="vite-plugin-pwa/client" />
 
 interface ImportMetaEnv {
   readonly VITE_API_URL: string