feat(frontend): implement Next.js frontend package foundation with complete API integration

This commit establishes the complete Next.js frontend foundation with comprehensive backend integration:

## Core Infrastructure ✅
- Next.js 14 with App Router and TypeScript configuration
- Tailwind CSS with custom design system and dark mode
- Complete project structure with proper imports and path aliases

## API Integration Layer ✅
- Full-featured API client with authentication, file upload, and WebSocket
- Comprehensive TypeScript type definitions for all API responses
- Axios-based HTTP client with interceptors and error handling
- Socket.io integration for real-time progress updates

## Authentication System ✅
- useAuth hook with Google OAuth integration
- JWT token management with automatic refresh
- Protected route handling and session persistence
- Login/logout flow with redirect management

## File Upload System ✅
- useUpload hook with drag & drop functionality
- File validation (size, type, duplicates)
- Progress tracking during upload
- Batch creation and image processing workflow

## WebSocket Integration ✅
- useWebSocket hook for real-time updates
- Progress subscription for batch processing
- Reconnection logic with exponential backoff
- Event-driven updates for batches, images, and user data

## UI Foundation ✅
- Responsive Header with user authentication state
- Professional Footer with proper navigation
- Error Boundary for graceful error handling
- Toast notification system with multiple variants
- Loading spinners and UI components

## Layout & Navigation ✅
- Main page component with authenticated/unauthenticated states
- Dynamic content switching between landing and dashboard
- Mobile-responsive design with proper accessibility

This provides the complete foundation for a production-ready frontend that integrates seamlessly with the existing backend APIs, supporting all core workflows from authentication to file processing.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

packages/frontend/package.json

@@ -0,0 +1,92 @@
+{
+  "name": "@seo-image-renamer/frontend",
+  "version": "1.0.0",
+  "description": "Next.js frontend for SEO Image Renamer with complete backend integration",
+  "private": true,
+  "scripts": {
+    "dev": "next dev -p 3000",
+    "build": "next build",
+    "start": "next start -p 3000",
+    "lint": "next lint",
+    "type-check": "tsc --noEmit",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "dependencies": {
+    "next": "^14.0.4",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "@types/node": "^20.10.5",
+    "@types/react": "^18.2.45",
+    "@types/react-dom": "^18.2.18",
+    "typescript": "^5.3.3",
+    "tailwindcss": "^3.3.6",
+    "autoprefixer": "^10.4.16",
+    "postcss": "^8.4.32",
+    "@tailwindcss/forms": "^0.5.7",
+    "@tailwindcss/typography": "^0.5.10",
+    "@headlessui/react": "^1.7.17",
+    "@heroicons/react": "^2.0.18",
+    "socket.io-client": "^4.7.4",
+    "axios": "^1.6.2",
+    "@stripe/stripe-js": "^2.4.0",
+    "react-dropzone": "^14.2.3",
+    "react-hook-form": "^7.48.2",
+    "react-hot-toast": "^2.4.1",
+    "clsx": "^2.0.0",
+    "class-variance-authority": "^0.7.0",
+    "lucide-react": "^0.298.0",
+    "next-themes": "^0.2.1",
+    "zustand": "^4.4.7",
+    "jszip": "^3.10.1",
+    "file-saver": "^2.0.5",
+    "@hookform/resolvers": "^3.3.2",
+    "zod": "^3.22.4",
+    "react-query": "^3.39.3",
+    "framer-motion": "^10.16.16"
+  },
+  "devDependencies": {
+    "@types/file-saver": "^2.0.7",
+    "@types/jszip": "^3.4.1",
+    "@typescript-eslint/eslint-plugin": "^6.14.0",
+    "@typescript-eslint/parser": "^6.14.0",
+    "eslint": "^8.55.0",
+    "eslint-config-next": "^14.0.4",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "@testing-library/react": "^14.1.2",
+    "@testing-library/jest-dom": "^6.1.5",
+    "@testing-library/user-event": "^14.5.1",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "@storybook/addon-essentials": "^7.6.6",
+    "@storybook/addon-interactions": "^7.6.6",
+    "@storybook/addon-links": "^7.6.6",
+    "@storybook/blocks": "^7.6.6",
+    "@storybook/nextjs": "^7.6.6",
+    "@storybook/react": "^7.6.6",
+    "@storybook/testing-library": "^0.2.2",
+    "storybook": "^7.6.6",
+    "prettier": "^3.1.1",
+    "prettier-plugin-tailwindcss": "^0.5.9"
+  },
+  "engines": {
+    "node": ">=18.0.0",
+    "npm": ">=8.0.0"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}