Responsive Design for Beginners

Learn how to build a responsive website from scratch.

Learning to code is a lot harder than it looks.

You may have gone through a bunch of tutorials, but when you sit down to build a website, you end up staring at your blank code editor, not sure where to start.

How do you turn the bits of knowledge you’ve learned about HTML, CSS and JavaScript, into an actual real world website?

Let me tell you something– I’ve been there!

coder coder

Hi! 👋 I’m Jessica Chan. I write web development tips on this blog, as well as on Instagram and Twitter. And I do live coding sessions on YouTube!

So, I fell into web development almost by accident, over 7 years ago. I knew just the bare bones of HTML and CSS, but somehow landed an entry level web dev job.

Starting out was extremely difficult. I struggled every day with having to build something, but not knowing which CSS property I needed. Or making the website look good on Chrome and IE11, and on iPhone and Android.

I felt impostor syndrome constantly.

However, over time, I worked my way up from a junior level to a senior level web developer, and I built many, many websites for all kinds of businesses. And along the way, I discovered something…

I figured out a blueprint to build any website.

This is the same approach that I use today at my job, and I want to share it with you.

I’ll show you how to get from a design file to building a real responsive website from scratch in HTML, CSS, and JavaScript. No frameworks needed!

Here’s a taste of what we’ll cover:

  • Organizing your files, folders and workflow
  • Navigating Adobe XD to understand the styles in the design
  • Writing the markup in semantic HTML
  • Writing clean, responsive styles using Sass
  • Building out functionality using vanilla JavaScript
  • Deploying the website on the internet using Netlify

Many courses skip steps and don’t explain the why.

This one won’t. As you build the course website, you’ll get detailed, step-by-step instructions. And I’ll give context and explanations for why we’re doing things a certain way.

After finishing the course, you’ll understand how to use Sass to write CSS more quickly, and how to make your styles responsive so the site looks good on desktop and mobile devices.

You’ll end up with valuable skills that you can use to build any front-end website.

Learn how to build front-end websites faster.

You can spend time trying to figure out web development on your own, with random tutorials. Or you can save time and frustration, and learn an efficient system to build front-end websites step-by-step.

Sign up to get course updates and be the first to know when it’s released!

(Note: this is separate from my regular emails that I send about new blog posts.)