diff --git a/frontend/eslint.config.mjs b/frontend/eslint.config.mjs
index ac5942f58..ae0a9b481 100644
--- a/frontend/eslint.config.mjs
+++ b/frontend/eslint.config.mjs
@@ -1,14 +1,54 @@
-import globals from "globals";
-import pluginJs from "@eslint/js";
-import tseslint from "typescript-eslint";
-import pluginReact from "eslint-plugin-react";
+import typescript from '@typescript-eslint/eslint-plugin';
+import parser from '@typescript-eslint/parser';
+import react from 'eslint-plugin-react';
+import storybook from 'eslint-plugin-storybook';
+import configPrettier from 'eslint-config-prettier';
 
+const config = [
+  {
+    files: ['src/**/*.{js,ts,jsx,tsx}'],
+    ignores: [
+      'dist/**',
+      'node_modules/**',
+      'coverage/**',
+      'public/**',
+      'jest.config.js',
+      'jest.setup.ts',
+      'netlify.toml',
+    ],
+    languageOptions: {
+      parser,
+      parserOptions: {
+        ecmaVersion: 'latest',
+        sourceType: 'module',
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+    },
+    plugins: {
+      '@typescript-eslint': typescript,
+      react,
+      storybook,
+    },
+    rules: {
+      semi: ['error', 'always'],
+      quotes: ['error', 'single'],
+      'no-console': 'warn',
+      'react/react-in-jsx-scope': 'off',
+      '@typescript-eslint/no-unused-vars': [
+        'warn',
+        { argsIgnorePattern: '^_' },
+      ],
+      '@typescript-eslint/explicit-function-return-type': 'off',
+    },
+    settings: {
+      react: {
+        version: 'detect',
+      },
+    },
+  },
+  configPrettier,
+];
 
-/** @type {import('eslint').Linter.Config[]} */
-export default [
-  {files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"]},
-  {languageOptions: { globals: globals.browser }},
-  pluginJs.configs.recommended,
-  ...tseslint.configs.recommended,
-  pluginReact.configs.flat.recommended,
-];
\ No newline at end of file
+export default config;
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 82a04cca6..c704c8094 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -50,6 +50,8 @@
         "@types/react-refresh": "^0.14.6",
         "@types/webpack": "^5.28.5",
         "@types/webpack-dev-server": "^4.7.1",
+        "@typescript-eslint/eslint-plugin": "^8.32.1",
+        "@typescript-eslint/parser": "^8.32.1",
         "chromatic": "^11.25.0",
         "copy-webpack-plugin": "^13.0.0",
         "css-loader": "^7.1.2",
@@ -57,6 +59,7 @@
         "detect-port": "^2.1.0",
         "esbuild-loader": "^4.3.0",
         "eslint": "^9.17.0",
+        "eslint-config-prettier": "^10.1.5",
         "eslint-plugin-react": "^7.37.3",
         "eslint-plugin-storybook": "^0.11.2",
         "fork-ts-checker-webpack-plugin": "^9.0.2",
@@ -74,7 +77,6 @@
         "ts-jest": "^29.3.0",
         "tsx": "^4.19.2",
         "typescript": "^5.7.2",
-        "typescript-eslint": "^8.19.0",
         "webpack": "^5.97.1",
         "webpack-cli": "^6.0.1",
         "webpack-dev-server": "^5.2.0",
@@ -1107,9 +1109,9 @@
       }
     },
     "node_modules/@eslint-community/eslint-utils": {
-      "version": "4.4.1",
-      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz",
-      "integrity": "sha512-s3O3waFUrMV8P/XaF/+ZTp1X9XBZW1a4B97ZnjQF2KYWaFD2A8KyFBsrsfSjEmjn3RGWAIuvlneuZm3CUK3jbA==",
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.7.0.tgz",
+      "integrity": "sha512-dyybb3AcajC7uha6CvhdVRJqaKyn7w2YKqKyAN37NKYgZT36w+iRb0Dymmc5qEJ549c/S31cMMSFd75bteCpCw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4750,21 +4752,21 @@
       "license": "MIT"
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.19.0.tgz",
-      "integrity": "sha512-NggSaEZCdSrFddbctrVjkVZvFC6KGfKfNK0CU7mNK/iKHGKbzT4Wmgm08dKpcZECBu9f5FypndoMyRHkdqfT1Q==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.32.1.tgz",
+      "integrity": "sha512-6u6Plg9nP/J1GRpe/vcjjabo6Uc5YQPAMxsgQyGC/I0RuukiG1wIe3+Vtg3IrSCVJDmqK3j8adrtzXSENRtFgg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/regexpp": "^4.10.0",
-        "@typescript-eslint/scope-manager": "8.19.0",
-        "@typescript-eslint/type-utils": "8.19.0",
-        "@typescript-eslint/utils": "8.19.0",
-        "@typescript-eslint/visitor-keys": "8.19.0",
+        "@typescript-eslint/scope-manager": "8.32.1",
+        "@typescript-eslint/type-utils": "8.32.1",
+        "@typescript-eslint/utils": "8.32.1",
+        "@typescript-eslint/visitor-keys": "8.32.1",
         "graphemer": "^1.4.0",
-        "ignore": "^5.3.1",
+        "ignore": "^7.0.0",
         "natural-compare": "^1.4.0",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -4776,20 +4778,30 @@
       "peerDependencies": {
         "@typescript-eslint/parser": "^8.0.0 || ^8.0.0-alpha.0",
         "eslint": "^8.57.0 || ^9.0.0",
-        "typescript": ">=4.8.4 <5.8.0"
+        "typescript": ">=4.8.4 <5.9.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/ignore": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.4.tgz",
+      "integrity": "sha512-gJzzk+PQNznz8ysRrC0aOkBNVRBDtE1n53IqyqEf3PXrYwomFs5q4pGMizBMJF+ykh03insJ27hB8gSrD2Hn8A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
       }
     },
     "node_modules/@typescript-eslint/parser": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.19.0.tgz",
-      "integrity": "sha512-6M8taKyOETY1TKHp0x8ndycipTVgmp4xtg5QpEZzXxDhNvvHOJi5rLRkLr8SK3jTgD5l4fTlvBiRdfsuWydxBw==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.32.1.tgz",
+      "integrity": "sha512-LKMrmwCPoLhM45Z00O1ulb6jwyVr2kr3XJp+G+tSEZcbauNnScewcQwtJqXDhXeYPDEjZ8C1SjXm015CirEmGg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/scope-manager": "8.19.0",
-        "@typescript-eslint/types": "8.19.0",
-        "@typescript-eslint/typescript-estree": "8.19.0",
-        "@typescript-eslint/visitor-keys": "8.19.0",
+        "@typescript-eslint/scope-manager": "8.32.1",
+        "@typescript-eslint/types": "8.32.1",
+        "@typescript-eslint/typescript-estree": "8.32.1",
+        "@typescript-eslint/visitor-keys": "8.32.1",
         "debug": "^4.3.4"
       },
       "engines": {
@@ -4801,18 +4813,18 @@
       },
       "peerDependencies": {
         "eslint": "^8.57.0 || ^9.0.0",
-        "typescript": ">=4.8.4 <5.8.0"
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.19.0.tgz",
-      "integrity": "sha512-hkoJiKQS3GQ13TSMEiuNmSCvhz7ujyqD1x3ShbaETATHrck+9RaDdUbt+osXaUuns9OFwrDTTrjtwsU8gJyyRA==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.32.1.tgz",
+      "integrity": "sha512-7IsIaIDeZn7kffk7qXC3o6Z4UblZJKV3UBpkvRNpr5NSyLji7tvTcvmnMNYuYLyh26mN8W723xpo3i4MlD33vA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.19.0",
-        "@typescript-eslint/visitor-keys": "8.19.0"
+        "@typescript-eslint/types": "8.32.1",
+        "@typescript-eslint/visitor-keys": "8.32.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -4823,16 +4835,16 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.19.0.tgz",
-      "integrity": "sha512-TZs0I0OSbd5Aza4qAMpp1cdCYVnER94IziudE3JU328YUHgWu9gwiwhag+fuLeJ2LkWLXI+F/182TbG+JaBdTg==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.32.1.tgz",
+      "integrity": "sha512-mv9YpQGA8iIsl5KyUPi+FGLm7+bA4fgXaeRcFKRDRwDMu4iwrSHeDPipwueNXhdIIZltwCJv+NkxftECbIZWfA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/typescript-estree": "8.19.0",
-        "@typescript-eslint/utils": "8.19.0",
+        "@typescript-eslint/typescript-estree": "8.32.1",
+        "@typescript-eslint/utils": "8.32.1",
         "debug": "^4.3.4",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -4843,13 +4855,13 @@
       },
       "peerDependencies": {
         "eslint": "^8.57.0 || ^9.0.0",
-        "typescript": ">=4.8.4 <5.8.0"
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/types": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.19.0.tgz",
-      "integrity": "sha512-8XQ4Ss7G9WX8oaYvD4OOLCjIQYgRQxO+qCiR2V2s2GxI9AUpo7riNwo6jDhKtTcaJjT8PY54j2Yb33kWtSJsmA==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.32.1.tgz",
+      "integrity": "sha512-YmybwXUJcgGqgAp6bEsgpPXEg6dcCyPyCSr0CAAueacR/CCBi25G3V8gGQ2kRzQRBNol7VQknxMs9HvVa9Rvfg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -4861,20 +4873,20 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.19.0.tgz",
-      "integrity": "sha512-WW9PpDaLIFW9LCbucMSdYUuGeFUz1OkWYS/5fwZwTA+l2RwlWFdJvReQqMUMBw4yJWJOfqd7An9uwut2Oj8sLw==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.32.1.tgz",
+      "integrity": "sha512-Y3AP9EIfYwBb4kWGb+simvPaqQoT5oJuzzj9m0i6FCY6SPvlomY2Ei4UEMm7+FXtlNJbor80ximyslzaQF6xhg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.19.0",
-        "@typescript-eslint/visitor-keys": "8.19.0",
+        "@typescript-eslint/types": "8.32.1",
+        "@typescript-eslint/visitor-keys": "8.32.1",
         "debug": "^4.3.4",
         "fast-glob": "^3.3.2",
         "is-glob": "^4.0.3",
         "minimatch": "^9.0.4",
         "semver": "^7.6.0",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -4884,7 +4896,7 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "typescript": ">=4.8.4 <5.8.0"
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": {
@@ -4914,9 +4926,9 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -4927,16 +4939,16 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.19.0.tgz",
-      "integrity": "sha512-PTBG+0oEMPH9jCZlfg07LCB2nYI0I317yyvXGfxnvGvw4SHIOuRnQ3kadyyXY6tGdChusIHIbM5zfIbp4M6tCg==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.32.1.tgz",
+      "integrity": "sha512-DsSFNIgLSrc89gpq1LJB7Hm1YpuhK086DRDJSNrewcGvYloWW1vZLHBTIvarKZDcAORIy/uWNx8Gad+4oMpkSA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@eslint-community/eslint-utils": "^4.4.0",
-        "@typescript-eslint/scope-manager": "8.19.0",
-        "@typescript-eslint/types": "8.19.0",
-        "@typescript-eslint/typescript-estree": "8.19.0"
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.32.1",
+        "@typescript-eslint/types": "8.32.1",
+        "@typescript-eslint/typescript-estree": "8.32.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -4947,17 +4959,17 @@
       },
       "peerDependencies": {
         "eslint": "^8.57.0 || ^9.0.0",
-        "typescript": ">=4.8.4 <5.8.0"
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.19.0.tgz",
-      "integrity": "sha512-mCFtBbFBJDCNCWUl5y6sZSCHXw1DEFEk3c/M3nRK2a4XUB8StGFtmcEMizdjKuBzB6e/smJAAWYug3VrdLMr1w==",
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.32.1.tgz",
+      "integrity": "sha512-ar0tjQfObzhSaW3C3QNmTc5ofj0hDoNQ5XWrCy6zDyabdr0TWhCkClp+rywGNj/odAFBVzzJrK4tEq5M4Hmu4w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.19.0",
+        "@typescript-eslint/types": "8.32.1",
         "eslint-visitor-keys": "^4.2.0"
       },
       "engines": {
@@ -8872,6 +8884,22 @@
         }
       }
     },
+    "node_modules/eslint-config-prettier": {
+      "version": "10.1.5",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-10.1.5.tgz",
+      "integrity": "sha512-zc1UmCpNltmVY34vuLRV61r1K27sWuX39E+uyUnY8xS2Bex88VV9cugG+UZbRSRGtGyFboj+D8JODyme1plMpw==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "eslint-config-prettier": "bin/cli.js"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint-config-prettier"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.0.0"
+      }
+    },
     "node_modules/eslint-plugin-react": {
       "version": "7.37.3",
       "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.37.3.tgz",
@@ -9360,9 +9388,9 @@
       "license": "MIT"
     },
     "node_modules/fast-glob": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
-      "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz",
+      "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9370,7 +9398,7 @@
         "@nodelib/fs.walk": "^1.2.3",
         "glob-parent": "^5.1.2",
         "merge2": "^1.3.0",
-        "micromatch": "^4.0.4"
+        "micromatch": "^4.0.8"
       },
       "engines": {
         "node": ">=8.6.0"
@@ -9413,9 +9441,9 @@
       }
     },
     "node_modules/fastq": {
-      "version": "1.18.0",
-      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.18.0.tgz",
-      "integrity": "sha512-QKHXPW0hD8g4UET03SdOdunzSouc9N4AuHdsX8XNcTsuz+yYFILVNIX4l9yHABMhiEI9Db0JTTIpu0wB+Y1QQw==",
+      "version": "1.19.1",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.19.1.tgz",
+      "integrity": "sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -16406,9 +16434,9 @@
       }
     },
     "node_modules/reusify": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
-      "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz",
+      "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -18035,16 +18063,16 @@
       }
     },
     "node_modules/ts-api-utils": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-1.4.3.tgz",
-      "integrity": "sha512-i3eMG77UTMD0hZhgRS562pv83RC6ukSAC2GMNWc+9dieh/+jDM5u5YG+NHX6VNDRHQcHwmsTHctP9LhbC3WxVw==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=16"
+        "node": ">=18.12"
       },
       "peerDependencies": {
-        "typescript": ">=4.2.0"
+        "typescript": ">=4.8.4"
       }
     },
     "node_modules/ts-dedent": {
@@ -18330,29 +18358,6 @@
         "node": ">=14.17"
       }
     },
-    "node_modules/typescript-eslint": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.19.0.tgz",
-      "integrity": "sha512-Ni8sUkVWYK4KAcTtPjQ/UTiRk6jcsuDhPpxULapUDi8A/l8TSBk+t1GtJA1RsCzIJg0q6+J7bf35AwQigENWRQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@typescript-eslint/eslint-plugin": "8.19.0",
-        "@typescript-eslint/parser": "8.19.0",
-        "@typescript-eslint/utils": "8.19.0"
-      },
-      "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "eslint": "^8.57.0 || ^9.0.0",
-        "typescript": ">=4.8.4 <5.8.0"
-      }
-    },
     "node_modules/unbox-primitive": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.1.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 88dc2379e..fc432eebf 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -61,6 +61,8 @@
     "@types/react-refresh": "^0.14.6",
     "@types/webpack": "^5.28.5",
     "@types/webpack-dev-server": "^4.7.1",
+    "@typescript-eslint/eslint-plugin": "^8.32.1",
+    "@typescript-eslint/parser": "^8.32.1",
     "chromatic": "^11.25.0",
     "copy-webpack-plugin": "^13.0.0",
     "css-loader": "^7.1.2",
@@ -68,6 +70,7 @@
     "detect-port": "^2.1.0",
     "esbuild-loader": "^4.3.0",
     "eslint": "^9.17.0",
+    "eslint-config-prettier": "^10.1.5",
     "eslint-plugin-react": "^7.37.3",
     "eslint-plugin-storybook": "^0.11.2",
     "fork-ts-checker-webpack-plugin": "^9.0.2",
@@ -85,7 +88,6 @@
     "ts-jest": "^29.3.0",
     "tsx": "^4.19.2",
     "typescript": "^5.7.2",
-    "typescript-eslint": "^8.19.0",
     "webpack": "^5.97.1",
     "webpack-cli": "^6.0.1",
     "webpack-dev-server": "^5.2.0",
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index a08a8841e..eabf3b0aa 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,4 +1,4 @@
-import React, { Suspense } from 'react';
+import { Suspense } from 'react';
 import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { SearchProvider } from '@/context/SearchContext';
diff --git a/frontend/src/components/ClubLogo/ClubLogo.tsx b/frontend/src/components/ClubLogo/ClubLogo.tsx
index a0d812eb3..f34da1c7b 100644
--- a/frontend/src/components/ClubLogo/ClubLogo.tsx
+++ b/frontend/src/components/ClubLogo/ClubLogo.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import styled, { css } from 'styled-components';
 
 type LogoVariant = 'main' | 'detail';
diff --git a/frontend/src/components/ClubStateBox/ClubStateBox.tsx b/frontend/src/components/ClubStateBox/ClubStateBox.tsx
index 8f5e4fa45..792f81007 100644
--- a/frontend/src/components/ClubStateBox/ClubStateBox.tsx
+++ b/frontend/src/components/ClubStateBox/ClubStateBox.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import styled from 'styled-components';
 
 const stateStyles: Record<
diff --git a/frontend/src/components/ClubTag/ClubTag.tsx b/frontend/src/components/ClubTag/ClubTag.tsx
index b0ebe4c34..4711a5a54 100644
--- a/frontend/src/components/ClubTag/ClubTag.tsx
+++ b/frontend/src/components/ClubTag/ClubTag.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import styled from 'styled-components';
 
 const TagColors: Record<string, string> = {
diff --git a/frontend/src/components/common/Button/Button.tsx b/frontend/src/components/common/Button/Button.tsx
index e1e4c3d8c..cecfaaa74 100644
--- a/frontend/src/components/common/Button/Button.tsx
+++ b/frontend/src/components/common/Button/Button.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import styled, { keyframes, css } from 'styled-components';
 
 export interface ButtonProps {
diff --git a/frontend/src/components/common/Footer/Footer.tsx b/frontend/src/components/common/Footer/Footer.tsx
index b7a70475d..ee3da62de 100644
--- a/frontend/src/components/common/Footer/Footer.tsx
+++ b/frontend/src/components/common/Footer/Footer.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import * as Styled from './Footer.styles';
 
 const Footer = () => {
diff --git a/frontend/src/components/common/Header/Header.tsx b/frontend/src/components/common/Header/Header.tsx
index 428c6a918..ef23c91ee 100644
--- a/frontend/src/components/common/Header/Header.tsx
+++ b/frontend/src/components/common/Header/Header.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import { useLocation } from 'react-router-dom';
 import * as Styled from './Header.styles';
 import SearchBox from '@/components/common/SearchBox/SearchBox';
diff --git a/frontend/src/components/common/InputField/InputField.tsx b/frontend/src/components/common/InputField/InputField.tsx
index 16e507cde..40122364c 100644
--- a/frontend/src/components/common/InputField/InputField.tsx
+++ b/frontend/src/components/common/InputField/InputField.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import * as Styled from './InputField.styles';
 import clearIcon from '@/assets/images/icons/delete_button_icon.svg';
 
diff --git a/frontend/src/components/common/LazyImage/LazyImage.test.tsx b/frontend/src/components/common/LazyImage/LazyImage.test.tsx
index dc2d3c0b6..259faffde 100644
--- a/frontend/src/components/common/LazyImage/LazyImage.test.tsx
+++ b/frontend/src/components/common/LazyImage/LazyImage.test.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import { render, screen, act, waitFor } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import LazyImage from './LazyImage';
diff --git a/frontend/src/components/common/LazyImage/LazyImage.tsx b/frontend/src/components/common/LazyImage/LazyImage.tsx
index 37071ce10..21290be0a 100644
--- a/frontend/src/components/common/LazyImage/LazyImage.tsx
+++ b/frontend/src/components/common/LazyImage/LazyImage.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 
 interface LazyImageProps {
   src: string;
diff --git a/frontend/src/components/common/SearchBox/SearchBox.tsx b/frontend/src/components/common/SearchBox/SearchBox.tsx
index e7f8bf5cb..5d98a9091 100644
--- a/frontend/src/components/common/SearchBox/SearchBox.tsx
+++ b/frontend/src/components/common/SearchBox/SearchBox.tsx
@@ -1,4 +1,4 @@
-import React, { useRef, useState } from 'react';
+import { useRef, useState } from 'react';
 import { useSearch } from '@/context/SearchContext';
 import useMixpanelTrack from '@/hooks/useMixpanelTrack';
 import * as Styled from './SearchBox.styles';
diff --git a/frontend/src/context/AdminClubContext.tsx b/frontend/src/context/AdminClubContext.tsx
index ccbff4da3..23c526eb6 100644
--- a/frontend/src/context/AdminClubContext.tsx
+++ b/frontend/src/context/AdminClubContext.tsx
@@ -1,4 +1,4 @@
-import React, { createContext, useContext, useState } from 'react';
+import { createContext, useContext, useState } from 'react';
 
 interface AdminClubContextType {
   clubId: string | null;
diff --git a/frontend/src/context/SearchContext.tsx b/frontend/src/context/SearchContext.tsx
index e8431a2f9..d20af1f39 100644
--- a/frontend/src/context/SearchContext.tsx
+++ b/frontend/src/context/SearchContext.tsx
@@ -1,4 +1,4 @@
-import React, { createContext, useState, useContext, ReactNode } from 'react';
+import { createContext, useState, useContext, ReactNode } from 'react';
 
 interface SearchContextType {
   keyword: string;
diff --git a/frontend/src/hooks/queries/club/useGetCardList.ts b/frontend/src/hooks/queries/club/useGetCardList.ts
index 007403984..fc243fa03 100644
--- a/frontend/src/hooks/queries/club/useGetCardList.ts
+++ b/frontend/src/hooks/queries/club/useGetCardList.ts
@@ -1,5 +1,7 @@
 import { useQuery, keepPreviousData } from '@tanstack/react-query';
 import { getClubList } from '@/apis/getClubList';
+import { Club } from '@/types/club';
+import convertToDriveUrl from '@/utils/convertGoogleDriveUrl';
 
 export const useGetCardList = (
   keyword: string,
@@ -7,9 +9,14 @@ export const useGetCardList = (
   category: string,
   division: string,
 ) => {
-  return useQuery({
+  return useQuery<Club[], unknown, Club[]>({
     queryKey: ['clubs', keyword, recruitmentStatus, division, category],
     queryFn: () => getClubList(keyword, recruitmentStatus, division, category),
     placeholderData: keepPreviousData,
+    select: (data) =>
+      data.map((club) => ({
+        ...club,
+        logo: convertToDriveUrl(club.logo),
+      })),
   });
 };
diff --git a/frontend/src/hooks/queries/club/useGetClubDetail.ts b/frontend/src/hooks/queries/club/useGetClubDetail.ts
index 9749cca58..4719cbb74 100644
--- a/frontend/src/hooks/queries/club/useGetClubDetail.ts
+++ b/frontend/src/hooks/queries/club/useGetClubDetail.ts
@@ -1,11 +1,20 @@
 import { getClubDetail } from '@/apis/getClubDetail';
 import { useQuery } from '@tanstack/react-query';
 import { ClubDetail } from '@/types/club';
+import convertGoogleDriveUrl from '@/utils/convertGoogleDriveUrl';
 
 export const useGetClubDetail = (clubId: string) => {
   return useQuery<ClubDetail>({
     queryKey: ['clubDetail', clubId],
     queryFn: () => getClubDetail(clubId as string),
     enabled: !!clubId,
+    select: (data) =>
+      ({
+        ...data,
+        logo: data.logo ? convertGoogleDriveUrl(data.logo) : undefined,
+        feeds: Array.isArray(data.feeds)
+          ? data.feeds.map(convertGoogleDriveUrl)
+          : [],
+      }) as ClubDetail,
   });
 };
diff --git a/frontend/src/pages/AdminPage/AdminPage.tsx b/frontend/src/pages/AdminPage/AdminPage.tsx
index a1a081ac9..d504d8825 100644
--- a/frontend/src/pages/AdminPage/AdminPage.tsx
+++ b/frontend/src/pages/AdminPage/AdminPage.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import Header from '@/components/common/Header/Header';
 import { PageContainer } from '@/styles/PageContainer.styles';
 import SideBar from '@/pages/AdminPage/components/SideBar/SideBar';
diff --git a/frontend/src/pages/AdminPage/auth/LoginTab/LoginTab.tsx b/frontend/src/pages/AdminPage/auth/LoginTab/LoginTab.tsx
index bfb31901a..c760f9725 100644
--- a/frontend/src/pages/AdminPage/auth/LoginTab/LoginTab.tsx
+++ b/frontend/src/pages/AdminPage/auth/LoginTab/LoginTab.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 import * as Styled from './LoginTab.styles';
 import InputField from '@/components/common/InputField/InputField';
diff --git a/frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx b/frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx
index 84938ef74..fb0878ef7 100644
--- a/frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx
+++ b/frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import { useParams } from 'react-router-dom';
 import * as Styled from '@/styles/PageContainer.styles';
 import Header from '@/components/common/Header/Header';
diff --git a/frontend/src/pages/ClubDetailPage/components/BackNavigationBar/BackNavigationBar.tsx b/frontend/src/pages/ClubDetailPage/components/BackNavigationBar/BackNavigationBar.tsx
index bd7fee058..ed1e5a5bf 100644
--- a/frontend/src/pages/ClubDetailPage/components/BackNavigationBar/BackNavigationBar.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/BackNavigationBar/BackNavigationBar.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import useMixpanelTrack from '@/hooks/useMixpanelTrack';
 import { useNavigate } from 'react-router-dom';
 import * as Styled from './BackNavigationBar.styles';
diff --git a/frontend/src/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton.tsx b/frontend/src/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton.tsx
index a65dbbb03..78652f82a 100644
--- a/frontend/src/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import useMixpanelTrack from '@/hooks/useMixpanelTrack';
 import styled from 'styled-components';
 
diff --git a/frontend/src/pages/ClubDetailPage/components/ClubDetailFooter/ClubDetailFooter.tsx b/frontend/src/pages/ClubDetailPage/components/ClubDetailFooter/ClubDetailFooter.tsx
index 085108547..3aca35fae 100644
--- a/frontend/src/pages/ClubDetailPage/components/ClubDetailFooter/ClubDetailFooter.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/ClubDetailFooter/ClubDetailFooter.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import * as Styled from './ClubDetailFooter.styles';
 import DeadlineBadge from '@/pages/ClubDetailPage/components/DeadlineBadge/DeadlineBadge';
 import ClubApplyButton from '@/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton';
diff --git a/frontend/src/pages/ClubDetailPage/components/ClubDetailHeader/ClubDetailHeader.tsx b/frontend/src/pages/ClubDetailPage/components/ClubDetailHeader/ClubDetailHeader.tsx
index ba1ecb7da..028c5744f 100644
--- a/frontend/src/pages/ClubDetailPage/components/ClubDetailHeader/ClubDetailHeader.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/ClubDetailHeader/ClubDetailHeader.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import * as Styled from './ClubDetailHeader.styles';
 import ClubProfile from '@/pages/ClubDetailPage/components/ClubProfile/ClubProfile';
 import ClubApplyButton from '@/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton';
diff --git a/frontend/src/pages/ClubDetailPage/components/ClubProfile/ClubProfile.tsx b/frontend/src/pages/ClubDetailPage/components/ClubProfile/ClubProfile.tsx
index 1608a26bf..9c9c7a0a2 100644
--- a/frontend/src/pages/ClubDetailPage/components/ClubProfile/ClubProfile.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/ClubProfile/ClubProfile.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import ClubLogo from '@/components/ClubLogo/ClubLogo';
 import ClubTag from '@/components/ClubTag/ClubTag';
 import * as Styled from './ClubProfile.styles';
diff --git a/frontend/src/pages/ClubDetailPage/components/DeadlineBadge/DeadlineBadge.tsx b/frontend/src/pages/ClubDetailPage/components/DeadlineBadge/DeadlineBadge.tsx
index 4a8bd9fff..5dd55f90c 100644
--- a/frontend/src/pages/ClubDetailPage/components/DeadlineBadge/DeadlineBadge.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/DeadlineBadge/DeadlineBadge.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import * as Styled from './DeadlineBadge.styles';
 
 interface DeadlineBadgeProps {
diff --git a/frontend/src/pages/ClubDetailPage/components/InfoBox/InfoBox.tsx b/frontend/src/pages/ClubDetailPage/components/InfoBox/InfoBox.tsx
index b5defaae2..eb080704d 100644
--- a/frontend/src/pages/ClubDetailPage/components/InfoBox/InfoBox.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/InfoBox/InfoBox.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import * as Styled from './InfoBox.styles';
 import { ClubDetail } from '@/types/club';
 import { INFOTABS_SCROLL_INDEX } from '@/constants/scrollSections';
diff --git a/frontend/src/pages/ClubDetailPage/components/InfoTabs/InfoTabs.tsx b/frontend/src/pages/ClubDetailPage/components/InfoTabs/InfoTabs.tsx
index 4ce41b2cf..2446bd1f8 100644
--- a/frontend/src/pages/ClubDetailPage/components/InfoTabs/InfoTabs.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/InfoTabs/InfoTabs.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import * as Styled from './InfoTabs.styles';
 import useMixpanelTrack from '@/hooks/useMixpanelTrack';
 
diff --git a/frontend/src/pages/ClubDetailPage/components/IntroduceBox/IntroduceBox.tsx b/frontend/src/pages/ClubDetailPage/components/IntroduceBox/IntroduceBox.tsx
index 87bb5df5e..e23da0501 100644
--- a/frontend/src/pages/ClubDetailPage/components/IntroduceBox/IntroduceBox.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/IntroduceBox/IntroduceBox.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import * as Styled from './IntroduceBox.styles';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm'; // 링크 및 마크다운 확장 지원
diff --git a/frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.tsx b/frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.tsx
index 90d96b193..eba73888b 100644
--- a/frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.tsx
+++ b/frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useRef, useMemo, useCallback } from 'react';
+import { useState, useRef, useMemo, useCallback } from 'react';
 import * as Styled from './PhotoList.styles';
 import convertGoogleDriveUrl from '@/utils/convertGoogleDriveUrl';
 import { usePhotoNavigation } from '@/hooks/PhotoList/usePhotoNavigation';
diff --git a/frontend/src/pages/MainPage/MainPage.tsx b/frontend/src/pages/MainPage/MainPage.tsx
index df1f0ebfb..4c65e2c47 100644
--- a/frontend/src/pages/MainPage/MainPage.tsx
+++ b/frontend/src/pages/MainPage/MainPage.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useMemo } from 'react';
+import { useState, useMemo } from 'react';
 import { useSearch } from '@/context/SearchContext';
 import useTrackPageView from '@/hooks/useTrackPageView';
 import { useGetCardList } from '@/hooks/queries/club/useGetCardList';
diff --git a/frontend/src/pages/MainPage/components/Banner/Banner.tsx b/frontend/src/pages/MainPage/components/Banner/Banner.tsx
index 1bd1ed406..234a24025 100644
--- a/frontend/src/pages/MainPage/components/Banner/Banner.tsx
+++ b/frontend/src/pages/MainPage/components/Banner/Banner.tsx
@@ -1,4 +1,4 @@
-import React, { useRef, useState, useEffect, useCallback } from 'react';
+import { useRef, useState, useEffect, useCallback } from 'react';
 import * as Styled from './Banner.styles';
 import { SlideButton } from '@/constants/banners';
 import debounce from '@/utils/debounce';
diff --git a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx
index b6176ddfc..e3996e2d5 100644
--- a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx
+++ b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import mixpanel from 'mixpanel-browser';
 import * as Styled from './CategoryButtonList.styles';
 import iconAll from '@/assets/images/icons/category_button/category_all_button_icon.svg';
diff --git a/frontend/src/pages/MainPage/components/ClubCard/ClubCard.tsx b/frontend/src/pages/MainPage/components/ClubCard/ClubCard.tsx
index 78c400bc0..3f7477cab 100644
--- a/frontend/src/pages/MainPage/components/ClubCard/ClubCard.tsx
+++ b/frontend/src/pages/MainPage/components/ClubCard/ClubCard.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import mixpanel from 'mixpanel-browser';
 import ClubTag from '@/components/ClubTag/ClubTag';
 import ClubLogo from '@/components/ClubLogo/ClubLogo';
diff --git a/frontend/src/pages/MainPage/components/StatusRadioButton/StatusRadioButton.tsx b/frontend/src/pages/MainPage/components/StatusRadioButton/StatusRadioButton.tsx
index fe3ae1ce0..dc49676ad 100644
--- a/frontend/src/pages/MainPage/components/StatusRadioButton/StatusRadioButton.tsx
+++ b/frontend/src/pages/MainPage/components/StatusRadioButton/StatusRadioButton.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import useMixpanelTrack from '@/hooks/useMixpanelTrack';
 import * as Styled from './StatusRadioButton.styles';
 
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index ce53a12d5..5967d3d9d 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -17,6 +17,6 @@
       "@/*": ["src/*"],
     }
   },
-  "include": ["src"],
+  "include": ["src","eslint.config.mjs"],
   "exclude": ["node_modules", "dist"]
 }