Portfolio Website

Beginner Web Low

A personal portfolio site with sections for bio, projects, and contact. A great first project that teaches HTML layout, CSS styling, and a bit of JavaScript for interactivity.

Download Starter Code

Hero section with name and tagline
Projects grid with cards
Skills list with visual indicators
Contact form with basic validation

Follow these steps in order. Each one builds on the previous.

0% completed

Step 1
Plan the page sections on paper first
Step 2
Write the HTML structure for all sections
Step 3
Add CSS reset and base typography styles
Step 4
Style the navigation and hero section
Step 5
Build the projects grid using CSS Grid
Step 6
Add the contact form with labels and inputs
Step 7
Write JavaScript for form validation
Step 8
Make the site responsive with media queries

HTML reference
CSS Grid guide
Responsive design basics

Starter Code

Loading starter code...

Portfolio Website

Features

Project Roadmap

🎉 Project Completed!

Helpful Resources

Starter Code