This is a full-stack movie browsing application built with Python FastAPI and Next.js, demonstrating MongoDB operations using the sample_mflix dataset. The application showcases CRUD operations, aggregations, and MongoDB Search using the PyMongo driver.
├── README.md
├── client/ # Next.js frontend (TypeScript)
└── server/ # Python FastAPI backend
├── src/
├── tests/
├── .env.example
├── main.py
├── pytest.ini
├── requirements.in
└── requirements.txt
- Python 3.10 to Python 3.13
- Node.js 20 or higher
- MongoDB Atlas cluster or local deployment with the
sample_mflixdataset loaded - pip for Python package management
- Voyage AI API key (For MongoDB Vector Search)
Navigate to the Python FastAPI server directory:
cd server/Create a .env file from the example:
cp .env.example .envEdit the .env file and set your MongoDB connection string:
# MongoDB Configuration
MONGO_URI=mongodb+srv://<username>:<password>@<cluster>.mongodb.net/sample_mflix?retryWrites=true&w=majority
MONGO_DB=sample_mflix
# Voyage AI Configuration
# API key for Voyage AI embedding model (required for Vector Search)
VOYAGE_API_KEY=your_voyage_api_key
# CORS Configuration
# Comma-separated list of allowed origins for CORS
CORS_ORIGINS=http://localhost:3000,http://localhost:3001Note: Replace username, password, and cluster with your actual MongoDB Atlas
credentials.
Make a virtual environment:
python -m venv .venvActivate the virtual environment:
source .venv/bin/activateInstall Python dependencies:
pip install -r requirements.txtFrom the server/ directory, run:
uvicorn main:app --reload --port 3001The server will start on http://localhost:3001. You can verify it's running by visiting:
- API root: http://localhost:3001/api/movies
- API documentation (Swagger UI): http://localhost:3001/docs
- Interactive API documentation (ReDoc): http://localhost:3001/redoc
Open a new terminal and navigate to the client directory:
cd clientInstall dependencies:
npm installStart the development server:
npm run devThe Next.js application will start on http://localhost:3000.
Open your browser and navigate to:
- Frontend: http://localhost:3000
- Backend API: http://localhost:3001
- API Documentation: http://localhost:3001/docs
- Browse Movies: View a paginated list of movies from the sample_mflix dataset
- Search: Full-text search using MongoDB Search
- Vector Search: Semantic search using MongoDB Vector Search with Voyage AI embeddings
- Filter: Filter movies by genre, year, rating, and more
- Movie Details: View detailed information about each movie
- Aggregations: Complex data aggregations and analytics
The Python FastAPI backend uses:
- FastAPI for REST API framework
- PyMongo for database operations
- Voyage AI for vector embeddings
- fastapi for ASGI server
To run all tests:
cd server/
source .venv/bin/activate # or `.venv\Scripts\activate` on Windows
pytest tests/ -vThe Next.js frontend uses:
- React 19 with TypeScript
- Next.js 16 with App Router
- Turbopack for fast development builds
For active development with hot reloading and fast refresh:
cd client
npm run devThis starts the development server on http://localhost:3000 with Turbopack for fast rebuilds.
To create an optimized production build and run it:
cd client
npm run build # Creates optimized production build
npm start # Starts production serverThe production build:
- Minifies and optimizes JavaScript and CSS
- Optimizes images and assets
- Generates static pages where possible
- Provides better performance for end users
To check code quality:
cd client
npm run lintIf you have problems running the sample app, please check the following:
- Verify that you have set your MongoDB connection string in the
.envfile. - Verify that you have created and activated a Python
.venvon Python v3.10 through v3.13. - Verify that you have started the Python FastAPI server.
- Verify that you have started the Next.js client.
- Verify that you have no firewalls blocking access to the server or client ports.
If you have verified the above and still have issues, please
open an issue
on the source repository mongodb/docs-sample-apps.