Medi8r
The app aggregates various data points from streaming on-demand videos and presents them to creators through a subscription model.
Tech Stack
- Nextjs
- Mantine UI
- Tanstack Query
- Ionic
- Typescript
- Turborepo
- Redis
- BullMQ
- FCM
- Cloudflare Stream
- Firebase Auth
- MongoDB
- Nodejs
- Fastify
The whole software was architected, developed, and is occasionally maintained by me.
Key Highlights:
Choosing a video streaming service:
The most important part of the application was to store videos and stream them to users. Dealing with videos turns out to be super expensive in terms of costs and maintenance. Cloudflare Stream fits in as the solution perfectly. Less pricing, less maintenance, auto resolution handling based on customer's bandwidth, no encoding charges, and the reliability of Cloudflare's network.
Collecting custom analytics:
Cloudflare Stream gave us basic video metrics such as average watch timings and countries watched from. We also wanted to collect other metrics from the app related to users, so I collected those metrics on the backend using BullMQ, a message queue, to make sure we don't miss any data and do not overload the backend. On the frontend, I used the native <video> DOM events to capture different metrics.
Realtime comment system:
The client wanted people to engage with the videos by commenting on them, similar to commenting on Instagram and Facebook posts. I designed this using BullMQ, to save the comments and FCM to push those comments to users.
Learnings:
- I got to learn and understand how analytics works, and how it is collected and aggregated for understanding the impact. This was my very first project where I worked in the domain of analytics.
- I learned about a lot of different on-demand video streaming platforms and what their offerings are, and how they compete with each other in terms of features and pricing.
- I learned about subscribing and publishing on custom topics in FCM. Until now I only used it for in-app notifications.