init

2026-01-23 12:23:25 +03:00
parent a3e941b19f
commit 71f772f2b9
14 changed files with 569 additions and 131 deletions
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -10,9 +10,12 @@
      "dependencies": {
        "@tailwindcss/postcss": "^4.1.18",
        "axios": "^1.13.2",
+        "i18next": "^25.8.0",
+        "i18next-browser-languagedetector": "^8.2.0",
        "lucide-react": "^0.561.0",
        "react": "^19.2.0",
        "react-dom": "^19.2.0",
+        "react-i18next": "^16.5.3",
        "react-router-dom": "^7.10.1",
        "zustand": "^5.0.9"
      },
@@ -280,6 +283,15 @@
        "@babel/core": "^7.0.0-0"
      }
    },
+    "node_modules/@babel/runtime": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.6.tgz",
+      "integrity": "sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
    "node_modules/@babel/template": {
      "version": "7.27.2",
      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz",
@@ -2988,6 +3000,55 @@
        "hermes-estree": "0.25.1"
      }
    },
+    "node_modules/html-parse-stringify": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz",
+      "integrity": "sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==",
+      "license": "MIT",
+      "dependencies": {
+        "void-elements": "3.1.0"
+      }
+    },
+    "node_modules/i18next": {
+      "version": "25.8.0",
+      "resolved": "https://registry.npmjs.org/i18next/-/i18next-25.8.0.tgz",
+      "integrity": "sha512-urrg4HMFFMQZ2bbKRK7IZ8/CTE7D8H4JRlAwqA2ZwDRFfdd0K/4cdbNNLgfn9mo+I/h9wJu61qJzH7jCFAhUZQ==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://locize.com"
+        },
+        {
+          "type": "individual",
+          "url": "https://locize.com/i18next.html"
+        },
+        {
+          "type": "individual",
+          "url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.28.4"
+      },
+      "peerDependencies": {
+        "typescript": "^5"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/i18next-browser-languagedetector": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/i18next-browser-languagedetector/-/i18next-browser-languagedetector-8.2.0.tgz",
+      "integrity": "sha512-P+3zEKLnOF0qmiesW383vsLdtQVyKtCNA9cjSoKCppTKPQVfKd2W8hbVo5ZhNJKDqeM7BOcvNoKJOjpHh4Js9g==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.23.2"
+      }
+    },
    "node_modules/ignore": {
      "version": "5.3.2",
      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@@ -3731,6 +3792,33 @@
        "react": "^19.2.1"
      }
    },
+    "node_modules/react-i18next": {
+      "version": "16.5.3",
+      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-16.5.3.tgz",
+      "integrity": "sha512-fo+/NNch37zqxOzlBYrWMx0uy/yInPkRfjSuy4lqKdaecR17nvCHnEUt3QyzA8XjQ2B/0iW/5BhaHR3ZmukpGw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.28.4",
+        "html-parse-stringify": "^3.0.1",
+        "use-sync-external-store": "^1.6.0"
+      },
+      "peerDependencies": {
+        "i18next": ">= 25.6.2",
+        "react": ">= 16.8.0",
+        "typescript": "^5"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        },
+        "react-native": {
+          "optional": true
+        },
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/react-refresh": {
      "version": "0.18.0",
      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.18.0.tgz",
@@ -3977,7 +4065,7 @@
      "version": "5.9.3",
      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
      "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
-      "dev": true,
+      "devOptional": true,
      "license": "Apache-2.0",
      "bin": {
        "tsc": "bin/tsc",
@@ -4059,6 +4147,15 @@
        "punycode": "^2.1.0"
      }
    },
+    "node_modules/use-sync-external-store": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.6.0.tgz",
+      "integrity": "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
    "node_modules/vite": {
      "version": "7.2.7",
      "resolved": "https://registry.npmjs.org/vite/-/vite-7.2.7.tgz",
@@ -4134,6 +4231,15 @@
        }
      }
    },
+    "node_modules/void-elements": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",
+      "integrity": "sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/which": {
      "version": "2.0.2",
      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -12,9 +12,12 @@
  "dependencies": {
    "@tailwindcss/postcss": "^4.1.18",
    "axios": "^1.13.2",
+    "i18next": "^25.8.0",
+    "i18next-browser-languagedetector": "^8.2.0",
    "lucide-react": "^0.561.0",
    "react": "^19.2.0",
    "react-dom": "^19.2.0",
+    "react-i18next": "^16.5.3",
    "react-router-dom": "^7.10.1",
    "zustand": "^5.0.9"
  },
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 import { BrowserRouter, Routes, Route, Navigate, useLocation } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 import Login from './pages/Login';
 import FamilyView from './pages/FamilyView';
 import AdminPanel from './pages/AdminPanel';
@@ -10,6 +11,7 @@ import { authApi } from './api/client';
 import { Loader2 } from 'lucide-react';

 function AppContent() {
+  const { t } = useTranslation();
  const { user, isAuthenticated, isLoading, setUser, setIsLoading } = useStore();
  const location = useLocation();

@@ -41,7 +43,7 @@ function AppContent() {
      <div className="min-h-screen flex items-center justify-center gradient-bg">
        <div className="flex items-center gap-3 text-white">
          <Loader2 className="w-8 h-8 animate-spin" />
-          <span className="text-xl font-medium">Загрузка...</span>
+          <span className="text-xl font-medium">{t('common.loading')}</span>
        </div>
      </div>
    );
--- a/frontend/src/components/ConfirmModal.tsx
+++ b/frontend/src/components/ConfirmModal.tsx
@@ -1,3 +1,4 @@
+import { useTranslation } from 'react-i18next';
 import { X, AlertTriangle } from 'lucide-react';

 interface ConfirmModalProps {
@@ -13,12 +14,15 @@ interface ConfirmModalProps {
 export default function ConfirmModal({
  title,
  message,
-  confirmText = 'Подтвердить',
-  cancelText = 'Отмена',
+  confirmText,
+  cancelText,
  onConfirm,
  onCancel,
  variant = 'danger',
 }: ConfirmModalProps) {
+  const { t } = useTranslation();
+  const defaultConfirmText = confirmText || t('common.confirm');
+  const defaultCancelText = cancelText || t('common.cancel');
  const getVariantStyles = () => {
    switch (variant) {
      case 'danger':
@@ -67,13 +71,13 @@ export default function ConfirmModal({
            onClick={onCancel}
            className="flex-1 px-6 py-3 bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-2xl transition-all font-semibold"
          >
-            {cancelText}
+            {defaultCancelText}
          </button>
          <button
            onClick={onConfirm}
            className={`flex-1 px-6 py-3 text-white rounded-2xl transition-all font-semibold ${styles.confirmButton}`}
          >
-            {confirmText}
+            {defaultConfirmText}
          </button>
        </div>
      </div>
--- a/frontend/src/components/ShoppingListModal.tsx
+++ b/frontend/src/components/ShoppingListModal.tsx
@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { shoppingItemApi } from '../api/client';
 import type { ShoppingItem } from '../types';
 import {
@@ -23,6 +24,7 @@ type ConfirmAction =
  | { type: 'clear-all' };

 export default function ShoppingListModal({ familyId, onClose }: ShoppingListModalProps) {
+  const { t } = useTranslation();
  const [items, setItems] = useState<ShoppingItem[]>([]);
  const [loading, setLoading] = useState(true);
  const [newItemName, setNewItemName] = useState('');
@@ -41,7 +43,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
      setItems(response.data);
    } catch (err) {
      console.error('Error loading shopping items:', err);
-      alert('Ошибка загрузки списка покупок');
+      alert(t('shopping.loadError'));
    } finally {
      setLoading(false);
    }
@@ -56,7 +58,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
      loadItems();
    } catch (err) {
      console.error('Error adding item:', err);
-      alert('Ошибка добавления покупки');
+      alert(t('shopping.addError'));
    }
  };

@@ -66,7 +68,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
      loadItems();
    } catch (err) {
      console.error('Error toggling purchased status:', err);
-      alert('Ошибка изменения статуса');
+      alert(t('shopping.toggleError'));
    }
  };

@@ -80,7 +82,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
      loadItems();
    } catch (err) {
      console.error('Error deleting item:', err);
-      alert('Ошибка удаления покупки');
+      alert(t('shopping.deleteError'));
    }
  };

@@ -99,7 +101,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
      loadItems();
    } catch (err) {
      console.error('Error updating item:', err);
-      alert('Ошибка обновления покупки');
+      alert(t('shopping.updateError'));
    }
  };

@@ -118,7 +120,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
      loadItems();
    } catch (err) {
      console.error('Error marking all as purchased:', err);
-      alert('Ошибка обновления списка');
+      alert(t('shopping.markAllError'));
    }
  };

@@ -132,7 +134,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
      loadItems();
    } catch (err) {
      console.error('Error clearing all items:', err);
-      alert('Ошибка очистки списка');
+      alert(t('shopping.clearError'));
    }
  };

@@ -160,22 +162,22 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
    switch (confirmAction.type) {
      case 'delete-item':
        return {
-          title: 'Удалить покупку?',
-          message: 'Покупка будет удалена из списка безвозвратно.',
-          confirmText: 'Удалить',
+          title: t('confirm.deleteItem'),
+          message: t('confirm.deleteItemMessage'),
+          confirmText: t('common.delete'),
        };
      case 'mark-all':
        return {
-          title: 'Пометить все как купленные?',
-          message: 'Все покупки в списке будут отмечены как купленные.',
-          confirmText: 'Пометить',
+          title: t('confirm.markAll'),
+          message: t('confirm.markAllMessage'),
+          confirmText: t('confirm.markButton'),
          variant: 'info' as const,
        };
      case 'clear-all':
        return {
-          title: 'Очистить список?',
-          message: 'Все покупки будут удалены из списка безвозвратно.',
-          confirmText: 'Очистить',
+          title: t('confirm.clearAll'),
+          message: t('confirm.clearAllMessage'),
+          confirmText: t('shopping.clear'),
        };
    }
  };
@@ -193,7 +195,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
              <div className="p-3 bg-white/20 backdrop-blur-md rounded-2xl">
                <ShoppingCart className="w-8 h-8 text-white" />
              </div>
-              <h2 className="text-3xl font-bold text-white">Список покупок</h2>
+              <h2 className="text-3xl font-bold text-white">{t('shopping.title')}</h2>
            </div>
            <button
              onClick={onClose}
@@ -208,7 +210,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
              <div className="flex gap-2">
                <input
                  type="text"
-                  placeholder="Добавить покупку..."
+                  placeholder={t('shopping.addPlaceholder')}
                  value={newItemName}
                  onChange={(e) => setNewItemName(e.target.value)}
                  onKeyPress={(e) => e.key === 'Enter' && handleAddItem()}
@@ -219,7 +221,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
                  className="px-6 py-3 bg-gradient-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-lg transition-all font-semibold flex items-center gap-2"
                >
                  <Plus className="w-5 h-5" />
-                  <span className="hidden sm:inline">Добавить</span>
+                  <span className="hidden sm:inline">{t('common.add')}</span>
                </button>
              </div>
            </div>
@@ -232,7 +234,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
              <div className="space-y-6">
                {unpurchasedItems.length > 0 && (
                  <div>
-                    <h3 className="text-lg font-semibold text-gray-700 mb-3">К покупке</h3>
+                    <h3 className="text-lg font-semibold text-gray-700 mb-3">{t('shopping.toBuy')}</h3>
                    <div className="space-y-2">
                      {unpurchasedItems.map((item) => (
                        <div
@@ -295,7 +297,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod

                {purchasedItems.length > 0 && (
                  <div>
-                    <h3 className="text-lg font-semibold text-gray-700 mb-3">Куплено</h3>
+                    <h3 className="text-lg font-semibold text-gray-700 mb-3">{t('shopping.purchased')}</h3>
                    <div className="space-y-2">
                      {purchasedItems.map((item) => (
                        <div
@@ -328,7 +330,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
                {items.length === 0 && (
                  <div className="text-center py-12 text-gray-500">
                    <ShoppingCart className="w-16 h-16 mx-auto mb-4 opacity-30" />
-                    <p className="text-lg">Список покупок пуст</p>
+                    <p className="text-lg">{t('shopping.empty')}</p>
                  </div>
                )}
              </div>
@@ -343,14 +345,14 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
                  className="flex-1 flex items-center justify-center gap-2 px-4 py-3 bg-gradient-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-lg transition-all font-semibold"
                >
                  <Check className="w-5 h-5" />
-                  Все куплено
+                  {t('shopping.allPurchased')}
                </button>
                <button
                  onClick={handleClearAll}
                  className="flex-1 flex items-center justify-center gap-2 px-4 py-3 bg-gradient-to-r from-red-500 to-red-600 text-white rounded-2xl hover:shadow-lg transition-all font-semibold"
                >
                  <Trash2 className="w-5 h-5" />
-                  Очистить
+                  {t('shopping.clear')}
                </button>
              </div>
            </div>
--- a/frontend/src/i18n/index.ts
+++ b/frontend/src/i18n/index.ts
@@ -0,0 +1,26 @@
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+import LanguageDetector from 'i18next-browser-languagedetector';
+
+import ru from './locales/ru.json';
+import en from './locales/en.json';
+
+i18n
+  .use(LanguageDetector)
+  .use(initReactI18next)
+  .init({
+    resources: {
+      ru: { translation: ru },
+      en: { translation: en },
+    },
+    fallbackLng: 'ru',
+    interpolation: {
+      escapeValue: false,
+    },
+    detection: {
+      order: ['navigator', 'htmlTag', 'localStorage'],
+      caches: ['localStorage'],
+    },
+  });
+
+export default i18n;
--- a/frontend/src/i18n/locales/en.json
+++ b/frontend/src/i18n/locales/en.json
@@ -0,0 +1,143 @@
+{
+  "common": {
+    "loading": "Loading...",
+    "error": "Error",
+    "cancel": "Cancel",
+    "confirm": "Confirm",
+    "delete": "Delete",
+    "add": "Add",
+    "create": "Create",
+    "save": "Save",
+    "back": "Back",
+    "toHome": "Home",
+    "logout": "Log out",
+    "exit": "Exit",
+    "currency": "$"
+  },
+  "login": {
+    "title": "Family Budget",
+    "subtitle": "Sign in to continue",
+    "googleButton": "Sign in with Google",
+    "authError": "Error getting authorization link"
+  },
+  "noFamily": {
+    "welcome": "Welcome!",
+    "createFamily": "Create your family",
+    "familyName": "Family name",
+    "familyNameRequired": "Family name *",
+    "familyNamePlaceholder": "For example: Smith Family",
+    "password": "Password",
+    "passwordOptional": "(optional)",
+    "passwordPlaceholder": "For access protection",
+    "passwordHint": "Password will be needed to access the family budget",
+    "createButton": "Create family",
+    "adminPanel": "Admin panel",
+    "enterFamilyName": "Enter family name",
+    "alreadyInFamily": "You are already in a family",
+    "createError": "Error creating family",
+    "joiningFamily": "Joining family...",
+    "invalidInvite": "Invite link is invalid or expired",
+    "joinError": "Error joining family"
+  },
+  "family": {
+    "defaultName": "Family",
+    "totalLimit": "Total limit",
+    "totalRemaining": "Total remaining",
+    "shoppingList": "Shopping list",
+    "inviteMember": "Invite member",
+    "loadError": "Error loading categories"
+  },
+  "category": {
+    "remaining": "Remaining:",
+    "limit": "Limit:",
+    "percentRemaining": "% remaining",
+    "addExpense": "Add expense",
+    "expense": "Expense",
+    "reset": "Reset",
+    "history": "History",
+    "management": "Category management",
+    "newCategory": "New category",
+    "categoryName": "Category name",
+    "categoryLimit": "Limit ($)",
+    "addCategory": "Add category",
+    "deleteConfirm": "Delete category?",
+    "resetConfirm": "Delete all expenses for this category?",
+    "createError": "Error creating category",
+    "deleteError": "Error deleting category",
+    "resetError": "Error resetting expenses"
+  },
+  "expense": {
+    "addTitle": "Add expense",
+    "amount": "Amount ($)",
+    "amountPlaceholder": "0.00",
+    "description": "Description",
+    "descriptionPlaceholder": "Optional",
+    "historyTitle": "Expense history",
+    "noExpenses": "No expenses",
+    "addError": "Error adding expense",
+    "historyError": "Error loading expense history"
+  },
+  "invite": {
+    "title": "Invite member",
+    "description": "Create an invite link to add a new member to the family. The link will be valid for 7 days.",
+    "createLink": "Create link",
+    "creating": "Creating...",
+    "sendLink": "Send this link to the person you want to invite:",
+    "copyLink": "Copy link",
+    "copied": "Copied!",
+    "createError": "Error creating invite link",
+    "pageTitle": "Family invitation",
+    "pageDescription": "You have been invited to join a family budget. Sign in with Google to accept the invitation.",
+    "loginAndJoin": "Sign in and join",
+    "validating": "Validating invitation...",
+    "joining": "Joining family...",
+    "invalid": "Link is invalid or has expired",
+    "notFound": "Link not found",
+    "alreadyInFamily": "You are already in a family",
+    "joinError": "Error joining family"
+  },
+  "admin": {
+    "title": "Admin panel",
+    "subtitle": "Family management",
+    "accessDenied": "Access denied",
+    "requiresAdmin": "Administrator rights required",
+    "createFamily": "Create new family",
+    "familyName": "Family name",
+    "familyNamePlaceholder": "For example: Smith Family",
+    "familyPassword": "Family password",
+    "familyPasswordPlaceholder": "Protect your family with a password",
+    "createButton": "Create family",
+    "familyList": "Family list",
+    "noFamilies": "No families found",
+    "createFirst": "Create the first family",
+    "fillNameAndPassword": "Fill in the family name and password",
+    "createError": "Error creating family",
+    "deleteConfirm": "Delete family?",
+    "deleteError": "Error deleting family"
+  },
+  "shopping": {
+    "title": "Shopping list",
+    "addPlaceholder": "Add item...",
+    "toBuy": "To buy",
+    "purchased": "Purchased",
+    "empty": "Shopping list is empty",
+    "allPurchased": "All purchased",
+    "clear": "Clear",
+    "loadError": "Error loading shopping list",
+    "addError": "Error adding item",
+    "toggleError": "Error changing status",
+    "deleteError": "Error deleting item",
+    "updateError": "Error updating item",
+    "markAllError": "Error updating list",
+    "clearError": "Error clearing list"
+  },
+  "confirm": {
+    "deleteItem": "Delete item?",
+    "deleteItemMessage": "The item will be permanently removed from the list.",
+    "markAll": "Mark all as purchased?",
+    "markAllMessage": "All items in the list will be marked as purchased.",
+    "markButton": "Mark",
+    "clearAll": "Clear list?",
+    "clearAllMessage": "All items will be permanently removed from the list."
+  }
+}
--- a/frontend/src/i18n/locales/ru.json
+++ b/frontend/src/i18n/locales/ru.json
@@ -0,0 +1,143 @@
+{
+  "common": {
+    "loading": "Загрузка...",
+    "error": "Ошибка",
+    "cancel": "Отмена",
+    "confirm": "Подтвердить",
+    "delete": "Удалить",
+    "add": "Добавить",
+    "create": "Создать",
+    "save": "Сохранить",
+    "back": "Назад",
+    "toHome": "На главную",
+    "logout": "Выйти",
+    "exit": "Выход",
+    "currency": "₽"
+  },
+  "login": {
+    "title": "Семейный бюджет",
+    "subtitle": "Войдите, чтобы продолжить",
+    "googleButton": "Войти через Google",
+    "authError": "Ошибка при получении ссылки для авторизации"
+  },
+  "noFamily": {
+    "welcome": "Добро пожаловать!",
+    "createFamily": "Создайте свою семью",
+    "familyName": "Название семьи",
+    "familyNameRequired": "Название семьи *",
+    "familyNamePlaceholder": "Например: Семья Ивановых",
+    "password": "Пароль",
+    "passwordOptional": "(необязательно)",
+    "passwordPlaceholder": "Для защиты доступа",
+    "passwordHint": "Пароль понадобится для доступа к бюджету семьи",
+    "createButton": "Создать семью",
+    "adminPanel": "Админ панель",
+    "enterFamilyName": "Введите название семьи",
+    "alreadyInFamily": "Вы уже состоите в семье",
+    "createError": "Ошибка при создании семьи",
+    "joiningFamily": "Присоединение к семье...",
+    "invalidInvite": "Ссылка-приглашение недействительна или истекла",
+    "joinError": "Ошибка при присоединении к семье"
+  },
+  "family": {
+    "defaultName": "Семья",
+    "totalLimit": "Общий лимит",
+    "totalRemaining": "Общий остаток",
+    "shoppingList": "Список покупок",
+    "inviteMember": "Пригласить участника",
+    "loadError": "Ошибка загрузки категорий"
+  },
+  "category": {
+    "remaining": "Остаток:",
+    "limit": "Лимит:",
+    "percentRemaining": "% осталось",
+    "addExpense": "Добавить расход",
+    "expense": "Расход",
+    "reset": "Обнулить",
+    "history": "История",
+    "management": "Управление категориями",
+    "newCategory": "Новая категория",
+    "categoryName": "Название категории",
+    "categoryLimit": "Лимит (₽)",
+    "addCategory": "Добавить категорию",
+    "deleteConfirm": "Удалить категорию?",
+    "resetConfirm": "Удалить все траты по этой категории?",
+    "createError": "Ошибка создания категории",
+    "deleteError": "Ошибка удаления категории",
+    "resetError": "Ошибка сброса трат"
+  },
+  "expense": {
+    "addTitle": "Добавить расход",
+    "amount": "Сумма (₽)",
+    "amountPlaceholder": "0.00",
+    "description": "Описание",
+    "descriptionPlaceholder": "Опционально",
+    "historyTitle": "История трат",
+    "noExpenses": "Нет трат",
+    "addError": "Ошибка добавления расхода",
+    "historyError": "Ошибка загрузки истории трат"
+  },
+  "invite": {
+    "title": "Пригласить участника",
+    "description": "Создайте ссылку-приглашение, чтобы добавить нового участника в семью. Ссылка будет действительна 7 дней.",
+    "createLink": "Создать ссылку",
+    "creating": "Создание...",
+    "sendLink": "Отправьте эту ссылку участнику, которого хотите пригласить:",
+    "copyLink": "Скопировать ссылку",
+    "copied": "Скопировано!",
+    "createError": "Ошибка создания ссылки-приглашения",
+    "pageTitle": "Приглашение в семью",
+    "pageDescription": "Вас пригласили присоединиться к семейному бюджету. Войдите через Google, чтобы принять приглашение.",
+    "loginAndJoin": "Войти и присоединиться",
+    "validating": "Проверка приглашения...",
+    "joining": "Присоединение к семье...",
+    "invalid": "Ссылка недействительна или срок её действия истёк",
+    "notFound": "Ссылка не найдена",
+    "alreadyInFamily": "Вы уже состоите в семье",
+    "joinError": "Ошибка при присоединении к семье"
+  },
+  "admin": {
+    "title": "Админ панель",
+    "subtitle": "Управление семьями",
+    "accessDenied": "Доступ запрещен",
+    "requiresAdmin": "Требуются права администратора",
+    "createFamily": "Создать новую семью",
+    "familyName": "Название семьи",
+    "familyNamePlaceholder": "Например: Семья Ивановых",
+    "familyPassword": "Пароль семьи",
+    "familyPasswordPlaceholder": "Защитите семью паролем",
+    "createButton": "Создать семью",
+    "familyList": "Список семей",
+    "noFamilies": "Семьи не найдены",
+    "createFirst": "Создайте первую семью",
+    "fillNameAndPassword": "Заполните название и пароль семьи",
+    "createError": "Ошибка создания семьи",
+    "deleteConfirm": "Удалить семью?",
+    "deleteError": "Ошибка удаления семьи"
+  },
+  "shopping": {
+    "title": "Список покупок",
+    "addPlaceholder": "Добавить покупку...",
+    "toBuy": "К покупке",
+    "purchased": "Куплено",
+    "empty": "Список покупок пуст",
+    "allPurchased": "Все куплено",
+    "clear": "Очистить",
+    "loadError": "Ошибка загрузки списка покупок",
+    "addError": "Ошибка добавления покупки",
+    "toggleError": "Ошибка изменения статуса",
+    "deleteError": "Ошибка удаления покупки",
+    "updateError": "Ошибка обновления покупки",
+    "markAllError": "Ошибка обновления списка",
+    "clearError": "Ошибка очистки списка"
+  },
+  "confirm": {
+    "deleteItem": "Удалить покупку?",
+    "deleteItemMessage": "Покупка будет удалена из списка безвозвратно.",
+    "markAll": "Пометить все как купленные?",
+    "markAllMessage": "Все покупки в списке будут отмечены как купленные.",
+    "markButton": "Пометить",
+    "clearAll": "Очистить список?",
+    "clearAllMessage": "Все покупки будут удалены из списка безвозвратно."
+  }
+}
--- a/frontend/src/main.tsx
+++ b/frontend/src/main.tsx
@@ -1,5 +1,6 @@
 import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
+import './i18n'
 import './index.css'
 import App from './App.tsx'

--- a/frontend/src/pages/AdminPanel.tsx
+++ b/frontend/src/pages/AdminPanel.tsx
@@ -1,5 +1,6 @@
 import { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 import { authApi, familyApi } from '../api/client';
 import { useStore } from '../store/useStore';
 import {
@@ -14,6 +15,7 @@ import {
 } from 'lucide-react';

 export default function AdminPanel() {
+  const { t } = useTranslation();
  const navigate = useNavigate();
  const { user, logout: storeLogout } = useStore();

@@ -46,7 +48,7 @@ export default function AdminPanel() {

  const handleCreateFamily = async () => {
    if (!newFamilyName.trim() || !newFamilyPassword.trim()) {
-      alert('Заполните название и пароль семьи');
+      alert(t('admin.fillNameAndPassword'));
      return;
    }

@@ -56,19 +58,19 @@ export default function AdminPanel() {
      setNewFamilyPassword('');
      loadFamilies();
    } catch (err) {
-      alert('Ошибка создания семьи');
+      alert(t('admin.createError'));
      console.error(err);
    }
  };

  const handleDeleteFamily = async (id: number) => {
-    if (!confirm('Удалить семью?')) return;
+    if (!confirm(t('admin.deleteConfirm'))) return;

    try {
      await familyApi.delete(id);
      loadFamilies();
    } catch (err) {
-      alert('Ошибка удаления семьи');
+      alert(t('admin.deleteError'));
      console.error(err);
    }
  };
@@ -84,17 +86,17 @@ export default function AdminPanel() {
              </div>
            </div>
            <h1 className="text-2xl sm:text-3xl font-bold text-gray-900 mb-2">
-              Доступ запрещен
+              {t('admin.accessDenied')}
            </h1>
            <p className="text-gray-600 mb-6 text-sm sm:text-base">
-              Требуются права администратора
+              {t('admin.requiresAdmin')}
            </p>
            <button
              onClick={() => navigate('/')}
              className="w-full flex items-center justify-center gap-2 px-4 py-3 bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-xl transition-all duration-300 font-medium"
            >
              <ArrowLeft className="w-5 h-5" />
-              Назад
+              {t('common.back')}
            </button>
          </div>
        </div>
@@ -110,10 +112,10 @@ export default function AdminPanel() {
            <Shield className="w-12 h-12 text-white" />
          </div>
          <h1 className="text-4xl sm:text-5xl font-bold text-white mb-2">
-            Админ панель
+            {t('admin.title')}
          </h1>
          <p className="text-purple-100 text-base sm:text-lg mb-6">
-            Управление семьями
+            {t('admin.subtitle')}
          </p>
          <div className="flex justify-center gap-3">
            <button
@@ -121,14 +123,14 @@ export default function AdminPanel() {
              className="inline-flex items-center gap-2 px-5 py-3 bg-red-500/80 hover:bg-red-600 text-white rounded-2xl backdrop-blur-md transition-all duration-300 hover:shadow-lg font-medium"
            >
              <LogOut className="w-5 h-5" />
-              Выход
+              {t('common.exit')}
            </button>
            <button
              onClick={() => navigate('/')}
              className="inline-flex items-center gap-2 px-5 py-3 bg-white/20 hover:bg-white/30 text-white rounded-2xl backdrop-blur-md transition-all duration-300 hover:shadow-lg font-medium"
            >
              <Home className="w-5 h-5" />
-              На главную
+              {t('common.toHome')}
            </button>
          </div>
        </div>
@@ -139,7 +141,7 @@ export default function AdminPanel() {
              <Plus className="w-8 h-8 text-white" />
            </div>
            <h2 className="text-2xl sm:text-3xl font-bold text-gray-800">
-              Создать новую семью
+              {t('admin.createFamily')}
            </h2>
          </div>

@@ -147,11 +149,11 @@ export default function AdminPanel() {
            <div>
              <label className="flex items-center justify-center gap-2 text-sm font-semibold text-gray-700 mb-3">
                <Users className="w-5 h-5 text-purple-600" />
-                Название семьи
+                {t('admin.familyName')}
              </label>
              <input
                type="text"
-                placeholder="Например: Семья Ивановых"
+                placeholder={t('admin.familyNamePlaceholder')}
                value={newFamilyName}
                onChange={(e) => setNewFamilyName(e.target.value)}
                className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:ring-2 focus:ring-purple-500 focus:border-purple-500 transition-all font-medium text-center"
@@ -160,11 +162,11 @@ export default function AdminPanel() {
            <div>
              <label className="flex items-center justify-center gap-2 text-sm font-semibold text-gray-700 mb-3">
                <Lock className="w-5 h-5 text-purple-600" />
-                Пароль семьи
+                {t('admin.familyPassword')}
              </label>
              <input
                type="password"
-                placeholder="Защитите семью паролем"
+                placeholder={t('admin.familyPasswordPlaceholder')}
                value={newFamilyPassword}
                onChange={(e) => setNewFamilyPassword(e.target.value)}
                className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:ring-2 focus:ring-purple-500 focus:border-purple-500 transition-all font-medium text-center"
@@ -175,7 +177,7 @@ export default function AdminPanel() {
              className="w-full flex items-center justify-center gap-2 px-6 py-4 bg-linear-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-xl transition-all duration-300 font-semibold text-lg"
            >
              <Plus className="w-6 h-6" />
-              Создать семью
+              {t('admin.createButton')}
            </button>
          </div>
        </div>
@@ -186,7 +188,7 @@ export default function AdminPanel() {
              <Users className="w-8 h-8 text-white" />
            </div>
            <h2 className="text-2xl sm:text-3xl font-bold text-gray-800">
-              Список семей
+              {t('admin.familyList')}
            </h2>
          </div>

@@ -196,10 +198,10 @@ export default function AdminPanel() {
                <Users className="w-20 h-20 text-purple-400" />
              </div>
              <p className="text-gray-600 text-lg sm:text-xl mb-2 font-semibold">
-                Семьи не найдены
+                {t('admin.noFamilies')}
              </p>
              <p className="text-gray-500 text-sm sm:text-base">
-                Создайте первую семью
+                {t('admin.createFirst')}
              </p>
            </div>
          ) : (
@@ -222,7 +224,7 @@ export default function AdminPanel() {
                    className="w-full sm:w-auto flex items-center justify-center gap-2 px-5 py-3 bg-red-500 hover:bg-red-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg"
                  >
                    <Trash2 className="w-5 h-5" />
-                    Удалить
+                    {t('common.delete')}
                  </button>
                </div>
              ))}
--- a/frontend/src/pages/FamilyView.tsx
+++ b/frontend/src/pages/FamilyView.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 import { categoryApi, expenseApi, inviteLinkApi } from '../api/client';
 import { useStore } from '../store/useStore';
 import type { Category, Expense, InviteLinkResponse } from '../types';
@@ -24,6 +25,7 @@ import {
 import ShoppingListModal from '../components/ShoppingListModal';

 export default function FamilyView() {
+  const { t } = useTranslation();
  const { familyId } = useParams<{ familyId: string }>();
  const navigate = useNavigate();
  const { selectedFamily } = useStore();
@@ -82,7 +84,7 @@ export default function FamilyView() {
      setRemainingLimits(limits);
      console.log('All data loaded successfully');
    } catch (err: any) {
-      const errorMsg = err.response?.data?.message || err.message || 'Ошибка загрузки категорий';
+      const errorMsg = err.response?.data?.message || err.message || t('family.loadError');
      setError(errorMsg);
      console.error('Error loading categories:', err);
    } finally {
@@ -103,28 +105,28 @@ export default function FamilyView() {
      setShowAddCategory(false);
      loadCategories();
    } catch (err: any) {
-      const errorMsg = err.response?.data?.message || err.response?.statusText || err.message || 'Ошибка создания категории';
-      alert(`Ошибка создания категории: ${errorMsg} (Статус: ${err.response?.status})`);
+      const errorMsg = err.response?.data?.message || err.response?.statusText || err.message || t('category.createError');
+      alert(`${t('category.createError')}: ${errorMsg}`);
      console.error('Full error:', err);
    }
  };

  const handleDeleteCategory = async (categoryId: number) => {
    if (!familyId) return;
-    if (!confirm('Удалить категорию?')) return;
+    if (!confirm(t('category.deleteConfirm'))) return;

    try {
      await categoryApi.delete(parseInt(familyId), categoryId);
      loadCategories();
    } catch (err) {
-      alert('Ошибка удаления категории');
+      alert(t('category.deleteError'));
      console.error(err);
    }
  };

  const handleResetLimit = async (categoryId: number) => {
    if (!familyId) return;
-    if (!confirm('Удалить все траты по этой категории?')) return;
+    if (!confirm(t('category.resetConfirm'))) return;

    try {
      const expensesResponse = await expenseApi.getAllByCategory(
@@ -142,7 +144,7 @@ export default function FamilyView() {

      loadCategories();
    } catch (err) {
-      alert('Ошибка сброса трат');
+      alert(t('category.resetError'));
      console.error(err);
    }
  };
@@ -160,7 +162,7 @@ export default function FamilyView() {
      setShowAddExpense(null);
      loadCategories();
    } catch (err) {
-      alert('Ошибка добавления расхода');
+      alert(t('expense.addError'));
      console.error(err);
    }
  };
@@ -181,7 +183,7 @@ export default function FamilyView() {
      setCategoryExpenses(response.data);
      setShowHistory(categoryId);
    } catch (err) {
-      alert('Ошибка загрузки истории трат');
+      alert(t('expense.historyError'));
      console.error(err);
    }
  };
@@ -192,7 +194,7 @@ export default function FamilyView() {
      const response = await inviteLinkApi.create({ expires_in_hours: 168 });
      setInviteLink(response.data);
    } catch (err) {
-      alert('Ошибка создания ссылки-приглашения');
+      alert(t('invite.createError'));
      console.error(err);
    } finally {
      setInviteLoading(false);
@@ -221,7 +223,7 @@ export default function FamilyView() {
      <div className="min-h-screen flex items-center justify-center gradient-bg">
        <div className="flex items-center gap-3 text-white">
          <Loader2 className="w-8 h-8 animate-spin" />
-          <span className="text-xl font-medium">Загрузка...</span>
+          <span className="text-xl font-medium">{t('common.loading')}</span>
        </div>
      </div>
    );
@@ -270,25 +272,25 @@ export default function FamilyView() {
            className="inline-flex items-center gap-2 px-4 py-2 bg-white/20 hover:bg-white/30 text-white rounded-2xl backdrop-blur-md mb-6 transition-all duration-300 group"
          >
            <UserPlus className="w-5 h-5 group-hover:scale-110 transition-transform" />
-            <span className="font-medium">Пригласить участника</span>
+            <span className="font-medium">{t('family.inviteMember')}</span>
          </button>
          <div className="text-center">
            <div className="inline-flex p-4 bg-white/20 backdrop-blur-md rounded-2xl mb-4">
              <Wallet className="w-12 h-12 text-white" />
            </div>
            <h1 className="text-4xl sm:text-5xl font-bold text-white mb-6">
-              {selectedFamily?.name || 'Семья'}
+              {selectedFamily?.name || t('family.defaultName')}
            </h1>
            <div className="max-w-2xl mx-auto glass-effect rounded-2xl shadow-lg p-5">
              <div className="grid grid-cols-2 gap-4 mb-4">
                <div className="text-center">
-                  <p className="text-gray-600 font-medium text-sm mb-2">Общий лимит</p>
+                  <p className="text-gray-600 font-medium text-sm mb-2">{t('family.totalLimit')}</p>
                  <p className="text-2xl sm:text-3xl font-bold text-gray-900">
                    {getTotalLimit().toFixed(2)} ₽
                  </p>
                </div>
                <div className="text-center border-l-2 border-gray-300">
-                  <p className="text-gray-600 font-medium text-sm mb-2">Общий остаток</p>
+                  <p className="text-gray-600 font-medium text-sm mb-2">{t('family.totalRemaining')}</p>
                  <p className="text-2xl sm:text-3xl font-bold text-gray-900">
                    {getTotalRemaining().toFixed(2)} ₽
                  </p>
@@ -299,7 +301,7 @@ export default function FamilyView() {
                className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gradient-to-r from-green-500 to-emerald-600 text-white rounded-2xl hover:shadow-xl transition-all duration-300 font-semibold"
              >
                <ShoppingCart className="w-5 h-5" />
-                Список покупок
+                {t('family.shoppingList')}
              </button>
            </div>
          </div>
@@ -341,21 +343,21 @@ export default function FamilyView() {
                      className="flex items-center gap-2 px-4 py-2 bg-linear-to-r from-red-500 to-pink-500 text-white rounded-xl hover:shadow-lg transition-all duration-300 font-semibold whitespace-nowrap text-sm"
                    >
                      <TrendingDown className="w-4 h-4" />
-                      <span className="hidden sm:inline">Добавить расход</span>
-                      <span className="sm:hidden">Расход</span>
+                      <span className="hidden sm:inline">{t('category.addExpense')}</span>
+                      <span className="sm:hidden">{t('category.expense')}</span>
                    </button>
                  )}
                </div>

                <div className="space-y-3 mb-4">
                  <div className="flex justify-between items-baseline">
-                    <span className="text-gray-600 font-medium text-sm">Остаток:</span>
+                    <span className="text-gray-600 font-medium text-sm">{t('category.remaining')}</span>
                    <span className="text-2xl sm:text-3xl font-bold text-gray-900">
                      {remaining.toFixed(2)} ₽
                    </span>
                  </div>
                  <div className="flex justify-between items-baseline text-gray-500 text-sm">
-                    <span>Лимит:</span>
+                    <span>{t('category.limit')}</span>
                    <span className="text-base font-semibold">{limit.toFixed(2)} ₽</span>
                  </div>

@@ -366,7 +368,7 @@ export default function FamilyView() {
                    />
                  </div>
                  <p className="text-xs text-gray-500 text-center font-medium">
-                    {percentage.toFixed(0)}% осталось
+                    {percentage.toFixed(0)}{t('category.percentRemaining')}
                  </p>
                </div>

@@ -376,21 +378,21 @@ export default function FamilyView() {
                    className="flex-1 flex items-center justify-center gap-1.5 px-3 py-2 bg-yellow-500 hover:bg-yellow-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg text-sm"
                  >
                    <RotateCcw className="w-4 h-4" />
-                    <span>Обнулить</span>
+                    <span>{t('category.reset')}</span>
                  </button>
                  <button
                    onClick={() => handleShowHistory(category.id)}
                    className="flex-1 flex items-center justify-center gap-1.5 px-3 py-2 bg-blue-500 hover:bg-blue-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg text-sm"
                  >
                    <History className="w-4 h-4" />
-                    <span>История</span>
+                    <span>{t('category.history')}</span>
                  </button>
                  <button
                    onClick={() => handleDeleteCategory(category.id)}
                    className="flex-1 flex items-center justify-center gap-1.5 px-3 py-2 bg-red-500 hover:bg-red-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg text-sm"
                  >
                    <Trash2 className="w-4 h-4" />
-                    <span>Удалить</span>
+                    <span>{t('common.delete')}</span>
                  </button>
                </div>

@@ -399,7 +401,7 @@ export default function FamilyView() {
                    <div className="flex items-center justify-between mb-4">
                      <h3 className="font-semibold text-gray-800 text-lg flex items-center gap-2">
                        <History className="w-5 h-5" />
-                        История трат
+                        {t('expense.historyTitle')}
                      </h3>
                      <button
                        onClick={() => setShowHistory(null)}
@@ -410,7 +412,7 @@ export default function FamilyView() {
                    </div>

                    {categoryExpenses.length === 0 ? (
-                      <p className="text-center text-gray-500 py-4">Нет трат</p>
+                      <p className="text-center text-gray-500 py-4">{t('expense.noExpenses')}</p>
                    ) : (
                      <div className="space-y-2 max-h-96 overflow-y-auto">
                        {categoryExpenses.map((expense) => (
@@ -448,12 +450,12 @@ export default function FamilyView() {
                {showAddExpense === category.id && (
                  <div className="bg-linear-to-br from-purple-50 to-blue-50 p-6 rounded-2xl border-2 border-purple-200">
                    <h3 className="font-semibold text-gray-800 mb-4 text-center">
-                      Добавить расход
+                      {t('expense.addTitle')}
                    </h3>
                    <div className="space-y-4">
                      <div>
                        <label className="block text-sm font-medium text-gray-700 mb-2">
-                          Сумма (₽)
+                          {t('expense.amount')}
                        </label>
                        <input
                          type="number"
@@ -465,11 +467,11 @@ export default function FamilyView() {
                      </div>
                      <div>
                        <label className="block text-sm font-medium text-gray-700 mb-2">
-                          Описание
+                          {t('expense.description')}
                        </label>
                        <input
                          type="text"
-                          placeholder="Опционально"
+                          placeholder={t('expense.descriptionPlaceholder')}
                          value={expenseDescription}
                          onChange={(e) => setExpenseDescription(e.target.value)}
                          className="w-full px-4 py-3 border-2 border-gray-300 rounded-2xl focus:border-purple-500 focus:ring-2 focus:ring-purple-200 transition-all"
@@ -481,7 +483,7 @@ export default function FamilyView() {
                          className="flex-1 flex items-center justify-center gap-2 px-5 py-3 bg-linear-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-xl transition-all font-semibold"
                        >
                          <Plus className="w-5 h-5" />
-                          Добавить
+                          {t('common.add')}
                        </button>
                        <button
                          onClick={() => setShowAddExpense(null)}
@@ -504,26 +506,26 @@ export default function FamilyView() {
              <DollarSign className="w-8 h-8 text-white" />
            </div>
            <h2 className="text-2xl sm:text-3xl font-bold text-gray-800">
-              Управление категориями
+              {t('category.management')}
            </h2>
          </div>

          {showAddCategory ? (
            <div className="mb-8 p-6 bg-linear-to-br from-purple-50 to-blue-50 rounded-2xl border-2 border-purple-200">
              <h3 className="font-bold text-gray-800 mb-5 text-center text-lg">
-                Новая категория
+                {t('category.newCategory')}
              </h3>
              <div className="space-y-4">
                <input
                  type="text"
-                  placeholder="Название категории"
+                  placeholder={t('category.categoryName')}
                  value={newCategoryName}
                  onChange={(e) => setNewCategoryName(e.target.value)}
                  className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:border-purple-500 focus:ring-2 focus:ring-purple-200 transition-all font-medium"
                />
                <input
                  type="number"
-                  placeholder="Лимит (₽)"
+                  placeholder={t('category.categoryLimit')}
                  value={newCategoryLimit}
                  onChange={(e) => setNewCategoryLimit(e.target.value)}
                  className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:border-purple-500 focus:ring-2 focus:ring-purple-200 transition-all font-medium text-center"
@@ -534,13 +536,13 @@ export default function FamilyView() {
                    className="flex-1 flex items-center justify-center gap-2 px-6 py-4 bg-linear-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-xl transition-all font-semibold"
                  >
                    <Plus className="w-5 h-5" />
-                    Создать
+                    {t('common.create')}
                  </button>
                  <button
                    onClick={() => setShowAddCategory(false)}
                    className="px-6 py-4 bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-2xl transition-all font-medium"
                  >
-                    Отмена
+                    {t('common.cancel')}
                  </button>
                </div>
              </div>
@@ -551,7 +553,7 @@ export default function FamilyView() {
              className="w-full flex items-center justify-center gap-2 px-6 py-4 bg-linear-to-r from-purple-600 to-blue-600 text-white rounded-2xl hover:shadow-xl transition-all duration-300 font-semibold"
            >
              <Plus className="w-5 h-5" />
-              Добавить категорию
+              {t('category.addCategory')}
            </button>
          )}
        </div>
@@ -572,7 +574,7 @@ export default function FamilyView() {
                <div className="p-3 bg-gradient-to-br from-purple-500 to-blue-500 rounded-2xl">
                  <UserPlus className="w-6 h-6 text-white" />
                </div>
-                <h2 className="text-xl font-bold text-gray-800">Пригласить участника</h2>
+                <h2 className="text-xl font-bold text-gray-800">{t('invite.title')}</h2>
              </div>
              <button
                onClick={() => setShowInviteModal(false)}
@@ -585,8 +587,7 @@ export default function FamilyView() {
            {!inviteLink ? (
              <div className="text-center">
                <p className="text-gray-600 mb-6">
-                  Создайте ссылку-приглашение, чтобы добавить нового участника в семью.
-                  Ссылка будет действительна 7 дней.
+                  {t('invite.description')}
                </p>
                <button
                  onClick={handleCreateInviteLink}
@@ -596,12 +597,12 @@ export default function FamilyView() {
                  {inviteLoading ? (
                    <>
                      <Loader2 className="w-5 h-5 animate-spin" />
-                      Создание...
+                      {t('invite.creating')}
                    </>
                  ) : (
                    <>
                      <UserPlus className="w-5 h-5" />
-                      Создать ссылку
+                      {t('invite.createLink')}
                    </>
                  )}
                </button>
@@ -609,7 +610,7 @@ export default function FamilyView() {
            ) : (
              <div>
                <p className="text-gray-600 mb-4 text-center">
-                  Отправьте эту ссылку участнику, которого хотите пригласить:
+                  {t('invite.sendLink')}
                </p>
                <div className="bg-gray-100 rounded-2xl p-4 mb-4">
                  <p className="text-sm text-gray-800 break-all font-mono">
@@ -627,12 +628,12 @@ export default function FamilyView() {
                  {copied ? (
                    <>
                      <Check className="w-5 h-5" />
-                      Скопировано!
+                      {t('invite.copied')}
                    </>
                  ) : (
                    <>
                      <Copy className="w-5 h-5" />
-                      Скопировать ссылку
+                      {t('invite.copyLink')}
                    </>
                  )}
                </button>
--- a/frontend/src/pages/InvitePage.tsx
+++ b/frontend/src/pages/InvitePage.tsx
@@ -1,10 +1,12 @@
 import { useEffect, useState } from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 import { inviteLinkApi, authApi } from '../api/client';
 import { useStore } from '../store/useStore';
 import { Loader2, Users, UserPlus, AlertCircle } from 'lucide-react';

 export default function InvitePage() {
+  const { t } = useTranslation();
  const { token } = useParams<{ token: string }>();
  const navigate = useNavigate();
  const { isAuthenticated, setUser } = useStore();
@@ -37,10 +39,10 @@ export default function InvitePage() {
        setIsValid(true);
        setFamilyName(response.data.family_name);
      } else {
-        setError('Ссылка недействительна или срок её действия истёк');
+        setError(t('invite.invalid'));
      }
    } catch (err) {
-      setError('Ссылка не найдена');
+      setError(t('invite.notFound'));
    } finally {
      setLoading(false);
    }
@@ -61,9 +63,9 @@ export default function InvitePage() {
      }
    } catch (err: any) {
      if (err.response?.status === 400) {
-        setError('Вы уже состоите в семье');
+        setError(t('invite.alreadyInFamily'));
      } else {
-        setError('Ошибка при присоединении к семье');
+        setError(t('invite.joinError'));
      }
    } finally {
      setJoining(false);
@@ -78,7 +80,7 @@ export default function InvitePage() {
      const response = await authApi.getGoogleAuthUrl(window.location.href);
      window.location.href = response.data.url;
    } catch (err) {
-      setError('Ошибка при получении ссылки для авторизации');
+      setError(t('login.authError'));
    }
  };

@@ -87,7 +89,7 @@ export default function InvitePage() {
      <div className="min-h-screen flex items-center justify-center gradient-bg">
        <div className="flex items-center gap-3 text-white">
          <Loader2 className="w-8 h-8 animate-spin" />
-          <span className="text-xl font-medium">Проверка приглашения...</span>
+          <span className="text-xl font-medium">{t('invite.validating')}</span>
        </div>
      </div>
    );
@@ -98,7 +100,7 @@ export default function InvitePage() {
      <div className="min-h-screen flex items-center justify-center gradient-bg">
        <div className="flex items-center gap-3 text-white">
          <Loader2 className="w-8 h-8 animate-spin" />
-          <span className="text-xl font-medium">Присоединение к семье...</span>
+          <span className="text-xl font-medium">{t('invite.joining')}</span>
        </div>
      </div>
    );
@@ -111,13 +113,13 @@ export default function InvitePage() {
          <div className="p-4 bg-red-100 rounded-2xl inline-block mb-6">
            <AlertCircle className="w-12 h-12 text-red-500" />
          </div>
-          <h1 className="text-2xl font-bold text-gray-800 mb-4">Ошибка</h1>
+          <h1 className="text-2xl font-bold text-gray-800 mb-4">{t('common.error')}</h1>
          <p className="text-gray-600 mb-6">{error}</p>
          <button
            onClick={() => navigate('/')}
            className="px-6 py-3 bg-gradient-to-r from-purple-600 to-blue-600 text-white rounded-2xl font-semibold hover:shadow-xl transition-all"
          >
-            На главную
+            {t('common.toHome')}
          </button>
        </div>
      </div>
@@ -131,21 +133,20 @@ export default function InvitePage() {
          <Users className="w-12 h-12 text-white" />
        </div>
        <h1 className="text-2xl font-bold text-gray-800 mb-2">
-          Приглашение в семью
+          {t('invite.pageTitle')}
        </h1>
        <p className="text-3xl font-bold text-purple-600 mb-6">
          {familyName}
        </p>
        <p className="text-gray-600 mb-8">
-          Вас пригласили присоединиться к семейному бюджету.
-          Войдите через Google, чтобы принять приглашение.
+          {t('invite.pageDescription')}
        </p>
        <button
          onClick={handleGoogleLogin}
          className="w-full flex items-center justify-center gap-3 px-6 py-4 bg-gradient-to-r from-purple-600 to-blue-600 text-white rounded-2xl font-semibold hover:shadow-xl transition-all"
        >
          <UserPlus className="w-5 h-5" />
-          Войти и присоединиться
+          {t('invite.loginAndJoin')}
        </button>
      </div>
    </div>
--- a/frontend/src/pages/Login.tsx
+++ b/frontend/src/pages/Login.tsx
@@ -1,8 +1,10 @@
 import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { authApi } from '../api/client';
 import { Loader2, Wallet } from 'lucide-react';

 export default function Login() {
+  const { t } = useTranslation();
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState('');

@@ -14,7 +16,7 @@ export default function Login() {
      const response = await authApi.getGoogleAuthUrl(currentUrl);
      window.location.href = response.data.url;
    } catch (err) {
-      setError('Ошибка при получении ссылки для авторизации');
+      setError(t('login.authError'));
      console.error(err);
      setLoading(false);
    }
@@ -29,10 +31,10 @@ export default function Login() {
              <Wallet className="w-12 h-12" />
            </div>
            <h1 className="text-3xl sm:text-4xl font-bold text-gray-900 mb-2">
-              Семейный бюджет
+              {t('login.title')}
            </h1>
            <p className="text-gray-600">
-              Войдите, чтобы продолжить
+              {t('login.subtitle')}
            </p>
          </div>

@@ -69,7 +71,7 @@ export default function Login() {
                    d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
                  />
                </svg>
-                Войти через Google
+                {t('login.googleButton')}
              </>
            )}
          </button>
--- a/frontend/src/pages/NoFamily.tsx
+++ b/frontend/src/pages/NoFamily.tsx
@@ -1,10 +1,12 @@
 import { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 import { useStore } from '../store/useStore';
 import { authApi, familyApi, inviteLinkApi } from '../api/client';
 import { Users, LogOut, Settings, Plus, Loader2, Eye, EyeOff } from 'lucide-react';

 export default function NoFamily() {
+  const { t } = useTranslation();
  const navigate = useNavigate();
  const { user, logout, setUser } = useStore();

@@ -37,9 +39,9 @@ export default function NoFamily() {
      }
    } catch (err: any) {
      if (err.response?.status === 400) {
-        setError('Ссылка-приглашение недействительна или истекла');
+        setError(t('noFamily.invalidInvite'));
      } else {
-        setError('Ошибка при присоединении к семье');
+        setError(t('noFamily.joinError'));
      }
    } finally {
      setJoiningFamily(false);
@@ -64,7 +66,7 @@ export default function NoFamily() {
    e.preventDefault();

    if (!familyName.trim()) {
-      setError('Введите название семьи');
+      setError(t('noFamily.enterFamilyName'));
      return;
    }

@@ -87,12 +89,12 @@ export default function NoFamily() {
      if (err && typeof err === 'object' && 'response' in err) {
        const axiosError = err as { response?: { status?: number } };
        if (axiosError.response?.status === 409) {
-          setError('Вы уже состоите в семье');
+          setError(t('noFamily.alreadyInFamily'));
        } else {
-          setError('Ошибка при создании семьи');
+          setError(t('noFamily.createError'));
        }
      } else {
-        setError('Ошибка при создании семьи');
+        setError(t('noFamily.createError'));
      }
      console.error(err);
    } finally {
@@ -105,7 +107,7 @@ export default function NoFamily() {
      <div className="min-h-screen flex items-center justify-center gradient-bg">
        <div className="flex items-center gap-3 text-white">
          <Loader2 className="w-8 h-8 animate-spin" />
-          <span className="text-xl font-medium">Присоединение к семье...</span>
+          <span className="text-xl font-medium">{t('noFamily.joiningFamily')}</span>
        </div>
      </div>
    );
@@ -120,7 +122,7 @@ export default function NoFamily() {
              <Users className="w-12 h-12" />
            </div>
            <h1 className="text-2xl sm:text-3xl font-bold text-gray-900 mb-2">
-              Добро пожаловать!
+              {t('noFamily.welcome')}
            </h1>
            <p className="text-gray-600">
              <span className="font-semibold text-purple-600">{user?.email || user?.username}</span>
@@ -129,7 +131,7 @@ export default function NoFamily() {

          <form onSubmit={handleCreateFamily} className="mb-6">
            <h2 className="text-lg font-semibold text-gray-800 mb-4 text-center">
-              Создайте свою семью
+              {t('noFamily.createFamily')}
            </h2>

            {error && (
@@ -141,14 +143,14 @@ export default function NoFamily() {
            <div className="space-y-4">
              <div>
                <label htmlFor="familyName" className="block text-sm font-medium text-gray-700 mb-1">
-                  Название семьи *
+                  {t('noFamily.familyNameRequired')}
                </label>
                <input
                  type="text"
                  id="familyName"
                  value={familyName}
                  onChange={(e) => setFamilyName(e.target.value)}
-                  placeholder="Например: Семья Ивановых"
+                  placeholder={t('noFamily.familyNamePlaceholder')}
                  className="w-full px-4 py-3 border-2 border-gray-300 rounded-xl focus:border-purple-500 focus:outline-none transition-colors"
                  disabled={loading}
                />
@@ -156,7 +158,7 @@ export default function NoFamily() {

              <div>
                <label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1">
-                  Пароль <span className="text-gray-400">(необязательно)</span>
+                  {t('noFamily.password')} <span className="text-gray-400">{t('noFamily.passwordOptional')}</span>
                </label>
                <div className="relative">
                  <input
@@ -164,7 +166,7 @@ export default function NoFamily() {
                    id="password"
                    value={password}
                    onChange={(e) => setPassword(e.target.value)}
-                    placeholder="Для защиты доступа"
+                    placeholder={t('noFamily.passwordPlaceholder')}
                    className="w-full px-4 py-3 pr-12 border-2 border-gray-300 rounded-xl focus:border-purple-500 focus:outline-none transition-colors"
                    disabled={loading}
                  />
@@ -177,7 +179,7 @@ export default function NoFamily() {
                  </button>
                </div>
                <p className="mt-1 text-xs text-gray-500">
-                  Пароль понадобится для доступа к бюджету семьи
+                  {t('noFamily.passwordHint')}
                </p>
              </div>

@@ -191,7 +193,7 @@ export default function NoFamily() {
                ) : (
                  <>
                    <Plus className="w-5 h-5" />
-                    Создать семью
+                    {t('noFamily.createButton')}
                  </>
                )}
              </button>
@@ -206,7 +208,7 @@ export default function NoFamily() {
                  className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-2xl transition-all duration-300 font-medium"
                >
                  <Settings className="w-5 h-5" />
-                  Админ панель
+                  {t('noFamily.adminPanel')}
                </button>
              )}
              <button
@@ -214,7 +216,7 @@ export default function NoFamily() {
                className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-2xl transition-all duration-300 font-medium"
              >
                <LogOut className="w-5 h-5" />
-                Выйти
+                {t('common.logout')}
              </button>
            </div>
          </div>