Welcome Back, Future Web Designer! 🚀

Ready to master professional web design? Your journey to creating stunning, interactive websites starts here. Track your progress, complete assignments, and build an impressive portfolio that showcases your skills to colleges and employers.

Course Progress

60%

3 of 5 modules completed

Keep up the great work!

1,250
Total Points
8
Assignments Done
87%
Quiz Average
12
Day Streak

Learning Modules

🏗️
HTML & CSS Fundamentals

Master the building blocks of web development. Learn semantic HTML5, modern CSS3, and responsive design principles.

✓ Completed

⚡
JavaScript Interactivity

Bring your websites to life with dynamic JavaScript. Learn DOM manipulation, event handling, and modern ES6+ features.

📚 In Progress

🚀
Modern Frameworks

Explore React, Bootstrap, and Tailwind CSS. Build scalable applications with component-based architecture.

📚 In Progress

🎨
UX/UI Design

Design user-centered experiences. Learn wireframing, prototyping, color theory, and design thinking principles.

⏳ Starting Soon

💼
Portfolio Development

Create a stunning digital portfolio. Learn personal branding, content strategy, and professional presentation.

🔒 Locked

📱
Mobile Development

Build mobile-first applications. Learn PWA development, responsive design, and cross-platform tools.

🔒 Locked

JavaScript Fundamentals Quiz

Test your knowledge of JavaScript basics

1 of 5

What does DOM stand for in web development?
Document Object Module
Document Object Model
Dynamic Object Model
Data Object Management

Assignments

🎨 Personal Website Design

Due: Oct 15

Create a responsive personal website using HTML5, CSS3, and JavaScript. Include an about section, portfolio gallery, and contact form.

Requirements:
  • Mobile-responsive design
  • Modern CSS animations
  • Interactive JavaScript features
  • Accessibility compliance

⚡ Interactive Web App

Due: Oct 22

Build a functional web application using modern JavaScript frameworks. Choose from: Task Manager, Weather App, or Quiz Platform.

Tech Stack Options:
  • Vanilla JavaScript + Local Storage
  • React.js with Hooks
  • Bootstrap or Tailwind CSS

🚀 Portfolio Presentation

Due: Nov 1

Compile your best work into a professional digital portfolio. Prepare a 5-minute presentation showcasing your growth and technical skills.

Learning Games

🎯 CSS Selector Challenge

Match CSS selectors with their descriptions

.class
Selects by class
#id
Selects by ID
div
Selects element
:hover
Pseudo-class

Score: 0 | Matches: 0/4

🐛 Debug the Code

Find and fix the JavaScript errors

function calculateArea(length width) { if (length > 0 && width > 0) { return length * width; } else { console.log("Invalid dimensions"); return null } } let area = calculateArea(5, 10); console.log("Area: " + area);

🏗️ HTML Structure Builder

Arrange HTML elements in the correct order

Drag elements here to build a webpage structure

<html>
<head>
<title>
<body>
<header>
<main>
<footer>

⚡ Speed Coding Challenge

Complete the CSS code as fast as possible!

Challenge: Create a flexbox layout with centered content

Time: 0s | WPM: 0

Your Portfolio Builder

🎨 Portfolio Customization

Design your personal brand and create a stunning portfolio that showcases your web development skills.

Choose Your Theme:

Modern

Creative

Minimal

Portfolio Sections:

Portfolio Completion

75%
✅ Personal Info 100%
✅ Skills Section 100%
🔄 Project Gallery 60%
⏳ Resume Upload 0%

Quick Actions

🏆 Your Projects

🌐 Personal Website

Personal Portfolio Site

Responsive website built with HTML5, CSS3, and JavaScript

Complete
☁️ Weather App

Weather Dashboard

Interactive weather app using APIs and modern JavaScript

In Progress
➕

Add New Project