diff --git a/src/components/BackupsTab.test.ts b/src/components/BackupsTab.test.ts
new file mode 100644
index 0000000..9dd2f09
--- /dev/null
+++ b/src/components/BackupsTab.test.ts
@@ -0,0 +1,492 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { mount } from "@vue/test-utils";
+import { createTestingPinia } from "@pinia/testing";
+import BackupsTab from "./BackupsTab.vue";
+import { backupsApi, schedulerApi } from "@/services/api";
+
+vi.mock("@/services/api", () => ({
+  backupsApi: {
+    getDeploymentBackups: vi.fn().mockResolvedValue({ data: { backups: [] } }),
+    createDeploymentBackup: vi.fn().mockResolvedValue({ data: { job_id: "job-123" } }),
+    delete: vi.fn().mockResolvedValue({ data: { success: true } }),
+    restore: vi.fn().mockResolvedValue({ data: { job_id: "restore-job-123" } }),
+    download: vi.fn().mockReturnValue("/api/backups/test-backup/download"),
+    getJob: vi.fn().mockResolvedValue({
+      data: { job: { id: "job-123", status: "completed", type: "backup" } },
+    }),
+  },
+  schedulerApi: {
+    listTasks: vi.fn().mockResolvedValue({ data: { tasks: [] } }),
+    createTask: vi.fn().mockResolvedValue({ data: { task: { id: 1 } } }),
+    updateTask: vi.fn().mockResolvedValue({ data: { success: true } }),
+    deleteTask: vi.fn().mockResolvedValue({ data: { success: true } }),
+    runTaskNow: vi.fn().mockResolvedValue({ data: { success: true } }),
+  },
+}));
+
+const mockGetDeploymentBackups = backupsApi.getDeploymentBackups as ReturnType<typeof vi.fn>;
+const mockCreateDeploymentBackup = backupsApi.createDeploymentBackup as ReturnType<typeof vi.fn>;
+const mockDeleteBackup = backupsApi.delete as ReturnType<typeof vi.fn>;
+const mockRestoreBackup = backupsApi.restore as ReturnType<typeof vi.fn>;
+const mockListTasks = schedulerApi.listTasks as ReturnType<typeof vi.fn>;
+const mockCreateTask = schedulerApi.createTask as ReturnType<typeof vi.fn>;
+
+const mockBackups = [
+  {
+    id: "my-app_20250101_120000",
+    deployment_name: "my-app",
+    status: "completed",
+    size: 1048576,
+    components: ["compose", "env"],
+    created_at: "2025-01-01T12:00:00Z",
+    path: "/backups/my-app/my-app_20250101_120000.tar.gz",
+  },
+  {
+    id: "my-app_20250102_120000",
+    deployment_name: "my-app",
+    status: "completed",
+    size: 2097152,
+    components: ["compose", "env", "data"],
+    created_at: "2025-01-02T12:00:00Z",
+    path: "/backups/my-app/my-app_20250102_120000.tar.gz",
+  },
+];
+
+const mockScheduledTasks = [
+  {
+    id: 1,
+    name: "Daily backup",
+    type: "backup",
+    deployment_name: "my-app",
+    cron_expr: "0 2 * * *",
+    enabled: true,
+    next_run: "2025-01-03T02:00:00Z",
+  },
+];
+
+describe("BackupsTab", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    mockGetDeploymentBackups.mockResolvedValue({ data: { backups: [] } });
+    mockListTasks.mockResolvedValue({ data: { tasks: [] } });
+  });
+
+  const mountBackupsTab = (options: { backups?: typeof mockBackups; tasks?: typeof mockScheduledTasks } = {}) => {
+    if (options.backups) {
+      mockGetDeploymentBackups.mockResolvedValue({ data: { backups: options.backups } });
+    }
+    if (options.tasks) {
+      mockListTasks.mockResolvedValue({ data: { tasks: options.tasks } });
+    }
+
+    return mount(BackupsTab, {
+      props: {
+        deploymentName: "my-app",
+      },
+      global: {
+        plugins: [
+          createTestingPinia({
+            createSpy: vi.fn,
+          }),
+        ],
+        stubs: {
+          Teleport: true,
+          ConfirmModal: true,
+        },
+      },
+    });
+  };
+
+  describe("Component structure", () => {
+    it("renders the backups tab container", () => {
+      const wrapper = mountBackupsTab();
+      expect(wrapper.find(".backups-tab").exists()).toBe(true);
+    });
+
+    it("renders the header with title", () => {
+      const wrapper = mountBackupsTab();
+      expect(wrapper.find(".backups-header").exists()).toBe(true);
+      expect(wrapper.find(".backups-header h3").text()).toBe("Backups");
+    });
+
+    it("renders Create Backup button", () => {
+      const wrapper = mountBackupsTab();
+      expect(wrapper.find(".btn-primary").exists()).toBe(true);
+      expect(wrapper.text()).toContain("Create Backup");
+    });
+
+    it("renders Schedule Backup button", () => {
+      const wrapper = mountBackupsTab();
+      const scheduleBtn = wrapper.findAll(".btn-secondary").find((btn) => btn.text().includes("Schedule"));
+      expect(scheduleBtn).toBeDefined();
+    });
+  });
+
+  describe("Empty state", () => {
+    it("shows empty state when no backups", async () => {
+      const wrapper = mountBackupsTab();
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      expect(wrapper.find(".empty-state").exists()).toBe(true);
+      expect(wrapper.text()).toContain("No backups yet");
+    });
+
+    it("shows helpful message in empty state", async () => {
+      const wrapper = mountBackupsTab();
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      expect(wrapper.text()).toContain("Create your first backup");
+    });
+  });
+
+  describe("Loading state", () => {
+    it("shows loading state when loadingBackups is true", async () => {
+      const wrapper = mount(BackupsTab, {
+        props: {
+          deploymentName: "my-app",
+        },
+        global: {
+          plugins: [
+            createTestingPinia({
+              createSpy: vi.fn,
+            }),
+          ],
+          stubs: {
+            Teleport: true,
+            ConfirmModal: true,
+          },
+        },
+      });
+
+      const vm = wrapper.vm as any;
+      vm.loadingBackups = true;
+      vm.backups = [];
+      await wrapper.vm.$nextTick();
+
+      expect(wrapper.find(".loading-state").exists()).toBe(true);
+      expect(wrapper.text()).toContain("Loading backups");
+    });
+  });
+
+  describe("Backups list", () => {
+    it("renders backup items when backups exist", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const backupItems = wrapper.findAll(".backup-item");
+      expect(backupItems.length).toBe(2);
+    });
+
+    it("displays backup ID", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      expect(wrapper.text()).toContain("my-app_20250101_120000");
+    });
+
+    it("displays backup status", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const statusBadge = wrapper.find(".backup-status");
+      expect(statusBadge.exists()).toBe(true);
+      expect(statusBadge.text()).toBe("completed");
+    });
+
+    it("displays component badges", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const componentBadges = wrapper.findAll(".component-badge");
+      expect(componentBadges.length).toBeGreaterThan(0);
+    });
+
+    it("has Restore button for each backup", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const restoreButtons = wrapper
+        .findAll(".backup-actions .btn-secondary")
+        .filter((btn) => btn.text().includes("Restore"));
+      expect(restoreButtons.length).toBe(2);
+    });
+
+    it("has Download link for each backup", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const downloadLinks = wrapper.findAll(".backup-actions a[download]");
+      expect(downloadLinks.length).toBe(2);
+    });
+
+    it("has Delete button for each backup", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const deleteButtons = wrapper.findAll(".backup-actions .btn-danger");
+      expect(deleteButtons.length).toBe(2);
+    });
+  });
+
+  describe("Create backup", () => {
+    it("calls API when Create Backup button is clicked", async () => {
+      const wrapper = mountBackupsTab();
+      await wrapper.vm.$nextTick();
+
+      const createBtn = wrapper.find(".btn-primary");
+      await createBtn.trigger("click");
+
+      expect(mockCreateDeploymentBackup).toHaveBeenCalledWith("my-app");
+    });
+
+    it("disables button while creating backup", async () => {
+      const wrapper = mountBackupsTab();
+      await wrapper.vm.$nextTick();
+
+      const createBtn = wrapper.find(".btn-primary");
+      await createBtn.trigger("click");
+
+      expect(createBtn.attributes("disabled")).toBeDefined();
+    });
+  });
+
+  describe("Delete backup", () => {
+    it("opens confirm modal when delete is clicked", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const deleteBtn = wrapper.find(".backup-actions .btn-danger");
+      await deleteBtn.trigger("click");
+
+      const vm = wrapper.vm as any;
+      expect(vm.showDeleteBackupModal).toBe(true);
+      expect(vm.backupToDelete).toBe("my-app_20250101_120000");
+    });
+
+    it("calls delete API on confirm", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const vm = wrapper.vm as any;
+      vm.backupToDelete = "my-app_20250101_120000";
+      vm.showDeleteBackupModal = true;
+
+      await vm.deleteBackup();
+
+      expect(mockDeleteBackup).toHaveBeenCalledWith("my-app_20250101_120000");
+    });
+  });
+
+  describe("Restore backup", () => {
+    it("opens confirm modal when restore is clicked", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const restoreBtn = wrapper
+        .findAll(".backup-actions .btn-secondary")
+        .find((btn) => btn.text().includes("Restore"));
+      await restoreBtn?.trigger("click");
+
+      const vm = wrapper.vm as any;
+      expect(vm.showRestoreModal).toBe(true);
+      expect(vm.backupToRestore).toEqual(mockBackups[0]);
+    });
+
+    it("calls restore API on confirm", async () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const vm = wrapper.vm as any;
+      vm.backupToRestore = mockBackups[0];
+      vm.showRestoreModal = true;
+
+      await vm.restoreBackup();
+
+      expect(mockRestoreBackup).toHaveBeenCalledWith("my-app_20250101_120000", {
+        restore_data: true,
+        restore_db: true,
+        stop_first: true,
+      });
+    });
+  });
+
+  describe("Schedule modal", () => {
+    it("opens schedule modal when button is clicked", async () => {
+      const wrapper = mountBackupsTab();
+      await wrapper.vm.$nextTick();
+
+      const scheduleBtn = wrapper.findAll(".btn-secondary").find((btn) => btn.text().includes("Schedule"));
+      await scheduleBtn?.trigger("click");
+
+      const vm = wrapper.vm as any;
+      expect(vm.showScheduleModal).toBe(true);
+    });
+
+    it("has default form values", async () => {
+      const wrapper = mountBackupsTab();
+      const vm = wrapper.vm as any;
+
+      expect(vm.scheduleForm.cronExpr).toBe("0 2 * * *");
+      expect(vm.scheduleForm.retentionCount).toBe(7);
+      expect(vm.scheduleForm.enabled).toBe(true);
+    });
+
+    it("calls API to create scheduled task", async () => {
+      const wrapper = mountBackupsTab();
+      const vm = wrapper.vm as any;
+
+      vm.scheduleForm = {
+        name: "Daily backup",
+        cronExpr: "0 3 * * *",
+        retentionCount: 5,
+        enabled: true,
+      };
+
+      await vm.createScheduledTask();
+
+      expect(mockCreateTask).toHaveBeenCalledWith({
+        name: "Daily backup",
+        type: "backup",
+        deployment_name: "my-app",
+        cron_expr: "0 3 * * *",
+        enabled: true,
+        config: {
+          backup_config: {
+            retention_count: 5,
+          },
+        },
+      });
+    });
+  });
+
+  describe("Scheduled tasks list", () => {
+    it("shows scheduled tasks section when tasks exist", async () => {
+      const wrapper = mountBackupsTab({ tasks: mockScheduledTasks });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      expect(wrapper.find(".scheduled-backups-section").exists()).toBe(true);
+      expect(wrapper.text()).toContain("Scheduled Backups");
+    });
+
+    it("displays task name and cron expression", async () => {
+      const wrapper = mountBackupsTab({ tasks: mockScheduledTasks });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      expect(wrapper.text()).toContain("Daily backup");
+      expect(wrapper.text()).toContain("0 2 * * *");
+    });
+
+    it("has toggle switch for enabling/disabling task", async () => {
+      const wrapper = mountBackupsTab({ tasks: mockScheduledTasks });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const toggleSwitch = wrapper.find(".toggle-switch input[type='checkbox']");
+      expect(toggleSwitch.exists()).toBe(true);
+    });
+
+    it("has run now button for each task", async () => {
+      const wrapper = mountBackupsTab({ tasks: mockScheduledTasks });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const runButtons = wrapper.findAll(".task-actions .btn-secondary");
+      expect(runButtons.length).toBeGreaterThan(0);
+    });
+
+    it("has delete button for each task", async () => {
+      const wrapper = mountBackupsTab({ tasks: mockScheduledTasks });
+      await wrapper.vm.$nextTick();
+      await new Promise((r) => setTimeout(r, 10));
+      await wrapper.vm.$nextTick();
+
+      const deleteBtn = wrapper.find(".task-actions .btn-danger");
+      expect(deleteBtn.exists()).toBe(true);
+    });
+  });
+
+  describe("Utility functions", () => {
+    it("formatBytes formats bytes correctly", () => {
+      const wrapper = mountBackupsTab({ backups: mockBackups });
+      const vm = wrapper.vm as any;
+
+      expect(vm.formatBytes(0)).toBe("0 B");
+      expect(vm.formatBytes(1024)).toBe("1 KB");
+      expect(vm.formatBytes(1048576)).toBe("1 MB");
+      expect(vm.formatBytes(1073741824)).toBe("1 GB");
+    });
+
+    it("formatDate formats date correctly", () => {
+      const wrapper = mountBackupsTab();
+      const vm = wrapper.vm as any;
+
+      const result = vm.formatDate("2025-01-01T12:00:00Z");
+      expect(result).toBeTruthy();
+    });
+
+    it("getDownloadUrl returns correct URL", () => {
+      const wrapper = mountBackupsTab();
+      const vm = wrapper.vm as any;
+
+      vm.getDownloadUrl("test-backup-id");
+      expect(backupsApi.download).toHaveBeenCalledWith("test-backup-id");
+    });
+  });
+
+  describe("Job polling", () => {
+    it("starts polling when backup job is created", async () => {
+      const wrapper = mountBackupsTab();
+      await wrapper.vm.$nextTick();
+
+      const vm = wrapper.vm as any;
+      const createBtn = wrapper.find(".btn-primary");
+      await createBtn.trigger("click");
+      await wrapper.vm.$nextTick();
+
+      expect(vm.activeJobs.length).toBe(1);
+      expect(vm.activeJobs[0].id).toBe("job-123");
+    });
+
+    it("stops polling when no active jobs", async () => {
+      const wrapper = mountBackupsTab();
+      const vm = wrapper.vm as any;
+
+      vm.activeJobs = [];
+      await vm.pollActiveJobs();
+
+      expect(vm.activeJobs.length).toBe(0);
+    });
+  });
+});
diff --git a/src/components/BackupsTab.vue b/src/components/BackupsTab.vue
new file mode 100644
index 0000000..cd21c2e
--- /dev/null
+++ b/src/components/BackupsTab.vue
@@ -0,0 +1,880 @@
+<template>
+  <div class="backups-tab">
+    <div class="backups-header">
+      <h3>Backups</h3>
+      <div class="backups-actions">
+        <button class="btn btn-primary" :disabled="creatingBackup" @click="createBackup">
+          <i :class="creatingBackup ? 'pi pi-spin pi-spinner' : 'pi pi-plus'" />
+          {{ creatingBackup ? "Creating..." : "Create Backup" }}
+        </button>
+        <button class="btn btn-secondary" @click="showScheduleModal = true">
+          <i class="pi pi-clock" />
+          Schedule Backup
+        </button>
+      </div>
+    </div>
+
+    <div v-if="loadingBackups" class="loading-state">
+      <i class="pi pi-spin pi-spinner" />
+      Loading backups...
+    </div>
+
+    <div v-else-if="backups.length === 0" class="empty-state">
+      <i class="pi pi-history" />
+      <h4>No backups yet</h4>
+      <p>Create your first backup to protect your deployment data.</p>
+    </div>
+
+    <div v-else class="backups-list">
+      <div v-for="backup in backups" :key="backup.id" class="backup-item">
+        <div class="backup-info">
+          <div class="backup-name">
+            <i class="pi pi-file-export" />
+            {{ backup.id }}
+          </div>
+          <div class="backup-meta">
+            <span class="backup-size">{{ formatBytes(backup.size) }}</span>
+            <span class="backup-date">{{ formatDate(backup.created_at) }}</span>
+            <span class="backup-status" :class="backup.status">{{ backup.status }}</span>
+          </div>
+          <div v-if="backup.components?.length" class="backup-components">
+            <span v-for="comp in backup.components" :key="comp" class="component-badge">
+              {{ comp }}
+            </span>
+          </div>
+        </div>
+        <div class="backup-actions">
+          <button
+            class="btn btn-sm btn-secondary"
+            :disabled="restoringBackup === backup.id"
+            @click="confirmRestore(backup)"
+          >
+            <i :class="restoringBackup === backup.id ? 'pi pi-spin pi-spinner' : 'pi pi-replay'" />
+            Restore
+          </button>
+          <a :href="getDownloadUrl(backup.id)" class="btn btn-sm btn-secondary" download>
+            <i class="pi pi-download" />
+            Download
+          </a>
+          <button class="btn btn-sm btn-danger" @click="confirmDeleteBackup(backup.id)">
+            <i class="pi pi-trash" />
+          </button>
+        </div>
+      </div>
+    </div>
+
+    <div v-if="scheduledTasks.length > 0" class="scheduled-backups-section">
+      <h4>Scheduled Backups</h4>
+      <div class="scheduled-tasks-list">
+        <div v-for="task in scheduledTasks" :key="task.id" class="scheduled-task-item">
+          <div class="task-info">
+            <span class="task-name">{{ task.name }}</span>
+            <span class="task-schedule">{{ task.cron_expr }}</span>
+            <span v-if="task.next_run" class="task-next"> Next: {{ formatDate(task.next_run) }} </span>
+          </div>
+          <div class="task-actions">
+            <label class="toggle-switch small">
+              <input type="checkbox" :checked="task.enabled" @change="toggleTask(task)" />
+              <span class="toggle-slider" />
+            </label>
+            <button class="btn btn-sm btn-secondary" @click="runTaskNow(task.id)">
+              <i class="pi pi-play" />
+            </button>
+            <button class="btn btn-sm btn-danger" @click="confirmDeleteTask(task.id)">
+              <i class="pi pi-trash" />
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Schedule Backup Modal -->
+    <Teleport to="body">
+      <div v-if="showScheduleModal" class="modal-overlay" @click.self="showScheduleModal = false">
+        <div class="modal-container schedule-modal">
+          <div class="modal-header">
+            <h3>
+              <i class="pi pi-clock" />
+              Schedule Automatic Backup
+            </h3>
+            <button class="close-btn" @click="showScheduleModal = false">
+              <i class="pi pi-times" />
+            </button>
+          </div>
+          <div class="modal-body">
+            <div class="form-group">
+              <label>Schedule Name</label>
+              <input v-model="scheduleForm.name" type="text" placeholder="e.g., Daily backup" class="form-control" />
+            </div>
+            <div class="form-group">
+              <label>Schedule (Cron Expression)</label>
+              <input v-model="scheduleForm.cronExpr" type="text" placeholder="0 2 * * *" class="form-control" />
+              <span class="form-hint">
+                Examples: <code>0 2 * * *</code> (daily at 2am), <code>0 */6 * * *</code> (every 6 hours)
+              </span>
+            </div>
+            <div class="form-group">
+              <label>Retention Count</label>
+              <input
+                v-model.number="scheduleForm.retentionCount"
+                type="number"
+                min="1"
+                max="100"
+                class="form-control"
+              />
+              <span class="form-hint">Number of backups to keep (older backups will be deleted)</span>
+            </div>
+            <div class="form-group">
+              <label class="checkbox-label">
+                <input v-model="scheduleForm.enabled" type="checkbox" />
+                Enable schedule immediately
+              </label>
+            </div>
+          </div>
+          <div class="modal-footer">
+            <button class="btn btn-secondary" @click="showScheduleModal = false">Cancel</button>
+            <button
+              class="btn btn-primary"
+              :disabled="savingSchedule || !scheduleForm.name || !scheduleForm.cronExpr"
+              @click="createScheduledTask"
+            >
+              <i v-if="savingSchedule" class="pi pi-spin pi-spinner" />
+              {{ savingSchedule ? "Creating..." : "Create Schedule" }}
+            </button>
+          </div>
+        </div>
+      </div>
+    </Teleport>
+
+    <!-- Delete Backup Confirm Modal -->
+    <ConfirmModal
+      :visible="showDeleteBackupModal"
+      title="Delete Backup"
+      message="Are you sure you want to delete this backup? This action cannot be undone."
+      variant="warning"
+      confirm-text="Delete"
+      @confirm="deleteBackup"
+      @cancel="showDeleteBackupModal = false"
+    />
+
+    <!-- Delete Task Confirm Modal -->
+    <ConfirmModal
+      :visible="showDeleteTaskModal"
+      title="Delete Scheduled Task"
+      message="Are you sure you want to delete this scheduled task?"
+      variant="warning"
+      confirm-text="Delete"
+      @confirm="deleteTask"
+      @cancel="showDeleteTaskModal = false"
+    />
+
+    <!-- Restore Confirm Modal -->
+    <ConfirmModal
+      :visible="showRestoreModal"
+      title="Restore Backup"
+      :message="restoreMessage"
+      variant="warning"
+      confirm-text="Restore"
+      @confirm="restoreBackup"
+      @cancel="showRestoreModal = false"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, onUnmounted } from "vue";
+import { backupsApi, schedulerApi } from "@/services/api";
+import type { Backup, ScheduledTask, BackupJob } from "@/services/api";
+import { useNotificationsStore } from "@/stores/notifications";
+import ConfirmModal from "@/components/ConfirmModal.vue";
+
+const props = defineProps<{
+  deploymentName: string;
+}>();
+
+const notifications = useNotificationsStore();
+
+const backups = ref<Backup[]>([]);
+const loadingBackups = ref(false);
+const creatingBackup = ref(false);
+const restoringBackup = ref<string | null>(null);
+
+interface TrackedJob extends BackupJob {
+  retryCount?: number;
+}
+const activeJobs = ref<TrackedJob[]>([]);
+const MAX_JOB_RETRIES = 10;
+let jobPollingInterval: number | null = null;
+
+const scheduledTasks = ref<ScheduledTask[]>([]);
+const showScheduleModal = ref(false);
+const savingSchedule = ref(false);
+const initialScheduleFormState = () => ({
+  name: "",
+  cronExpr: "0 2 * * *",
+  retentionCount: 7,
+  enabled: true,
+});
+const scheduleForm = ref(initialScheduleFormState());
+
+const showDeleteBackupModal = ref(false);
+const backupToDelete = ref<string | null>(null);
+
+const showDeleteTaskModal = ref(false);
+const taskToDelete = ref<number | null>(null);
+
+const showRestoreModal = ref(false);
+const backupToRestore = ref<Backup | null>(null);
+const restoreMessage = ref("");
+
+const fetchBackups = async () => {
+  loadingBackups.value = true;
+  try {
+    const response = await backupsApi.getDeploymentBackups(props.deploymentName);
+    backups.value = response.data.backups || [];
+  } catch (err: any) {
+    notifications.error("Error", err.response?.data?.error || "Failed to load backups");
+  } finally {
+    loadingBackups.value = false;
+  }
+};
+
+const fetchScheduledTasks = async () => {
+  try {
+    const response = await schedulerApi.listTasks(props.deploymentName);
+    scheduledTasks.value = (response.data.tasks || []).filter(
+      (t) => t.type === "backup" && t.deployment_name === props.deploymentName,
+    );
+  } catch {
+    scheduledTasks.value = [];
+  }
+};
+
+const startJobPolling = () => {
+  if (jobPollingInterval) return;
+  jobPollingInterval = window.setInterval(pollActiveJobs, 2000);
+};
+
+const stopJobPolling = () => {
+  if (jobPollingInterval) {
+    clearInterval(jobPollingInterval);
+    jobPollingInterval = null;
+  }
+};
+
+const pollActiveJobs = async () => {
+  if (activeJobs.value.length === 0) {
+    stopJobPolling();
+    return;
+  }
+
+  const updatedJobs: TrackedJob[] = [];
+  for (const job of activeJobs.value) {
+    try {
+      const response = await backupsApi.getJob(job.id);
+      const updatedJob = response.data.job;
+
+      if (updatedJob.status === "completed") {
+        if (updatedJob.type === "backup") {
+          notifications.success("Backup Complete", "Backup has been created successfully");
+          creatingBackup.value = false;
+        } else {
+          notifications.success("Restore Complete", "Backup has been restored successfully");
+          restoringBackup.value = null;
+        }
+        await fetchBackups();
+      } else if (updatedJob.status === "failed") {
+        if (updatedJob.type === "backup") {
+          notifications.error("Backup Failed", updatedJob.error || "Backup creation failed");
+          creatingBackup.value = false;
+        } else {
+          notifications.error("Restore Failed", updatedJob.error || "Backup restore failed");
+          restoringBackup.value = null;
+        }
+      } else {
+        updatedJobs.push(updatedJob);
+      }
+    } catch {
+      const retryCount = (job.retryCount || 0) + 1;
+      if (retryCount < MAX_JOB_RETRIES) {
+        updatedJobs.push({ ...job, retryCount });
+      } else {
+        if (job.type === "backup") {
+          notifications.error("Backup Status Unknown", "Lost connection to backup job");
+          creatingBackup.value = false;
+        } else {
+          notifications.error("Restore Status Unknown", "Lost connection to restore job");
+          restoringBackup.value = null;
+        }
+      }
+    }
+  }
+  activeJobs.value = updatedJobs;
+
+  if (updatedJobs.length === 0) {
+    stopJobPolling();
+  }
+};
+
+const createBackup = async () => {
+  creatingBackup.value = true;
+  try {
+    const response = await backupsApi.createDeploymentBackup(props.deploymentName);
+    const jobId = response.data.job_id;
+    activeJobs.value.push({
+      id: jobId,
+      type: "backup",
+      status: "running",
+      deployment_name: props.deploymentName,
+      started_at: new Date().toISOString(),
+    });
+    notifications.success("Backup Started", "Backup creation has been initiated");
+    startJobPolling();
+  } catch (err: any) {
+    notifications.error("Backup Failed", err.response?.data?.error || "Failed to start backup");
+    creatingBackup.value = false;
+  }
+};
+
+const confirmDeleteBackup = (backupId: string) => {
+  backupToDelete.value = backupId;
+  showDeleteBackupModal.value = true;
+};
+
+const deleteBackup = async () => {
+  if (!backupToDelete.value) return;
+  try {
+    await backupsApi.delete(backupToDelete.value);
+    notifications.success("Deleted", "Backup has been deleted");
+    await fetchBackups();
+  } catch (err: any) {
+    notifications.error("Delete Failed", err.response?.data?.error || "Failed to delete backup");
+  } finally {
+    showDeleteBackupModal.value = false;
+    backupToDelete.value = null;
+  }
+};
+
+const confirmRestore = (backup: Backup) => {
+  backupToRestore.value = backup;
+  restoreMessage.value = `Are you sure you want to restore from backup "${backup.id}"? This will stop the deployment, restore data, and restart it.`;
+  showRestoreModal.value = true;
+};
+
+const restoreBackup = async () => {
+  if (!backupToRestore.value) return;
+  const backupId = backupToRestore.value.id;
+  restoringBackup.value = backupId;
+  showRestoreModal.value = false;
+  try {
+    const response = await backupsApi.restore(backupId, {
+      restore_data: true,
+      restore_db: true,
+      stop_first: true,
+    });
+    const jobId = response.data.job_id;
+    activeJobs.value.push({
+      id: jobId,
+      type: "restore",
+      status: "running",
+      deployment_name: props.deploymentName,
+      backup_id: backupId,
+      started_at: new Date().toISOString(),
+    });
+    notifications.success("Restore Started", "Backup restore has been initiated");
+    startJobPolling();
+  } catch (err: any) {
+    notifications.error("Restore Failed", err.response?.data?.error || "Failed to start restore");
+    restoringBackup.value = null;
+  } finally {
+    backupToRestore.value = null;
+  }
+};
+
+const getDownloadUrl = (backupId: string) => {
+  return backupsApi.download(backupId);
+};
+
+const createScheduledTask = async () => {
+  savingSchedule.value = true;
+  try {
+    await schedulerApi.createTask({
+      name: scheduleForm.value.name,
+      type: "backup",
+      deployment_name: props.deploymentName,
+      cron_expr: scheduleForm.value.cronExpr,
+      enabled: scheduleForm.value.enabled,
+      config: {
+        backup_config: {
+          retention_count: scheduleForm.value.retentionCount,
+        },
+      },
+    });
+    notifications.success("Schedule Created", "Backup schedule has been created");
+    showScheduleModal.value = false;
+    scheduleForm.value = initialScheduleFormState();
+    await fetchScheduledTasks();
+  } catch (err: any) {
+    notifications.error("Error", err.response?.data?.error || "Failed to create schedule");
+  } finally {
+    savingSchedule.value = false;
+  }
+};
+
+const toggleTask = async (task: ScheduledTask) => {
+  try {
+    await schedulerApi.updateTask(task.id, { enabled: !task.enabled });
+    await fetchScheduledTasks();
+  } catch (err: any) {
+    notifications.error("Error", err.response?.data?.error || "Failed to update task");
+  }
+};
+
+const runTaskNow = async (taskId: number) => {
+  try {
+    await schedulerApi.runTaskNow(taskId);
+    notifications.success("Task Started", "Backup task execution has been initiated");
+  } catch (err: any) {
+    notifications.error("Error", err.response?.data?.error || "Failed to run task");
+  }
+};
+
+const confirmDeleteTask = (taskId: number) => {
+  taskToDelete.value = taskId;
+  showDeleteTaskModal.value = true;
+};
+
+const deleteTask = async () => {
+  if (!taskToDelete.value) return;
+  try {
+    await schedulerApi.deleteTask(taskToDelete.value);
+    notifications.success("Deleted", "Scheduled task has been deleted");
+    await fetchScheduledTasks();
+  } catch (err: any) {
+    notifications.error("Delete Failed", err.response?.data?.error || "Failed to delete task");
+  } finally {
+    showDeleteTaskModal.value = false;
+    taskToDelete.value = null;
+  }
+};
+
+const formatBytes = (bytes: number): string => {
+  if (bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
+};
+
+const formatDate = (dateStr: string): string => {
+  const date = new Date(dateStr);
+  return date.toLocaleString();
+};
+
+onMounted(() => {
+  fetchBackups();
+  fetchScheduledTasks();
+});
+
+onUnmounted(() => {
+  stopJobPolling();
+});
+</script>
+
+<style scoped>
+.backups-tab {
+  padding: var(--space-4);
+}
+
+.backups-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: var(--space-4);
+}
+
+.backups-header h3 {
+  margin: 0;
+  font-size: var(--text-lg);
+  font-weight: var(--font-semibold);
+}
+
+.backups-actions {
+  display: flex;
+  gap: var(--space-2);
+}
+
+.loading-state,
+.empty-state {
+  text-align: center;
+  padding: var(--space-8);
+  color: var(--color-gray-500);
+}
+
+.empty-state i {
+  font-size: 3rem;
+  margin-bottom: var(--space-3);
+  color: var(--color-gray-300);
+}
+
+.empty-state h4 {
+  margin: 0 0 var(--space-2);
+  color: var(--color-gray-700);
+}
+
+.empty-state p {
+  margin: 0;
+}
+
+.backups-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-3);
+}
+
+.backup-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: var(--space-3) var(--space-4);
+  background: var(--color-gray-50);
+  border-radius: var(--radius-md);
+  border: 1px solid var(--color-gray-200);
+}
+
+.backup-info {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-1);
+}
+
+.backup-name {
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+  font-weight: var(--font-medium);
+  color: var(--color-gray-900);
+}
+
+.backup-meta {
+  display: flex;
+  gap: var(--space-3);
+  font-size: var(--text-sm);
+  color: var(--color-gray-500);
+}
+
+.backup-status {
+  padding: 2px 8px;
+  border-radius: var(--radius-full);
+  font-size: var(--text-xs);
+  text-transform: capitalize;
+}
+
+.backup-status.completed {
+  background: var(--color-success-100);
+  color: var(--color-success-700);
+}
+
+.backup-status.pending,
+.backup-status.in_progress {
+  background: var(--color-warning-100);
+  color: var(--color-warning-700);
+}
+
+.backup-status.failed {
+  background: var(--color-danger-100);
+  color: var(--color-danger-700);
+}
+
+.backup-components {
+  display: flex;
+  gap: var(--space-1);
+  margin-top: var(--space-1);
+}
+
+.component-badge {
+  padding: 2px 6px;
+  background: var(--color-primary-100);
+  color: var(--color-primary-700);
+  border-radius: var(--radius-sm);
+  font-size: var(--text-xs);
+}
+
+.backup-actions {
+  display: flex;
+  gap: var(--space-2);
+}
+
+.scheduled-backups-section {
+  margin-top: var(--space-6);
+  padding-top: var(--space-4);
+  border-top: 1px solid var(--color-gray-200);
+}
+
+.scheduled-backups-section h4 {
+  margin: 0 0 var(--space-3);
+  font-size: var(--text-md);
+  font-weight: var(--font-semibold);
+}
+
+.scheduled-tasks-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-2);
+}
+
+.scheduled-task-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: var(--space-3);
+  background: var(--color-gray-50);
+  border-radius: var(--radius-md);
+  border: 1px solid var(--color-gray-200);
+}
+
+.task-info {
+  display: flex;
+  align-items: center;
+  gap: var(--space-3);
+}
+
+.task-name {
+  font-weight: var(--font-medium);
+}
+
+.task-schedule {
+  font-family: monospace;
+  font-size: var(--text-sm);
+  color: var(--color-gray-600);
+  background: var(--color-gray-100);
+  padding: 2px 6px;
+  border-radius: var(--radius-sm);
+}
+
+.task-next {
+  font-size: var(--text-sm);
+  color: var(--color-gray-500);
+}
+
+.task-actions {
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+}
+
+.toggle-switch.small {
+  transform: scale(0.8);
+}
+
+/* Modal styles */
+.modal-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+}
+
+.modal-container {
+  background: white;
+  border-radius: var(--radius-lg);
+  box-shadow: var(--shadow-xl);
+  width: 480px;
+  max-width: 90vw;
+  max-height: 90vh;
+  overflow: auto;
+}
+
+.modal-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: var(--space-4);
+  border-bottom: 1px solid var(--color-gray-200);
+}
+
+.modal-header h3 {
+  margin: 0;
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+  font-size: var(--text-lg);
+}
+
+.close-btn {
+  background: none;
+  border: none;
+  padding: var(--space-2);
+  cursor: pointer;
+  color: var(--color-gray-500);
+  border-radius: var(--radius-sm);
+}
+
+.close-btn:hover {
+  background: var(--color-gray-100);
+}
+
+.modal-body {
+  padding: var(--space-4);
+}
+
+.modal-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: var(--space-2);
+  padding: var(--space-4);
+  border-top: 1px solid var(--color-gray-200);
+}
+
+.form-group {
+  margin-bottom: var(--space-4);
+}
+
+.form-group label {
+  display: block;
+  margin-bottom: var(--space-1);
+  font-weight: var(--font-medium);
+  color: var(--color-gray-700);
+}
+
+.form-control {
+  width: 100%;
+  padding: var(--space-2) var(--space-3);
+  border: 1px solid var(--color-gray-300);
+  border-radius: var(--radius-md);
+  font-size: var(--text-md);
+}
+
+.form-control:focus {
+  outline: none;
+  border-color: var(--color-primary-500);
+  box-shadow: 0 0 0 3px var(--color-primary-100);
+}
+
+.form-hint {
+  display: block;
+  margin-top: var(--space-1);
+  font-size: var(--text-sm);
+  color: var(--color-gray-500);
+}
+
+.form-hint code {
+  background: var(--color-gray-100);
+  padding: 1px 4px;
+  border-radius: var(--radius-sm);
+}
+
+.checkbox-label {
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+  cursor: pointer;
+}
+
+.checkbox-label input {
+  width: 16px;
+  height: 16px;
+}
+
+/* Button styles */
+.btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--space-2);
+  padding: var(--space-2) var(--space-3);
+  border: none;
+  border-radius: var(--radius-md);
+  font-weight: var(--font-medium);
+  font-size: var(--text-sm);
+  cursor: pointer;
+  transition: all var(--transition-base);
+  text-decoration: none;
+}
+
+.btn:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.btn-primary {
+  background: var(--color-primary-500);
+  color: white;
+}
+
+.btn-primary:hover:not(:disabled) {
+  background: var(--color-primary-600);
+}
+
+.btn-secondary {
+  background: var(--color-gray-100);
+  color: var(--color-gray-700);
+}
+
+.btn-secondary:hover:not(:disabled) {
+  background: var(--color-gray-200);
+}
+
+.btn-danger {
+  background: var(--color-danger-500);
+  color: white;
+}
+
+.btn-danger:hover:not(:disabled) {
+  background: var(--color-danger-600);
+}
+
+.btn-sm {
+  padding: var(--space-1) var(--space-2);
+  font-size: var(--text-xs);
+}
+
+/* Toggle switch */
+.toggle-switch {
+  position: relative;
+  display: inline-block;
+  width: 44px;
+  height: 24px;
+}
+
+.toggle-switch input {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.toggle-slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: var(--color-gray-300);
+  transition: 0.3s;
+  border-radius: 24px;
+}
+
+.toggle-slider::before {
+  position: absolute;
+  content: "";
+  height: 18px;
+  width: 18px;
+  left: 3px;
+  bottom: 3px;
+  background-color: white;
+  transition: 0.3s;
+  border-radius: 50%;
+}
+
+input:checked + .toggle-slider {
+  background-color: var(--color-primary-500);
+}
+
+input:checked + .toggle-slider::before {
+  transform: translateX(20px);
+}
+</style>
diff --git a/src/services/api.ts b/src/services/api.ts
index 9919230..b5c3794 100644
--- a/src/services/api.ts
+++ b/src/services/api.ts
@@ -759,3 +759,196 @@ export const trafficApi = {
       params: since ? { since } : undefined,
     }),
 };
+
+// Backup Types
+export interface Backup {
+  readonly id: string;
+  readonly deployment_name: string;
+  readonly status: "pending" | "in_progress" | "completed" | "failed";
+  readonly size: number;
+  readonly path: string;
+  readonly components: readonly string[];
+  readonly error?: string;
+  readonly created_at: string;
+  readonly completed_at?: string;
+  readonly expires_at?: string;
+}
+
+export interface BackupSpec {
+  readonly container_paths?: readonly ContainerBackupPath[];
+  readonly databases?: readonly DatabaseBackupSpec[];
+  readonly pre_hooks?: readonly BackupHookSpec[];
+  readonly post_hooks?: readonly BackupHookSpec[];
+  readonly exclude_patterns?: readonly string[];
+}
+
+export interface ContainerBackupPath {
+  readonly service: string;
+  readonly container_path: string;
+  readonly description?: string;
+  readonly required: boolean;
+}
+
+export interface DatabaseBackupSpec {
+  readonly service: string;
+  readonly type: string;
+  readonly host_env?: string;
+  readonly port_env?: string;
+  readonly user_env?: string;
+  readonly password_env?: string;
+  readonly database_env?: string;
+  readonly host?: string;
+  readonly port?: number;
+  readonly user?: string;
+  readonly database?: string;
+}
+
+export interface BackupHookSpec {
+  readonly service: string;
+  readonly command: string;
+  readonly timeout?: number;
+}
+
+export type BackupJobType = "backup" | "restore";
+export type BackupJobStatus = "pending" | "running" | "completed" | "failed";
+
+export interface BackupJob {
+  readonly id: string;
+  readonly type: BackupJobType;
+  readonly status: BackupJobStatus;
+  readonly deployment_name: string;
+  readonly backup_id?: string;
+  readonly progress?: string;
+  readonly error?: string;
+  readonly started_at: string;
+  readonly completed_at?: string;
+}
+
+export const backupsApi = {
+  list: (deployment?: string, limit?: number) =>
+    apiClient.get<{ backups: Backup[] }>("/backups", {
+      params: { deployment, limit },
+    }),
+
+  get: (id: string) => apiClient.get<{ backup: Backup }>(`/backups/${id}`),
+
+  create: (deploymentName: string) =>
+    apiClient.post<{ job_id: string; message: string }>("/backups", { deployment_name: deploymentName }),
+
+  delete: (id: string) => apiClient.delete<{ message: string }>(`/backups/${id}`),
+
+  restore: (id: string, options?: { restore_data?: boolean; restore_db?: boolean; stop_first?: boolean }) =>
+    apiClient.post<{ job_id: string; message: string }>(`/backups/${id}/restore`, options),
+
+  download: (id: string) => `${apiClient.defaults.baseURL}/backups/${id}/download`,
+
+  getDeploymentBackups: (name: string, limit?: number) =>
+    apiClient.get<{ backups: Backup[] }>(`/deployments/${name}/backups`, {
+      params: limit ? { limit } : undefined,
+    }),
+
+  createDeploymentBackup: (name: string) =>
+    apiClient.post<{ job_id: string; message: string }>(`/deployments/${name}/backups`),
+
+  getDeploymentBackupConfig: (name: string) =>
+    apiClient.get<{ backup_config: BackupSpec | null }>(`/deployments/${name}/backup-config`),
+
+  updateDeploymentBackupConfig: (name: string, config: BackupSpec) =>
+    apiClient.put<{ backup_config: BackupSpec }>(`/deployments/${name}/backup-config`, config),
+
+  getJob: (jobId: string) => apiClient.get<{ job: BackupJob }>(`/backups/jobs/${jobId}`),
+
+  listJobs: (deployment?: string, limit?: number) =>
+    apiClient.get<{ jobs: BackupJob[] }>("/backups/jobs", {
+      params: { deployment, limit },
+    }),
+};
+
+// Scheduler Types
+export type TaskType = "backup" | "command";
+export type TaskStatus = "pending" | "running" | "completed" | "failed";
+
+export interface ScheduledTask {
+  readonly id: number;
+  readonly name: string;
+  readonly type: TaskType;
+  readonly deployment_name: string;
+  readonly cron_expr: string;
+  readonly enabled: boolean;
+  readonly config: TaskConfig;
+  readonly last_run?: string;
+  readonly next_run?: string;
+  readonly created_at: string;
+  readonly updated_at: string;
+}
+
+export interface TaskConfig {
+  readonly backup_config?: BackupTaskConfig;
+  readonly command_config?: CommandTaskConfig;
+}
+
+export interface BackupTaskConfig {
+  readonly retention_count: number;
+  readonly storage_path?: string;
+}
+
+export interface CommandTaskConfig {
+  readonly service: string;
+  readonly command: string;
+  readonly timeout: number;
+}
+
+export interface TaskExecution {
+  readonly id: number;
+  readonly task_id: number;
+  readonly status: TaskStatus;
+  readonly output?: string;
+  readonly error?: string;
+  readonly started_at: string;
+  readonly ended_at?: string;
+  readonly duration_ms?: number;
+}
+
+export interface CreateTaskRequest {
+  name: string;
+  type: TaskType;
+  deployment_name: string;
+  cron_expr: string;
+  enabled: boolean;
+  config: TaskConfig;
+}
+
+export interface UpdateTaskRequest {
+  name?: string;
+  cron_expr?: string;
+  enabled?: boolean;
+  config?: TaskConfig;
+}
+
+export const schedulerApi = {
+  listTasks: (deployment?: string) =>
+    apiClient.get<{ tasks: ScheduledTask[] }>("/scheduler/tasks", {
+      params: deployment ? { deployment } : undefined,
+    }),
+
+  getTask: (id: number) => apiClient.get<{ task: ScheduledTask }>(`/scheduler/tasks/${id}`),
+
+  createTask: (data: CreateTaskRequest) => apiClient.post<{ task: ScheduledTask }>("/scheduler/tasks", data),
+
+  updateTask: (id: number, data: UpdateTaskRequest) =>
+    apiClient.put<{ task: ScheduledTask }>(`/scheduler/tasks/${id}`, data),
+
+  deleteTask: (id: number) => apiClient.delete<{ message: string }>(`/scheduler/tasks/${id}`),
+
+  runTaskNow: (id: number) => apiClient.post<{ message: string }>(`/scheduler/tasks/${id}/run`),
+
+  getTaskExecutions: (taskId: number, limit?: number) =>
+    apiClient.get<{ executions: TaskExecution[] }>(`/scheduler/tasks/${taskId}/executions`, {
+      params: limit ? { limit } : undefined,
+    }),
+
+  getRecentExecutions: (limit?: number) =>
+    apiClient.get<{ executions: TaskExecution[] }>("/scheduler/executions", {
+      params: limit ? { limit } : undefined,
+    }),
+};
diff --git a/src/views/DeploymentDetailView.test.ts b/src/views/DeploymentDetailView.test.ts
index ce2d245..29c4742 100644
--- a/src/views/DeploymentDetailView.test.ts
+++ b/src/views/DeploymentDetailView.test.ts
@@ -155,11 +155,11 @@ describe("DeploymentDetailView", () => {
   });
 
   describe("Tab navigation", () => {
-    it("displays all eight tabs", async () => {
+    it("displays all nine tabs", async () => {
       const wrapper = mountView();
       await flushPromises();
       const tabs = wrapper.findAll(".tab-btn");
-      expect(tabs.length).toBe(8);
+      expect(tabs.length).toBe(9);
     });
 
     it("has Overview tab", async () => {
@@ -198,6 +198,12 @@ describe("DeploymentDetailView", () => {
       expect(wrapper.text()).toContain("Quick Actions");
     });
 
+    it("has Backups tab", async () => {
+      const wrapper = mountView();
+      await flushPromises();
+      expect(wrapper.text()).toContain("Backups");
+    });
+
     it("has Security tab", async () => {
       const wrapper = mountView();
       await flushPromises();
@@ -239,6 +245,7 @@ describe("DeploymentDetailView", () => {
         { id: "terminal", label: "Terminal", icon: "pi pi-desktop" },
         { id: "environment", label: "Environment", icon: "pi pi-list" },
         { id: "actions", label: "Quick Actions", icon: "pi pi-bolt" },
+        { id: "backups", label: "Backups", icon: "pi pi-history" },
         { id: "security", label: "Security", icon: "pi pi-shield" },
         { id: "config", label: "Configuration", icon: "pi pi-cog" },
       ]);
diff --git a/src/views/DeploymentDetailView.vue b/src/views/DeploymentDetailView.vue
index 5d6fb58..e2c0a9d 100644
--- a/src/views/DeploymentDetailView.vue
+++ b/src/views/DeploymentDetailView.vue
@@ -498,6 +498,8 @@
           </div>
         </div>
 
+        <BackupsTab v-if="activeTab === 'backups'" :deployment-name="route.params.name as string" />
+
         <div v-if="activeTab === 'security'" class="security-tab">
           <div class="security-enable-bar">
             <div class="enable-bar-left">
@@ -1250,6 +1252,7 @@ import FileBrowser from "@/components/FileBrowser.vue";
 import LogViewer from "@/components/LogViewer.vue";
 import ConfirmModal from "@/components/ConfirmModal.vue";
 import ContainerTerminal from "@/components/ContainerTerminal.vue";
+import BackupsTab from "@/components/BackupsTab.vue";
 
 const route = useRoute();
 const router = useRouter();
@@ -1298,6 +1301,7 @@ const tabs = [
   { id: "terminal", label: "Terminal", icon: "pi pi-desktop" },
   { id: "environment", label: "Environment", icon: "pi pi-list" },
   { id: "actions", label: "Quick Actions", icon: "pi pi-bolt" },
+  { id: "backups", label: "Backups", icon: "pi pi-history" },
   { id: "security", label: "Security", icon: "pi pi-shield" },
   { id: "config", label: "Configuration", icon: "pi pi-cog" },
 ];
@@ -1310,6 +1314,9 @@ const resourceUsage = ref({
   network: 0,
 });
 
+const showDeleteEnvModal = ref(false);
+const envKeyToDelete = ref("");
+
 const logs = ref("");
 const logsLoading = ref(false);
 const logsService = ref("all");
@@ -1372,9 +1379,6 @@ const actionForm = ref({
   icon: "pi pi-play",
   service: "",
 });
-const showDeleteEnvModal = ref(false);
-const envKeyToDelete = ref("");
-
 const showDomainSettingsModal = ref(false);
 const savingDomainSettings = ref(false);
 const domainSettings = ref({