@@ -72,71 +72,12 @@ Open your browser and navigate to:
7272
7373- ** Browse Movies:** View a paginated list of movies from the sample_mflix dataset with server-side rendering
7474- ** Movie Details:** Access comprehensive movie information including plot, cast, ratings, and metadata
75- - ** CRUD Operations:** Create, read, update, and delete movies through an intuitive interface
76- - ** Search & Filters:** Search movies with various filters and sorting options
77- - ** Vector Search:** Find movies with similar plot descriptions using AI-powered search
75+ - ** CRUD Operations:** Create, read, update, and delete movies
76+ - ** Search & Filters:** Search movies with various filters and sorting
77+ options using MongoDB Search
78+ - ** Vector Search:** Find movies with similar plot descriptions using
79+ MongoDB Vector Search
7880- ** Data Aggregations:** View analytics and insights built with MongoDB aggregation pipelines
79- - ** Responsive Design:** Optimized experience across desktop and mobile devices
80- - ** Real-time Updates:** Dynamic content updates without page refreshes
81-
82- ## Development
83-
84- ### Frontend Development
85-
86- The Next.js frontend uses:
87- - ** React 19** with TypeScript for modern component development
88- - ** Next.js 15** with App Router for server-side rendering and routing
89- - ** Turbopack** for fast development builds and hot reloading
90- - ** CSS Modules** for component-scoped styling
91- - ** ESLint** for code quality and consistency
92-
93- #### Development Mode
94-
95- For active development with hot reloading and fast refresh:
96-
97- ``` bash
98- npm run dev
99- ```
100-
101- This starts the development server on ` http://localhost:3000 ` with Turbopack for fast rebuilds.
102-
103- #### Production Build
104-
105- To create an optimized production build:
106-
107- ``` bash
108- npm run build # Creates optimized production build
109- npm start # Starts production server
110- ```
111-
112- The production build:
113- - Minifies and optimizes JavaScript and CSS
114- - Optimizes images and assets
115- - Generates static pages where possible
116- - Provides better performance for end users
117-
118- #### Code Quality
119-
120- To check code quality and formatting:
121-
122- ``` bash
123- npm run lint
124- ```
125-
126- ### API Integration
127-
128- The application connects to the backend API using:
129- - ** Server-Side Rendering** : Data fetched on the server for better SEO and performance
130- - ** TypeScript** : Type-safe API calls with interfaces matching backend data structures
131- - ** Error Handling** : Graceful fallbacks when the API is unavailable
132- - ** Loading States** : Professional loading indicators and skeleton screens
133-
134- ### Key Technologies
135-
136- - ** Next.js SSR** : Server-side rendering for better performance and SEO
137- - ** TypeScript** : Full type safety across the application
138- - ** CSS Modules** : Scoped styling to prevent style conflicts
139- - ** Responsive Design** : Mobile-first approach with flexible layouts
14081
14182## Issues
14283
0 commit comments