kart_codes

byKarthik Reddy

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.

IndexCoursesLoginProblemsStreaks
Index

Comments (0)

No comments yet. Be the first!

Problems design preview
Index: View Brand
Index: Click Enter
Login: Choose Auth Method
Login: Verify OTP
Login: Sign In Google
Login: Sign In GitHub
Login: Receive Welcome Email
Courses: Browse Courses
Courses: Select Course
Courses: Choose Difficulty
Problems: Solve Problem
Streaks: View Streak