| password | |
|---|---|
| [email protected] | jeany123 |
Yoga Bear is a C2C platform that matches yoga instructors with those interested in learning yoga.
You can take yoga courses online, offline, or through videos.
Demo Video
- Built the website by Next.js with TypeScript and styled-components. (applied SSG, SSR, and CSR on different pages).
- Implemented group video chat with Next.js serverless function, Pusher.js (WebSockets server library), and WebRTC.
- Made a customized video player for the course room. (included window full screen, full screen, thumbnail on time-progress-bar, forward, rewind, speed control, and voice control functions.)
- Enabled users to launch video courses and upload course covers, member avatars, and article pictures through Firebase Cloud Storage.
- Compressed images (< 1 MB) before users uploaded to improve loading speed and reduce storage costs with browser-image-compression.
- Integrated a text editor which can upload images with React-Quill and Firebase Cloud Storage.
- Used Firebase Firestore for data management (included users, courses, and articles data.).
- Provided a calendar with reserving, reviewing, and joining room functions integrated for users to schedule their online and offline courses by React-Scheduler and Material-UI.
- Used EmailJS to send confirmation mail after buying or reserving courses.
- Wrote some unit tests, integration tests (for React functional components), and snapshot tests by Jest with React-Testing-Library.
- Managed global states by Recoil and treated nested states as immutable via Immer.
- Used ESLint (Airbnb config) to lint my code.
Users can sign up and log in by email and select their identities (teacher or student).
Users can input a fake credit card to top-up bear money.
Bear money can reserve online, offline courses or buy video courses.
Users can browse all video courses and buy the course they like.
Users can browse all teachers and reserve their courses.
Students can use calendar to reserve and review online, offline courses and enter the video-call room.
Teachers cna use calendar to arrange their online, offline courses and enter the video-call room.
Teachers can launch video courses.
Users can browse all courses they bought and all courses they reserved on my courses page.
Users can enter the video course room which they have bought.
Users can enter the video-call course room which they have reserved.
Users can post articles, leave messages, and click the like button on forum page.
