Projects

Movies/Series streaming platform

2023·2 min read

React
TypeScript
Tailwind CSS
NextJS
LiveGitHub

Browse trending titles, dive into rich detail pages, and pick up exactly where you left off — all from a single keyboard-friendly UI.

Movies/Series streaming platform preview

🎬 Reely

Discover, track, and stream movies and TV shows — a fast, modern, TMDB-powered viewing experience.

🚀 Watch on Reely Space →

Browse trending titles, dive into rich detail pages, and pick up exactly where you left off — all from a single keyboard-friendly UI.

Reely is a production-grade movie and TV show tracker built on the TMDB API. It is designed to feel native: server-rendered for speed, animated for delight, and instrumented for serious frontend craftsmanship.

⭐ If Reely is useful to you, please star the repo.

✨ Features

  • TMDB-powered catalog — trending, popular, top-rated, and now-playing movies and TV shows pulled live from the TMDB API.
  • Hero slider — auto-rotating, animated showcase of trending media on the landing page.
  • Movies & TV shows browsing — dedicated, filterable listing pages with infinite-scroll style pagination.
  • Rich detail pages — synopses, credits, ratings, related media, and extra metadata for every title.
  • Season & episode navigator — drill into TV shows by season and episode with a dedicated selector UI.
  • Command palette search (⌘K) — debounced, instant search across movies and TV shows via a cmdk-powered dialog.
  • Persistent watch history — track what you've watched, revisit it on the dedicated history page, and clear entries you no longer want.
  • Filter sidebar & sheet — genre, rating, and date filters powered by nuqs for shareable, URL-synced state.
  • SEO & structured data — full JSON-LD (Website, Organization, CollectionPage, Breadcrumb), Open Graph, Twitter Cards, and dynamic OG image generation.
  • PWA-ready — manifest, Apple touch icons, theme colors, and viewport tuned for mobile installs.
  • Analytics built in — PostHog for product analytics plus Google Tag Manager support.
  • Deployed on the edge — ships to Cloudflare Workers via OpenNext, with a Cloudflare WAF setup script included.

🛠️ Tech Stack

Layer Technology
Framework Next.js 16 (App Router, Turbopack) + React 19
Language TypeScript 6
Styling Tailwind CSS 4 + tailwindcss-animate + @tailwindcss/typography
UI primitives Radix UI + custom components (shadcn-style)
Data fetching TanStack Query 5 + React Server Components
URL state nuqs
Animation Framer Motion 12
Carousels Splide
Search cmdk command palette
Forms / dates react-day-picker, date-fns
Notifications sonner
Data source TMDB API
Analytics PostHog + Google Tag Manager
Deployment Cloudflare Workers via OpenNext
Tooling ESLint, Prettier, Husky, Commitlint, Renovate

🙌 Credits

Built by Mohamed Gado. Data and imagery courtesy of TMDB — Reely is not endorsed or certified by TMDB.

Buy Me A Coffee!

More projects

  • Books library2024 · React
  • Build your own ChatGPT2023 · React
  • JSON Converter2024 · React
All projects