Skip to content

Sam-coder101/Netflix

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

87 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Netflix Clone (static landing page)

This is a small static landing page inspired by Netflix. It's intended as a front-end demo built with plain HTML, CSS, and a small JavaScript file. No build step is required — just open the HTML file in a browser.

Files

  • netflix.html — Main HTML file for the Netflix-style landing page.
  • Astyle.css — Styles for the page.
  • script.js — Client-side JavaScript used for UI interactions (e.g., scrolling movies, dropdown behavior).

How to view locally

  1. Open netflix.html directly in your browser (double-click the file or use "Open File...").
  2. Or serve the folder with a simple static server (recommended if you want to inspect network requests):
# from inside the Netflix folder or repository root
python -m http.server 8000
# Then open http://localhost:8000/Netflix/netflix.html

# Or using http-server (Node.js)
npm install -g http-server
http-server -p 8000
# Then open http://localhost:8000/Netflix/netflix.html

Features

  • Responsive header and hero/banner with CTA and email input.
  • "Trending Now" movie strip with left/right scroll control button.
  • Informational feature boxes and FAQ section.

📁 Project Structure

Below is the complete file structure of the Netflix Clone project:

Netflix/                     # Root folder of the project
├── .github/                  # GitHub configuration files
│   └── workflows/            # CI/CD workflow files
├── vercel-deploy.yml         # Vercel deployment configuration
├── Netflix/                  # Main project folder (optional naming)
├── Astyle.css                # Global styling for the project
├── index.html                # Home page of the project
├── movies.css                # Styling specifically for movies page
├── movies.html               # Movies page
├── netflix-clone.html        # Main Netflix clone page
├── script.js                 # JavaScript functionality for the project
├── series.css                # Styling specifically for series page
├── series.html               # Series page
├── CONTRIBUTING.md           # Guidelines for contributing to the project
├── LICENCE                   # License file (MIT, Apache, etc.)
└── README.md                 # Project documentation (this file)

Notes and assets

  • The page uses externally-hosted images for movie posters and the Netflix logo. If you plan to use this offline, replace those URLs with local images inside an img/ folder and update netflix.html accordingly.
  • There are no external dependencies or build tools required.

Development suggestions

  • Improve accessibility: add ARIA roles and proper labels for the input elements and the movie carousel.
  • Replace placeholder movie images with local assets for offline demos.
  • Add unit tests for JavaScript behavior if the project grows (use Jest/Playwright for UI tests).

Contributor

A heartfelt thank you to all the contributors who have dedicated their time and effort to make this project a success.
Your contributions—whether it’s code, design, testing, or documentation—are truly appreciated! 🚀

Thanks to all the wonderful contributors 💖

See full list of contribution from contributor Contributor Graph

License

No license is specified. Add a LICENSE file if you want to grant reuse permissions.

Releases

No releases published

Packages

No packages published

Contributors 16