A MERN-stack web companion to the MyMissionMyRecord (MHMR) Android health journaling app. Users record or upload video health journals, transcribe them, annotate them with emotions, pain scale, keywords, and location, and run AI-powered analysis across video sets — including word clouds, bar graphs, line graphs, and text reports.
| Layer | Technology |
|---|---|
| Frontend | React 18 + TypeScript, Vite, React Router v6, Tailwind CSS, Zustand |
| Backend | Node.js + Express + TypeScript (tsx runner) |
| Database | MongoDB (local) |
| AI | OpenAI GPT-4 (analysis) + Whisper (transcription) |
| Media | FFmpeg (audio extraction), Multer (file upload) |
| Charts | Recharts, d3-cloud |
Make sure the following are installed on your machine before getting started:
- Node.js (v18 or later) — https://nodejs.org
- MongoDB (Community Edition, running locally) — https://www.mongodb.com/try/download/community
- FFmpeg — required for audio extraction from video files
- macOS:
brew install ffmpeg - Windows: https://ffmpeg.org/download.html (add to PATH)
- Linux:
sudo apt install ffmpeg
- macOS:
- An OpenAI API key — https://platform.openai.com
- concurrently (global) — for the one-command startup script:
npm install -g concurrently
git clone https://github.com/IMDC/MMMR-Web.git
cd MMMR-Webcd server && npm install && cd ../client && npm install && cd ..Copy the example env file and fill in your OpenAI API key:
cp server/.env.example server/.envEdit server/.env — both API_OPENAI_CHATGPT and API_KEY_SPEECH_TO_TEXT
mkdir -p server/uploads/videosFrom the root directory:
npm run run-mmmrThis starts the backend and frontend together. Then open http://localhost:3000 in your browser.
The backend runs on port 5001 (port 5000 is reserved by macOS AirPlay). The Vite dev server proxies
/apirequests automatically.
- Record video via webcam or upload an existing file
- Annotate videos with emotion stickers, pain scale, keywords, location, and text comments
- Transcribe videos using OpenAI Whisper with real-time progress
- Crisis keyword detection with in-app warning
- Organize videos into sets for group analysis
- AI-generated summaries (bullet points or paragraph) using GPT-4
- Word frequency bar graph with hide/show word settings
- Word frequency trends line graph with daily/weekly/date-range views and multi-word comparison
- Interactive word cloud with color palette selection
- Text report with sentiment distribution pie chart and per-video breakdown
- Sharing links and contact management