MewsSystems · i-zimmerman · Sep 10, 2025 · Sep 10, 2025 · Sep 10, 2025
diff --git a/.gitignore b/.gitignore
diff --git a/Readme.md b/Readme.md
diff --git a/frontend-app/.cta.json b/frontend-app/.cta.json
@@ -0,0 +1,13 @@
+{
+  "projectName": ".",
+  "mode": "file-router",
+  "typescript": true,
+  "tailwind": true,
+  "packageManager": "npm",
+  "git": true,
+  "version": 1,
+  "framework": "react-cra",
+  "chosenAddOns": [
+    "eslint"
+  ]
+}
diff --git a/frontend-app/.env.example b/frontend-app/.env.example
@@ -0,0 +1 @@
+VITE_TMDB_API_KEY=YOUR_TMDB_API_KEY
diff --git a/frontend-app/.gitignore b/frontend-app/.gitignore
@@ -0,0 +1,9 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
+count.txt
+.env
+.nitro
+.tanstack
diff --git a/frontend-app/.prettierignore b/frontend-app/.prettierignore
@@ -0,0 +1,3 @@
+package-lock.json
+pnpm-lock.yaml
+yarn.lock
diff --git a/frontend-app/.vscode/settings.json b/frontend-app/.vscode/settings.json
@@ -0,0 +1,11 @@
+{
+  "files.watcherExclude": {
+    "**/routeTree.gen.ts": true
+  },
+  "search.exclude": {
+    "**/routeTree.gen.ts": true
+  },
+  "files.readonlyInclude": {
+    "**/routeTree.gen.ts": true
+  }
+}
diff --git a/frontend-app/README.md b/frontend-app/README.md
@@ -0,0 +1,51 @@
+# Movie Search App
+
+A modern React application for searching movies, built with cutting-edge technology stack.
+
+## 🎯 Key Features
+
+- **Movie Search**: Intuitive search by title with instant results
+- **Detailed Information**: Complete movie information including poster, description, rating, genres
+- **Pagination**: Convenient navigation through search results
+- **Responsive Design**: Optimized for all devices
+- **Modern UI**: Using shadcn/ui components
+
+## 🛠 Technology Stack
+
+- **Frontend**: React 18 + TypeScript
+- **Routing**: TanStack Router
+- **Styling**: Tailwind CSS + shadcn/ui
+- **Build Tool**: Vite
+- **API**: The Movie Database (TMDB)
+- **Testing**: Jest + React Testing Library
+- **Architecture**: Feature-Sliced Design (FSD)
+
+## 📁 Project Structure
+
+The project is organized following Feature-Sliced Design principles:
+
+```
+src/
+├── entities/movie/          # Business entities
+├── features/               # Feature capabilities
+│   ├── movie-search/       # Movie search
+│   └── pagination/         # Pagination
+├── pages/                  # Application pages
+├── shared/                 # Reusable components
+└── widgets/                # Composite blocks
+```
+
+## 🚀 Getting Started
+
+```bash
+npm install
+npm run dev
+```
+
+## ✅ Testing
+
+```bash
+npm test
+```
+
+The application includes unit tests for all key components and functions.
diff --git a/frontend-app/components.json b/frontend-app/components.json
@@ -0,0 +1,22 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "src/styles.css",
+    "baseColor": "stone",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "registries": {}
+}
diff --git a/frontend-app/eslint.config.js b/frontend-app/eslint.config.js
@@ -0,0 +1,5 @@
+//  @ts-check
+
+import { tanstackConfig } from '@tanstack/eslint-config'
+
+export default [...tanstackConfig]
diff --git a/frontend-app/index.html b/frontend-app/index.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Web site created using create-tsrouter-app"
+    />
+    <link rel="apple-touch-icon" href="/logo192.png" />
+    <link rel="manifest" href="/manifest.json" />
+    <title>Create TanStack App - .</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>