A full-stack music production app with React Native frontend and FastAPI backend, all containerized with Docker.
- Frontend: React Native app with TikTok-style video scrolling
- Backend: FastAPI REST API for sample management
- Infrastructure: Docker Compose for development environment
- Docker and Docker Compose installed
- Node.js 18+ (for local development)
- React Native development environment setup (Android Studio/Xcode)
- Start all services with Docker Compose:
docker-compose up --buildThis will start:
- Backend API on
http://localhost:8000 - Frontend Metro bundler on
http://localhost:8081
- For React Native development:
# In a new terminal, navigate to frontend
cd frontend
# Install dependencies locally (for better IDE support)
npm install
# Run on Android
npm run android
# Or run on iOS
npm run iosBackend only:
docker-compose up backendFrontend Metro bundler only:
docker-compose up frontend- The Docker containers provide the development servers
- Use your local React Native CLI to run the app on device/simulator
- The Metro bundler (running in Docker) will serve the JavaScript bundle
- Hot reload works seamlessly between Docker and your device
GET /- API statusGET /samples- List all music samplesGET /health- Health check
sampleit/
├── docker-compose.yml # Main orchestration
├── backend/
│ ├── Dockerfile
│ ├── app/
│ │ ├── main.py # FastAPI app
│ │ └── models.py # Data models
│ └── requirements.txt
├── frontend/
│ ├── Dockerfile
│ ├── src/
│ │ ├── screens/ # React Native screens
│ │ └── components/ # Reusable components
│ └── package.json
└── README.md
- Place your MP4 videos in
backend/static/videos/ - Place your MP3 audio files in
backend/static/audio/ - Update the sample data in
backend/app/main.pyor connect to a database
- Add database integration (PostgreSQL)
- Implement file upload endpoints
- Add user authentication
- Connect frontend to backend API
- Add production deployment configuration