feat: storybook 생성

web-app/.storybook/main.ts

@@ -0,0 +1,19 @@
+import type { StorybookConfig } from '@storybook/react-vite'
+
+const config: StorybookConfig = {
+  stories: ['../app/**/*.stories.@(ts|tsx)'],
+
+  framework: '@storybook/react-vite',
+
+  // Storybook 전용 Vite 설정 파일 사용 (React Router 플러그인 제외)
+  core: {
+    builder: {
+      name: '@storybook/builder-vite',
+      options: {
+        viteConfigPath: '.storybook/vite.config.ts',
+      },
+    },
+  },
+}
+
+export default config

web-app/.storybook/preview.ts

@@ -0,0 +1,16 @@
+import type { Preview } from '@storybook/react'
+
+import '../app/app.css'
+
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+}
+
+export default preview

web-app/.storybook/vite.config.ts

@@ -0,0 +1,12 @@
+import tailwindcss from '@tailwindcss/vite'
+import { defineConfig } from 'vite'
+
+// Storybook 전용 Vite 설정 (React Router 플러그인 제외)
+export default defineConfig({
+  plugins: [tailwindcss()],
+  resolve: {
+    alias: {
+      '~': new URL('../app', import.meta.url).pathname,
+    },
+  },
+})