I want you to build a complete beginner-friendly coding website called "KarthikCodes" with a mandatory logo. Follow these steps:
1. **Index Page (Landing Page)**
- Display the brand name "KarthikCodes" with an attractive animated logo.
- After clicking "Enter", redirect to the login page.
2. **Login Page (Advanced Features)**
- Include OTP verification system.
- Send login alert emails.
- Add "Forgot Password" option.
- Provide Google login and GitHub login buttons.
- Track and display login history.
- After successful login, send a welcome email from **karthikcodes26@gmail.com** to the user.
3. **Courses Page**
- After login, show a course selection interface with these options:
- Hibernate
- Spring
- Advanced Java
- DSA
- HTML & CSS
- Python
- MySQL
- Aptitude
- JavaScript
- Java
- React
- Allow users to select a course and then choose difficulty level: **Easy, Medium, Hard**.
4. **Problem Solving & Streaks**
- After solving problems, show streaks:
- If the user solves at least 1 problem per day โ show ๐ฅ fire emoji.
- If they miss โ show โค๏ธ love emoji.
- This streak system should update daily after execution of problems.
5. **Design Requirements**
- Use modern, colorful CSS effects with animations.
- Make the login page and course selection page visually attractive with 3D interface elements.
- Ensure responsive design for desktop and mobile.
Generate the **HTML, CSS, and JavaScript code** for all these pages (index, login, courses, streaks).
Make sure the code is clean, beginner-friendly, and well-commented so I can understand and learn from it.
No comments yet. Be the first!