Cinecanvas is a fast, modern movie‑browsing web app built with Vite and React, styled using Tailwind CSS and shadcn/ui, integrated with TMDB and VidSrc APIs for metadata and streaming embeds, and deployed on Cloudflare Pages for global performance.
- Search & Discovery: Browse and search movies/TV shows via the TMDB API, which offers a community‑driven database of over 800,000 films and 150,000 TV shows with images and credits.
- Streaming Embeds: Seamlessly embed trailers and previews using VidSrc’s free streaming API, providing responsive, auto‑updated, high‑quality links via simple REST endpoints.
- Responsive UI: Utility‑first design with Tailwind CSS, combining low‑level, single‑purpose classes for rapid, custom styling directly in markup.
- Accessible Components: UI primitives and patterns from shadcn/ui accelerate accessible React component assembly on top of Tailwind.
- Blazing Fast HMR: Vite’s Hot Module Replacement updates modules in‑place without full reloads, preserving state and boosting developer productivity.
- Global Edge Deployment: Hosted on Cloudflare Pages for instant, Git‑driven builds, automatic HTTPS, and edge caching across 275+ cities.
Vite is a next‑generation build tool offering instant server start, on‑demand ESM, and lightning‑fast Hot Module Replacement.
React is a declarative JavaScript library for building reusable UI components, making complex UIs easier to reason about and maintain.
Tailwind CSS is a utility‑first framework that provides low‑level, composable classes for styling without opinionated defaults.
shadcn/ui delivers a suite of accessible, theme‑aware React components built on top of Tailwind, streamlining UI development.
The Movie Database (TMDb) API supplies extensive metadata—images, synopses, cast, and crew—to power search, discovery, and detail pages.
VidSrc offers a lightweight video‑streaming API and embed URLs for movies and episodes, updating links automatically for optimal quality.
Cloudflare Pages is a JAMstack platform that deploys static and full‑stack applications to Cloudflare’s global network with zero‑config Git integration.
git clone https://github.com/Optimized-Brain/Cinecanvas.git
cd Cinecanvas
npm install
Add your TMDB_API_KEY
and any VidSrc credentials.
npm run dev
Open http://localhost:5173 to explore Cinecanvas locally.
This project is licensed under the MIT License—see the LICENSE file for details.