step-by-step roadmap to a thriving web dev business.

With over a decade of experience running a creative agency (and almost as long teaching people all over the world how to do the same) this is how we would approach becoming a web developer if we were to start over.

<h1> This is a heading written in HTML code </h1>

<p> We can create a paragraph just like this </p>

What about a link?

<a href="https://google.com"> I'm a link </a>

Easier than you thought huh?

learn how to create elements with html

The first step to becoming a web developer is learning the technical skills, starting with the foundations of building a website with HTML. We use HTML to define the structure of a website, including the pages, the sections and containers, the text elements like headings, paragraphs and links and even rich media content like images and videos.

try a free HTML lesson

learn how to style elements with css

The next step in your journey is to learn CSS, the language that controls styling elements on the web. It takes the elements that we've created with CSS and tells the browser how to style them and how to position them on the page - here we're telling the browser that we want to select all our paragraphs and set the color to teal, the font-size to 18px and font-weight to bold, and we're going to make them all uppercase. Not as hard as you thought right?

try a free CSS lesson

get familiar with essential tools

While you can start coding from just a browser (hello codepen) if you want to become a web developer you're going to need to get familiar with a few essential tools - first you'll need a code editor (our favourite is Visual Studio Code) which you'll want to customise to suit your preferences - there are so many handy plugins and tweaks that can speed up your workflow and make coding more fun.

Read the blog post on our favourite code editors

learn how to create flexible layouts

The modern web is a dynamic, shape-shifter, and our layouts need to adapt to every every different screen size and style of content. Next step in your web dev journey is to master css layouts, including flexbox & css grid. What's important here isn't just learning what each property does, but being able to implement any complex design that your clients dream up (quickly & efficiently!)

Watch Intro to CSS layouts

learn responsive design & development

There is more to building beautiful intuitive mobile experiences than just adapting the layouts - next step is to learn common design patterns and tricks to make sure anyone navigating your websites on their phone can easily get to everything they need. This includes both technical skills like learning how to adapt the size of typography & negative space with media queries, how to hide and show elements on specific devices and how to approach responsive development strategically.

Watch my most-used responsive design techniques

master version control with github

You'll thank us for this one when you accidentally delete a project you've been working on -- but can bring it back with a few clicks with Github. This essential version control tool is like Dropbox for code - it keeps your projects organised and keeps backups in check, and it's also the industry standard for collaboration with other teams and developers. Put this one on your to-do list as an essential skill for a web developer.

Read why every web developer should be using github

learn website design

Whether you want to design sites yourself, or partner with a web designer on your projects you're still going to want to learn some essential design principles - things like how to choose typography styles that fit well together, how to use design tool like Figma, working with color palettes & balancing designs with hierarchy and negative space. Once you've got the basics down pat you'll transform your websites from 'just ok' to stunningly beautiful.

Read 5 essential design skills for developers

practice building common web components

Now that you understood the languages used to build websites (html & css) and have an eye for design, it's time to practice building common web components so that you can confidently tackle any project. The more you can streamline your workflow for coding these essentials, the faster you'll be able to finish your projects (and when time is money, that's a win!). Start with the basics like headers, footers, hero banners and simple informational grids, and then move onto card layouts, image galleries, and FAQ-style accordians.

20 web components every dev should be able to build

learn website strategy & the foundations of UX

As a freelance web developer, your clients often come to you looking not just for someone to code their website but for help with the entire process. You want to be able to think strategically when mapping out the structure and content of a website, and  understand UX (user experience) fundamentals to build websites that are designed to convert from the start.

Watch the video what is UX & UI?

speed up your workflow with a templating language

While you can build entire websites out of just HTML & CSS, it's not the most efficient way of doing things - you can save time and make your websites easier to maintain. What a templating language does is lets you break your website up into re-usable puzzle pieces (like layouts with a consistent header and footer) and loop through content dynamically like blog posts and portfolios. While there are lots of options to choose from, we recommend learning a modern templating language like liquid (used by both Shopify & Jekyll) over a more traditional option like PHP.

Why we love static site generators

build a few practical example projects

In the world of web development, clients rarely ask to see a certificate or degree - they want to see live website projects that you've built yourself. So the next step in your web dev journey is to build at least 3+ complete websites (you can use placeholder content), and host them live. They should show off your skills and have that wow-factor that makes pitching to future clients a breeze.

See some of the portfolio websites students in our web dev bootcamp have built

add interactivity with javascript

While we would put Javascript on the 'nice to have' (you can certainly build beautiful responsive websites without any javascript) learning at least the foundations of Javascript will help you add interactivity to your projects - think playful animations, a filterable portfolio, simple search, carousel slider and pop-up lightbox gallery to name a few. Having this skill in your toolkit empowers you to take on more advanced website projects that you can charge more for.

12 practical uses of javascript for web developers

learn performance optimisation & analytics

While building websites is a lot of fun, it won't be very helpful to your or your clients while it's sitting on your computer - you need to host it live & connect a custom domain name.  Beyond the basics of hosting, DNS & domain names you'll also want to learn how to setup SSL certificates, optimise website speed & performance and add all the relevant analytics tracking codes (like google analytics, and the meta pixel). You'll want to get familiar with this process in advance so you aren't scrambling when you've got a real client project ready to go live.

Checkout our website launch checklist

learn how to make your sites easy to edit & update

You've designed & coded a beautiful responsive website, and hosted it live - but now you need to make it easy for you client to edit the content. That's where a content management system comes in. There are lots to choose from, but we recommend CloudCannon - it's great for developers & great for clients and while it's really easy to learn the basics it also comes with some advanced features that let you give endless flexibility to your clients (including built-in SEO functionality!). CloudCannon let's any non-technical user easily edit and update the website -- you might not have any clients just yet, but you want to get familiar with the process in advance so you're ready to hit the ground running when you do!

Why we choose CloudCannon over Wordpress

get clear on your goals & vision

There are so many ways to launch a thriving web development business, and no one-size-fits-all approach. So before you dive into the business and marketing foundations, have a think about what you want out of it - whether you want to build a thriving web dev agency or a profitable side hustle. Getting clear on your vision will help you build a business that fits your goals, your lifestyle and your values.

Watch our goal setting workshop

choose your niche

Focusing on a niche, means picking one or two specific areas that you'll focus your business on and doing them really well. Having a niche helps you streamline your operations, become an expert in your field faster, tailor your portfolio to your ideal client and build a name for yourself. There are so many different ways to define your niche in web development, including around your values, location, style or industry -- and once you have you'll find it so much easier to attract your dream clients.

How to choose a niche for your web dev business

create a strong brand for yourself

As you're almost ready to launch, it's time to get clear on your brand - getting inside the hearts and mind of your ideal target customer and putting together a cohesive brand that resonates with them. A strong brand helps you stand out from the crowd, feel more professional and have more confidence in your wokr as you start pitching to clients. You don't need to be graphic designer or spend any money on branding, you just need to follow some essential branding & design principles and come up with a strong cohesive brand (including a logo, brand fonts & colors, tone of voice etc.)

5 steps to building a personal brand as a freelancer

build your portfolio & social profiles

Time to show off everything you've done so far to the world, build yourself a portfolio websites (that helps potential clients understand exactly why they should choose you) to show off the portfolio projects you've built. With your portfolio website live you can turn your attention to your social media profiles, selecting the platforms that make the most sense for your business (instagram, facebook and linkedin are popular choices depending on your niche) and make an impactful first impression.

A sneak peak of the porfolio website our web dev students build

get your business ready to take on clients

Register your business, get your various documents ready (like your proposal, contract, and invoice templates), create an onboarding workflow for your client projects, plan how you'll keep your projects organised and on-time -- this might not be the glamourous side of starting a business, but it will make a huge difference to ensuring your first client projects are as streamlined as possible.

4 client documents every web developer needs

start attracting clients and getting paid to build websites

You're officially ready to launch your business and start attracting your dream clients. You can start small with projects that fit your skills and experience, and then keep growing from there. Your first project might only be worth $1k - $2k, but it's a stepping stone to your future business and will help you further build your portfolio and practice your skills.

How to make your first $1k as a web developer

find a commmunity & support network

While being your own boss is incredible empowering, it can also be lonely if you're trying to go it alone - ony of the most important things you can do to guarantee your future success is to surround yourself with both mentors who have built the kind of business you want to build, and peers who are on the same journey as you. Most people don't naturally have an entreprenerial friendship group, it's up to you to go find that community - trust us, you'll be glad that you did!

Why you need entrepreneurial friends

scale your profits & streamline your buiness

There are so many different ways to run a profitable web development business, you can focus on landing bigger clients with higher budgets, or go for volume with streamlined offerings like design intensives. You can partner with others in the industry to create a steady flow of cients, or build a creative agency that's bigger than just go. There is endless opportunity, and no right or wrong answer so once you've considered all the possibilities choose the option that's best for you.

Choosing the best business model for your web dev business

you can take the DIY route, or let us guide you every step of the way.

If you want to take the DIY route to becoming a web developer then use this roadmap as your guide, download our checklist here and get started - don't let anything stop you in your pursuit of building an epic new career path for yourself.

Or if you want to fast-track your success, our web development bootcamp covers everything in the roadmap above and so much more -- in a supportive community of peers where you have access to on-demand mentor support whenever you need it. It's not the only way to learn to become a web developer, you can go it alone, but if you want to get to your goals faster, then let us teach you everything we know. We built this course to help save people like you from the mistakes we made, and it contains everything we wish that we had when we were first starting out - cutting out all the fluff and teaching you not only how to build modern responsive websites from scratch but also how to build a thriving web dev business.

Download the checklist Join the web dev bootcamp

ask me anything

With over a decade of experience in the web development industry, our founder & lead instructor Tina May answers all your questions about how to become a web developer.

Do you need a degree to become a web developer?

Why a four-year computer science degree isn't the best path.

7 mins

Do you need to be good at maths

This answer might surprise you, and it's one we get asked a lot!

2 mins

What skills do you need to become a web developer?

It's not just the technical coding skills that are important.

5 mins

DIY learning vs a bootcamp

You don't need a bootcamp, but just might want one.

12 mins

Do you need to be good at graphic design?

Design is a handy skill to have, but it's not a requirement.

4 mins

Is coding dying?

A myth we love to debunk, why coding wins vs drag-and-drop.

5 mins

How do you stay up to date in the industry

My top tips and resources for staying up to date.

4 mins

What does a career in web dev actually like?

An honest look into life as a freelance web developer.

19 mins

How do you find clients & price projects

All the juicy details you have been dying to know.

26 mins