Flow. is not just a pomodoro timer. It is a fully decentralized, real-time virtual study room designed to connect students across the globe. Built on a massively scalable serverless architecture, Flow eliminates backend bottlenecks, allowing users to study together simultaneously.
The UI employs a beautiful, glassmorphic minimal aesthetic, making the tools feel tactile, responsive, and visually distinct.
- P2P Serverless Rooms: Join instantly using a 6-character room code. No heavy WebSockets to crash the server—all states sync via Supabase Realtime Edge nodes.
- WebRTC Video: See your study partners in real-time. Built with pure WebRTC, the video feeds route directly peer-to-peer for zero-latency connection.
- Synchronized Pomodoro: A synchronized focus timer that updates seamlessly for everyone in the room. If one person pauses, everyone pauses.
- Integrated AI Assistant: Stuck on a problem? Type
/aiin the room chat, and Groq's high-speed AI will instantly respond to everyone in the room with the answer. - Real-Time Task Management: Add shared goals. When a task is checked off, the progress bar updates live on everyone's screen, backed persistently by PostgreSQL.
- Spotify Integration: Built-in Lo-Fi beats to keep the deep focus going.
| Login | Focus Room |
|---|---|
 |
 |
Flow leverages a bleeding-edge, lightweight stack for maximum performance and zero infrastructure cost.
Frontend:
- HTML5 / Vanilla CSS (Neo-Brutalist Design System)
- Vanilla JavaScript (ES6 Modules)
- WebRTC (P2P Video & Audio Signaling)
Backend / Infrastructure:
- Node.js & Express: Ultra-lightweight static file server & AI secure endpoint.
- Supabase Realtime: Phoenix/Elixir edge nodes for millisecond-latency state syncing.
- Supabase PostgreSQL: Persistent storage for user profiles and shared tasks.
- Groq AI: Llama 3 model for the integrated high-speed study assistant.
Want to run Flow locally or deploy it yourself?
- Node.js installed
- A Supabase project (Free Tier)
- A Groq API Key (optional, only needed for
/aichat)
-
Clone the repository:
git clone https://github.com/ManasDasri/Flow-study.git cd Flow-study -
Install dependencies:
npm install
-
Set up environment variables: Create a
.envfile in the root directory and add your Groq API Key (optional):GROQ_API_KEY=your_groq_api_key_here
If omitted, the app still runs and the
/aicommand will return a configuration message. -
Start the server:
npm start
-
Open in browser: Navigate to
http://localhost:3000
Flow uses Supabase for Realtime WebRTC signaling, Chat, and Tasks.
Choose one mode:
- Fast login (recommended for local/testing):
- Go to Supabase Dashboard.
- Go to Authentication -> Providers -> Email.
- Toggle Confirm email to OFF and click Save.
- Verified-email login (production):
- Keep Confirm email ON.
- Configure Auth -> Email Templates/SMTP with a real provider (Resend, SendGrid, etc.).
- Without SMTP, confirmation emails will not be delivered.
Run the SQL in sql/schema.sql in your Supabase SQL Editor. It creates the rooms, room_participants, tasks, and sessions tables, sets up Row Level Security, and defines the join_room RPC that the app uses to securely join a room (with optional PIN checking) — all of the app's room/task/session features depend on this exact schema, not a simplified version of it.
If you plan to host Flow for public use beyond a trusted circle, we highly recommend:
- Configure TURN for global camera reliability: Flow fetches TURN credentials from Twilio at runtime via the server (
TWILIO_ACCOUNT_SID,TWILIO_AUTH_TOKENin.env) and falls back to STUN-only if that's unavailable, which will fail to connect users behind restrictive NATs/corporate firewalls. Configure a paid Twilio account (or another provider) before relying on this for real-world use — a free/trial TURN allotment will run out under real traffic.