Study Stream

Full-stack productivity web app inspired by the Pomodoro method, featuring real-time chat, course space, and personal learning analytics.

Tan Luc

Β· Visit Project

MongoDBReactNode.jsTailwind CSSAgoraAPIVercel

About the Project

Study Stream is a full-stack web application that supports learners in managing focus, time, and motivation. Developed as part of a thesis project, it integrates the Pomodoro technique with modern full-stack technologies.

Study Stream Home

πŸ”§ Key Features

  • ⏲️ Pomodoro Timer: Customizable sessions with ambient background, music, and task list.
  • πŸ’¬ Real-time Chat & AI Assistant: Peer messaging with productivity chatbot (WebSocket + Agora).
  • πŸ“š Learning Space: Explore and enroll in topic-based courses.
  • πŸ“Š Focus Analytics: Track daily, average, and total study time.
  • πŸ‘€ User Profile: Avatar updates, achievement tracking, and history.
Pomodoro Focus Mode
Custom Pomodoro timer with background and task support.

Tech Stack Highlights

  • Frontend: React with Tailwind CSS and MUI for modular, responsive UI.
  • Backend: Node.js, Express, MongoDB (MERN architecture) with JWT authentication.
  • Real-time: WebSocket + Agora API for live chat and interactions.
  • DevOps: Frontend on Vercel, backend on Render.

What It Demonstrates

  • Strong grasp of full-stack development using modern JS tools.
  • Experience with real-time APIs and third-party service integration.
  • Clean architecture with separation of concerns, reusable components, and RESTful API design.
  • Focus on user experience + data insight through interactive UI and analytics.

πŸ’‘ Live Demo: study-stream-fe.vercel.app