Web Development

Immersive 8-week digital bootcamp to become a web developer.

Let's do this

Become a web developer and work from anywhere

We're going to teach you the most in-demand skills that you need to learn how to code custom websites and launch your own web development agency.

With no previous experience we'll teach you not only technical skills like HTML, CSS & Javascript but also the business skills to find clients and run a thriving business.

An immersive digital bootcamp

Our hands-on program is perfect for absolute beginners and will take you from little-to-no previous experience to a ready-to-hire web developer. Through our comprehensive curriculum, we cover everything you need to be building custom websites, portfolios and blogs for clients and launching your own web development business.

By the end of the bootcamp, you won't just have new skills but also a portfolio of custom web projects, a comprehensive strategy for launching your business, and all the templates you need (from client pitches to contracts to invoices) to hit the ground running.

enrollment open now 

Next session: 24 Sep - 18 Nov 2022

Secure a $150 early bird discount by booking a call with a course advisor or enrolling now. 

BOOK A CALL Dates & Details

So much more than an online course


165+ video lessons

In-depth, easy to understand lessons that go beyond theoretical knowledge and walk you ste-by-step through projects and examples.

Practical activities

Almost every lesson comes with detailed activities to apply what you've learn, so you can grow your skills, build a portfolio of work and have a business ready to launch.

Mentor feedback

Submit your work for weekly activities to our mentors for direct one-on-one feedback on your work by mentors with years of industry experience.

Editable Templates

From website templates to fast-track your future client projects, to proposal templates and client onboarding guides.

Weekly live Q&A

Each week our lead instructors will host a live Q&A digging deeper into topics we covered that week and answering all of your questions.

Community

Part of what makes IOC special is the community of like-minded individuals it attracts, a community that's ready to support you every step of the way.

a sneak peek

Have a look through a handful of lessons from the course for peek at just a fraction of the 165+ lessons included in the bootcamp.

Units of measurement

21 minutes

Strategic website planning

20 minutes

Intro to Adobe XD

23 minutes

Designing a simple website in Adobe XD

31 minutes

Hello HTML

20 minutes

Styling typography

39 minutes

Building an image gallery

24 minutes

Advanced layouts with Gridlex

41 minutes

Responsive grid layouts

9 minutes

CSS gradients & patterns

14 minutes

Sleep Co Modular Design

35 minutes

Activity: Dark Mode

15 minutes

What is Jekyll? A high level overview

26 minutes

Adding an online store with Shopify buy button

10 minutes

Technical SEO

9 minutes

Optimizing website speed

34 minutes

Hosting our website on CloudCannon

14 minutes

We've helped hundreds of students quit their 9-5s and build a business they love

"I'll be straight-forward: attending IOC's Web Development Bootcamp last December was one of the best investments I've ever made in my career. It's only been 2 and a half months since I attended IOC's bootcamp, and I've already launched my freelancing business and am working with 3 clients. And this is just the start." - Angels, Spain

"The knowledge Tina and her team bring to the table are second to none. With their support and the amazing community you build during and after the bootcamp, I started with very little knowledge of HTML and CSS and by the end of the program completely learned how to build modern websites." - Lynn, UK

"This program is unlike any other out there. It's in-depth and practical, and you walk away confidently knowing how to build websites but also how to strart a creative agency offering web development. The value the team provides is honestly incredible" - James, Australia

What you'll learn


This is a zero-to-hero program, so we'll walk you through step-by-step so that you understand what a website is, how it works, and all of the most important terminology -- by the end you'll be able to talk-the-talk with developers and understand how it all fits together. We’ll cover all the essential skills and concepts of web development, including industry standard tools like visual studio code and professional workflows like using GitHub for version control.

  • Welcome to the Web Development Bootcamp // 11 mins
  • What is a website? // 20 mins
  • Web terminology explained // 28 mins
  • Intro to Coding // 26 mins
  • Helpful resources list // 22 mins
  • Getting organised to start coding // 27 mins
  • Element hierarchy & inheritance // 26 mins
  • Understanding specificity // 24 mins
  • Inspect Element // 29 mins
  • Units of measurement // 21 mins
  • Intro to the box model // 18 mins
  • Intro to Github // 19 mins
  • Optimizing your assets // 11 mins
  • Review: Web Development Foundations // 36 mins

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. We teach you how to think strategically when mapping our the structure and content of a website, and how to understand UX fundamentals to build websites that are designed to convert from the start.

  • Creating calls-to-action // 30 mins
  • How to optimise a website for conversion // 46 mins
  • Strategic website planning // 20 mins
  • What is UX & UI? // 16 mins
  • UX/UI do's & dont's // 41 mins

Whether you want to design sites your self, or partner with a web designer on your projects we cover all the essential skills to help you design beautiful, eye-catching websites.

  • Intro to modular design // 6 mins
  • Essential web design principles // 42 mins
  • Typography design // 11 mins
  • Intro to Adobe XD // 23 mins
  • Designing a simple website in Adobe XD // 31 mins
  • Responsive design concepts // 28 mins
  • Animation & micro interactions // 40 mins
  • 2022 design trends // 22 mins
  • Symbol & repeat grids in Adobe XD // 37 mins
  • Working with colors & contrast // 21 mins
  • Step-by-step web design flow // 27 mins
  • Designing an entire website from start to finish // 84 mins
  • Advanced Adobe XD // 52 mins

HTML is the primary language used in every single website. We'll teach you how to write custom HTML code, creating structural elements like sections, headers and footers as well as all the elements within them like headings, paragraphs, links, images, and contact forms. We'll learn how to use CSS code to style layouts, typography, images, and more, making our websites look as visually stunning as our designs. We'll learn how to diagnose and solve CSS specificity issues when we have conflicting styles and how to troubleshoot CSS problems effectively.

  • Troubleshooting CSS // 47 mins
  • Hello HTML // 20 mins
  • Hello CSS // 16 mins
  • Styling typography // 39 mins
  • Adding custom fonts with Google Fonts // 19 mins
  • Creating links & styling buttons // 47 mins
  • Structural HTML // 22 mins
  • Say hello to classes // 13 mins
  • Images & Background Images // 33 mins
  • Efficient classes & CSS organisation // 38 mins
  • Setting up your HTML & CSS in Visual Studio Code // 13 mins
  • Adding a simple contact form // 33 mins
  • Audio, Video & GIFs // 24 mins
  • Working with negative space // 30 mins
  • CSS transitions // 47 mins
  • Advanced text elements // 26 mins
  • Blogging elements (lists, blockquotes, tags, etc.) // 18 mins
  • Review: HTML & CSS // 52 mins

An important part of our teaching philosophy is that our students graduate with all the skills they need to confidently start a new career - and that comes not just from learning techniques but getting practice with real-world examples.

  • Building an image gallery // 24 mins
  • Building headers & footers // 52 mins
  • Building card layouts // 75 mins
  • Adding a newsletter signup form // 20 mins
  • Pop-up gallery with Jekyll & jQuery // 23 mins
  • Building an advanced contact form // 42 mins
  • Building a simple blog with Jekyll // 38 mins
  • Building advanced banners (with video & overlays) // 49 mins
  • Building simple hero banners // 31 mins
  • Easy image aspect ratios // 18 mins

There are lots of different techniques for creating layouts on a website, and we’re going to cover all the most important ones. We'll learn the various display properties, CSS box model, flexbox , CSS grid and positioning so that we can create custom layouts and grids on our site and position our content exactly the way we want. And beyond the foundations, we’ll go set-by-step through creating common layouts and design patterns so that whatever design you want to create you know exactly where to start.

  • Website layout fundamentals // 22 mins
  • Creating layouts with Gridlex // 11 mins
  • Advanced layouts with Gridlex // 41 mins
  • Flexbox // 15 mins
  • Advanced CSS positioning // 30 mins
  • Centering & aligning grids // 16 mins
  • Efficient negative space // 23 mins
  • Basics of positioning // 23 mins
  • Working with floats // 45 mins
  • Sticky positioning // 23 mins
  • CSS Grids // 47 mins
  • Review: Layout & positioning // 52 mins

We all know how important mobile is, so we'll spend today learning responsive design and how to use media queries to make your site look good on every size device. This means your websites will be mobile-friendly right from the start. We look at common responsive development techniques and step-by-step workflows used by professionals.

  • Intro to media queries // 21 mins
  • Responsive grid layouts // 9 mins
  • Responsive utility classes // 21 mins
  • Responsive typography // 8 mins
  • Horizontal scrolling grids // 37 mins
  • Review: Responsive development process // 38 mins

Diving into more advanced elements & styling techniques that equip you to build modern websites that stand out from the crowd, as well as time-saving tools like advanced CSS selectors, CSS variables and the CSS framework Tailwind.

  • Adding extra pages // 11 mins
  • CSS gradients & patterns // 14 mins
  • Borders, box shadows & unique images // 16 mins
  • CSS variables // 8 mins
  • Dropdown menu // 17 mins
  • Advanced CSS overlays // 18 mins
  • Advanced CSS selectors // 38 mins
  • Using a CSS framework like Tailwind // 34 mins

The best way to learn? Having a chance to follow along the process step-by-step, try it for yourself and then get feedback and support as you go along. That’s what students achieve with our website projects where Tina builds production-ready website projects from start to finish and detailing every single step. You’ll have a chance to build each and every one of these projects for yourself, and customise it to suit your portfolio.

  • Project: Simple website (light & dark) // 71 mins
  • Project #1 - The Bunker Hotel // 120 mins
  • Project #2 - Zen Studio // 30 mins
  • Project #3 - Negroni // 25 mins
  • Project #4 - The Design Collective Portfolio Site // 26 mins
  • Sleep Co Modular Design // 35 mins
  • Project - Sleep Co (part 1 - HTML) // 32 mins
  • Project - Sleep Co (part 2 - CSS) // 61 mins
  • Project - Sleep Co (part 3 - Jekyll-ify) // 63 mins
  • Project - Sleep Co (part 4 - advanced features) // 38 mins
  • Say hello to IOC's custom blog template // 41 mins
  • Step-by-step building a portfolio website with Jekyll // 81 mins
  • Project: Building a directory site // 62 mins
  • Project: Building a travel blog // 55 mins

We'll learn how to use jQuery (a form of javascript) to add interactivity to your site as well as how to integrate jQuery plugins. Now we can add advanced functionality (like the smooth scrolling in this website), create a dynamic hamburger menu, and learn how to create an accordion (like this one), slideshow or lightbox gallery.

  • jQuery basics & effects // 32 mins
  • jQuery: Style methods // 31 mins
  • jQuery: Traversing the DOM // 43 mins
  • Animations & transitions // 19 mins
  • How to make a click-to-reveal quiz on your blog // 7 mins
  • Filterable gallery // 26 mins
  • Activity: Dark Mode // 15 mins
  • Building your own hamburger nav // 29 mins
  • Random generator // 19 mins
  • Building a carousel with slick slider // 64 mins

With the static site generator Jekyll you'll be able to build a blazing fast and very stable blog or portfolio website. We show you how to create advanced custom layouts for any website you project you might tackle in the future, as well as features like blogs. Jekyll uses liquid templating, which is the same language shopify is built on so your skills are transferable.

  • Installing Jekyll with Dev containers // 11 mins
  • Jekyll basics (layout & variables) // 16 mins
  • What is Jekyll? A high level overview // 26 mins
  • Jekyll Loops // 24 mins
  • Airbnb website explained with Jekyll // 20 mins
  • Automatic category archive pages // 43 mins
  • Content organisation for Jekyll sites // 24 mins
  • Conditional logic with If statements // 17 mins
  • Liquid Filters & Functions // 18 mins
  • Jekyll blog basics // 47 mins
  • Jekyll custom styles // 10 mins
  • Basic category archive pages (manual) // 29 mins
  • Jekyll includes & layout organisation // 12 mins
  • Jekyll responsive image gallery // 29 mins
  • Jekyll data files // 9 mins
  • Jekyll Collections // 32 mins

These are advanced features and techniques that can add functionality to your website, and add-value to your client projects. From beautiful interactive search, to adding e-commerce functionality, email newsletters and more.

  • How to add live chat to your website // 11 mins
  • Building your own Instagram links page // 11 mins
  • Adding membership functionality to your site // 53 mins
  • Adding comments to your blog // 32 mins
  • Adding search to your website // 39 mins
  • Adding an online store with Shopify buy button // 10 mins
  • CSS organisation with SCSS // 41 mins

We will teach you both the technical and strategic techniques to optimise your websites to rank highly in Google search results so that you can drive more traffic to your website. Then we’ll cover the foundations of website analytics and how to optimise your site for social sharing and customise the images and text that appear when someone shares your site. Beyond that, we’ll show you how to make all of this easily editable for your clients so that they have full control of the SEO themselves.

  • How to add rich pins for Pinterest // 20 mins
  • SEO foundations & strategy // 25 mins
  • Technical SEO // 9 mins
  • Setting up & understanding the basics of Google Analytics // 21 mins
  • Adding a favicon // 13 mins
  • Social sharing & FB debugger // 19 mins

How do you get your website to load quickly? Optimize images? Make sure it looks good across all browsers? We'll teach you the best practices and troubleshooting techniques to make sure your website is production-ready.

  • Lazy loading images // 18 mins
  • Privacy policy + GDPR + Cookie plugin // 14 mins
  • Optimizing website speed // 34 mins
  • Browser Testing & Compatibility // 9 mins
  • Adding Plausible Analytics to your site // 14 mins
  • Adding Google Analytics to your site // 34 mins

Think of hosting like the digital real estate, and domain name as your street address. We'll show you how to connect a custom domain to a website, and hook it up to fast, reliable (and free) hosting. We'll show you how to integrate your site with a content management system so that non-technical users can easily edit the content of your website. We show you our recommended CMS system, CloudCannon as well as how to apply your skills to customise websites built on other platforms.

  • Hosting our website on CloudCannon // 14 mins
  • CloudCannon editing for Jekyll sites // 28 mins
  • External hosting with Netlify + CMS with CloudCannon // 12 mins
  • Building modular websites with CloudCannon Blocks // 37 mins
  • Advanced client editing with CloudCannon // 28 mins
  • Understanding DNS settings and adding a custom domain // 22 mins

We know that launching a new career takes more than just technical skills, so we cover everything from how to find clients, how to scope and price projects, how to manage client communication and more. We also share real pitch templates and contracts for you to hit the ground running.

  • How to find clients // 42 mins
  • How to price & package web development services // 31 mins
  • Pitching, proposals & contracts // 55 mins
  • How to offer web development intensives // 30 mins
  • How to earn ongoing revenue with maintenance packages // 26 mins
  • Client onboarding // 42 mins
  • Invoicing & getting paid // 28 mins
  • 12 months strategy for launching your web development business // 45 mins

At the end of the bootcamp you’ll have a chance to build a completely custom site from planning & strategy, to wire framing, design, build, and publishing it live. This could be a portfolio site for yourself, a mock client site, a blog for a family member, or even a real client project. This is going to incorporate everything you have learned in the bootcamp and give you the confidence to go out and start your web development career.

  • Major Project: Planning & Strategy // 35 mins
  • Major Project: Wireframing your custom design // 21 mins
  • Major Project: Building your site // 28 mins
  • Major Project: Making our project responsive // 42 mins
  • Major Project: Pushing the site live // 12 mins

dates & details

8 Week Digital Bootcamp: 24 Sep - 18 Nov 2022

what's included

tuition fees

Program Fee: $1950 USD

Early bird: $1950 $1800 USD

You can choose to pay upfront, or secure your spot with a $250 deposit.

An interest-free payment plan can be provided on request, book a call with a course advisor for more details. Enroll before the 1st September, and your tuition for the digital bootcamp can be applied as a credit towards the Bali bootcamp in 2022 or 2023.

Enroll now and save $150.

Enrollments are capped at 50 students only, and you can secure your spot with a $250 deposit.

BOOK A CALL ENROLL NOW

We're the Institute of Code

When we first dreamed up Institute of Code we tried to forget everything we knew about what a school was and re-imagine what a school could be.

We prioitise the success of every single student, and use everything we know about educational psychology and human performance to build a program that doesn't just teach people skills but empowers them to launch a new career

We help people like you learn in demand digital skills and launch a new career in Photography, Social Media or Web Development where they can work from anywhere in the world.

And because we are passionate about seeing them succeed we provide lifetime technical and career support on the skills they have learnt.