{"id":29174888,"url":"https://github.com/shailendrasingh189/trailerly","last_synced_at":"2026-04-09T07:01:56.929Z","repository":{"id":302254095,"uuid":"1011742692","full_name":"Shailendrasingh189/Trailerly","owner":"Shailendrasingh189","description":"🎬 Trailerly – A modern movie search app built with React.js. 🔎 Search movies, view details, and watch trailers instantly. 🛠️ Tech: React.js · TMDb API · React Router","archived":false,"fork":false,"pushed_at":"2025-07-01T10:32:32.000Z","size":6370,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-07-01T11:39:40.899Z","etag":null,"topics":["appwrite","react-router","reactjs","tailwindcss","tmdb","tmdb-api"],"latest_commit_sha":null,"homepage":"https://poetic-selkie-1b80ac.netlify.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Shailendrasingh189.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-01T09:20:01.000Z","updated_at":"2025-07-01T10:41:38.000Z","dependencies_parsed_at":"2025-07-01T11:39:45.623Z","dependency_job_id":"d4ef2a23-cf64-48f5-8a37-536099d18502","html_url":"https://github.com/Shailendrasingh189/Trailerly","commit_stats":null,"previous_names":["shailendrasingh189/trailerly"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Shailendrasingh189/Trailerly","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Shailendrasingh189%2FTrailerly","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Shailendrasingh189%2FTrailerly/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Shailendrasingh189%2FTrailerly/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Shailendrasingh189%2FTrailerly/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Shailendrasingh189","download_url":"https://codeload.github.com/Shailendrasingh189/Trailerly/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Shailendrasingh189%2FTrailerly/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264803768,"owners_count":23666512,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["appwrite","react-router","reactjs","tailwindcss","tmdb","tmdb-api"],"created_at":"2025-07-01T15:25:44.354Z","updated_at":"2025-12-30T21:41:30.745Z","avatar_url":"https://github.com/Shailendrasingh189.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🎬 Trailerly\n\n\u003e Discover movies, explore detailed info, and watch trailers instantly with a sleek UI. Built with **React.js**, **Appwrite**, **Tailwind CSS**, and powered by the **TMDB API**.\n\n---\n\n## 🧭 Table of Contents\n\n* 🤖 [Introduction](#-introduction)\n* ⚙️ [Tech Stack](#%EF%B8%8F-tech-stack)\n* 🔋 [Features](#-features)\n* 🤸 [Quick Start](#-quick-start)\n* 🕸️ [Snippets](#%EF%B8%8F-snippets-code-to-copy)\n* 🔗 [Assets](#-assets)\n* 🚀 [More](#-more)\n\n---\n\n## 🤖 Introduction\n\n**Trailerly** is a movie discovery web application where users can:\n\n* Browse trending movies\n* Search any movie title\n* View complete details like plot, cast, rating\n* Watch trailers directly\n\nIt features a **modern, responsive design** and is powered by the **TMDB API** for real-time movie data and trailers.\n\n---\n\n## ⚙️ Tech Stack\n\n### 🔹 React.js\n\nA powerful JavaScript library by Meta for building responsive UIs.\n\n### 🔹 Appwrite\n\nAn open-source Backend-as-a-Service (BaaS) platform used for future-ready authentication and database services.\n\n### 🔹 Tailwind CSS\n\nA utility-first CSS framework for rapidly building custom, responsive UI.\n\n### 🔹 TMDB API\n\nThe Movie Database API used to fetch real-time data about movies, posters, ratings, and trailers.\n\n### 🔹 Vite\n\nA fast modern frontend build tool that improves development performance.\n\n---\n\n## 🔋 Features\n\n* 🔎 **Search Movies** – Search movies by name with instant results\n* 🎬 **Watch Trailers** – Click to watch official trailers via YouTube\n* 📊 **Trending Section** – Displays dynamic trending movies\n* 📝 **Detailed Movie Pages** – Shows title, overview, release date, rating, cast\n* 📱 **Responsive Design** – Optimized for all screen sizes\n\n---\n\n## 🤸 Quick Start\n\n### Prerequisites\n\n* Node.js\n* npm\n* Git\n\n### Clone the Repository\n\n```bash\ngit clone https://github.com/your-username/trailerly.git\ncd trailerly\n```\n\n### Install Dependencies\n\n```bash\nnpm install\n```\n\n### Set Environment Variables\n\nCreate a `.env.local` file in the root and add:\n\n```env\nVITE_TMDB_API_KEY=your_tmdb_api_key\nVITE_MOVIE_API_BASE_URL=tmdb_movie_api_base_url\nVITE_APPWRITE_PROJECT_ID=your_appwrite_project_id\nVITE_APPWRITE_DATABASE_ID=your_appwrite_database_id\nVITE_APPWRITE_COLLECTION_ID=your_appwrite_collection_id\nVITE_APPWRITE_ENDPOINT=appwrite_endpoint_url\n```\n\n### Run the App\n\n```bash\nnpm run dev\n```\n\nOpen [http://localhost:5173](http://localhost:5173) to view the app.\n\n---\n\n## 🕸️ Snippets (Code to Copy)\n\n\u003e You can explore reusable components like:\n\n* `components/MovieCard.jsx`\n* `components/Search.jsx`\n* `components/Spinner.jsx`\n\n---\n\n## 🔗 Assets\n\n* Logo and icons from the TMDB official kit\n* Trailer thumbnails via YouTube API\n\n---\n\n## 🚀 More\n\nI wanted to build more amazing projects. Level up with advanced React.js or dive into full-stack apps with Next.js and nodejs !\n\n\n---\n\n## 🙌 Contribution\n\nPull requests are welcome. For major changes, open an issue first to discuss what you would like to change.\n\n---\n\n## ✨ Inspired\n\nby Mastery Javscript \n\n## 📄 License\n\nMIT\n\n---\n\n## 👨‍💻 Author\n\n**Your Name** – [LinkedIn](www.linkedin.com/in/shailendrasingh189) | [GitHub](www.github.com/in/shailendrasingh189)\n\n---\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshailendrasingh189%2Ftrailerly","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshailendrasingh189%2Ftrailerly","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshailendrasingh189%2Ftrailerly/lists"}