Skip to content

Commit e065602

Browse files
committed
docs: update README.md
1 parent c8806c3 commit e065602

File tree

1 file changed

+85
-1
lines changed

1 file changed

+85
-1
lines changed

README.md

Lines changed: 85 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,85 @@
1-
This repo is a clone of Netflix Landing page.
1+
# Netflix Landing Page Clone
2+
3+
## 📺 Project Overview
4+
5+
This project is a responsive clone of the Netflix landing page, created using pure HTML, CSS, and JavaScript. It demonstrates the ability to recreate a modern, interactive web interface with attention to design and user experience.
6+
7+
## 🌟 Features
8+
9+
- Fully responsive design
10+
- Animated sections mimicking Netflix's original landing page
11+
- Interactive FAQ
12+
- Email validation
13+
- Smooth transitions and hover effects
14+
- Modern, clean UI that closely resembles the Netflix landing page
15+
16+
## 🚀 Technologies Used
17+
18+
- HTML5
19+
- CSS3 (Flexbox & Grid)
20+
- Vanilla JavaScript
21+
- Responsive Design Techniques
22+
23+
## 📸 Screenshots
24+
25+
<img src="screenshots/desktop-view-1.png" />
26+
<img src="screenshots/desktop-view-2.png" />
27+
<div>
28+
<img src="screenshots/mobile-view-1.jpg" width="270" />
29+
<img src="screenshots/mobile-view-2.jpg" width="270" />
30+
<img src="screenshots/mobile-view-3.jpg" width="270" />
31+
</div>
32+
33+
## 🛠 Installation
34+
35+
### Prerequisites
36+
- Web browser (Chrome, Firefox, Safari, Edge)
37+
- Text editor (VS Code, Sublime Text, etc.)
38+
39+
### Steps
40+
1. Clone the repository
41+
```bash
42+
git clone https://github.com/premdood/netflix-clone.git
43+
```
44+
45+
2. Navigate to the project directory
46+
```bash
47+
cd netflix-clone
48+
```
49+
50+
3. Open `index.html` in your preferred web browser
51+
52+
## 🔍 Key Components
53+
54+
### HTML Structure
55+
- Semantic HTML5 markup
56+
- Responsive layout sections
57+
- Accessibility considerations
58+
59+
### CSS Styling
60+
- Flexbox and Grid for layout
61+
- Media queries for responsiveness
62+
- Hover and transition effects
63+
64+
### JavaScript Functionality
65+
- Email input validation
66+
- Smooth scrolling
67+
- Interactive elements
68+
69+
## 🏆 Challenges Overcome
70+
71+
- Replicating Netflix's complex layout
72+
- Creating responsive design
73+
- Implementing interactive FAQ section
74+
75+
## 🌐 Live Demo
76+
77+
[View Live Demo](https://premdood.github.io/netflix-clone)
78+
79+
## 📞 Contact
80+
81+
Prem Singh - [LinkedIn](https://www.linkedin.com/in/premdood)
82+
83+
---
84+
85+
**Disclaimer**: This project is for educational purposes only and is not affiliated with Netflix.

0 commit comments

Comments
 (0)