
No setup. No fluff. Just real coding. In this beginner-friendly course, you’ll learn HTML and CSS by building a personal portfolio website from scratch — all in under one hour. Follow along in your browser using our online editor and save your work as you go. It’s the fastest way to start your journey into web development and walk away with something you can proudly show off.
Skill level
Beginner
Time to complete
1 hour
Projects
1
Prerequisites
None
This hands-on course is perfect for beginners who want to learn HTML and CSS by actually building something real. You’ll start from scratch and finish with your very own portfolio website, hosted right in your browser using the Hackr online editor. Along the way, you’ll pick up core web development skills, learn best practices, and gain the confidence to continue your coding journey.
Set up your coding environment using our in-browser editor. No installation required! Learn how to save your work, ask Mentor for help, and get started with ease.
Learn the essential structure of an HTML page and begin building your first page with headers, paragraphs, and basic formatting.
Enhance your HTML pages with navigation links, organized lists, and beautiful images.
Start styling your HTML pages with CSS. Learn the different ways to apply styles and how to write clean, reusable rules.
Understand how elements behave on the page using the CSS box model. Group and organize your content like a pro.
Polish your page with better fonts, spacing, and visual appeal. Learn how to use Google Fonts and subtle styling tricks.
Review the checklist of everything you’ve learned so far. Make sure you’re ready for the capstone project.
Put it all together to build your first real website — a personal portfolio page you can customize and share.
Practice Project
Use everything you’ve learned to build a beautiful personal portfolio website — your first real project as a web developer!
Lead Instructor
Dr. Robert Johns is a web developer, educator, and course creator with a passion for helping beginners break into tech. He specializes in HTML, CSS, JavaScript, and Python — and has taught thousands of students how to build and ship real-world projects. With a strong focus on simplicity and hands-on learning, his mission is to make modern web development accessible to everyone, regardless of experience level.
Nope! Everything runs in the browser using our online HTML editor. No setup required.
Just 1 hour. You’ll go from zero to having a finished project in less time than a lunch break.
Yes — a full personal portfolio page that you can customize and share.
Yes! Use our built-in AI assistant Mentor for coding help, explanations, and debugging support.
Absolutely. No experience required — we start from scratch and guide you every step of the way.
Yes! Complete the course and receive a certificate of completion you can add to your resume or LinkedIn.