By Steven Blucher, Secondary School Teacher

Learn Front-End Web Development From Scratch

Language: English
All Levels

Course description

Thank you for taking the time to explore Learn Front-End Web Development From Scratch. I think you will find this course an amazing platfrom from which to launch your web development career!

Designed with the beginner in mind, but also completely relevant for those who have  prior knowledge, this course aims to build your confidence in the main technologies you will need to master in order to build awesome web pages and sites. By the time you complete this course, you will be prepared to build pages youself and even teach the basics to your frineds, family and colleagues.

As possibly the most important computer platform available, you will learn the fundamentals of building websites in HyperText Markup Language (HTML). HTML is the building blocks of the internet - it is the way that web pages are structured and adds in a lot of information that is very important for the browser and other languages that you will need to learn in the future. Next, you will explore Cascading Style Sheets, or CSS, where you will build rules that make your pages look beautiful. Finally, you will learn how you can quickly build and style your pages using a front-end framework called Bootstrap. Bootstrap is a set of guidelines that cuts the production time of creating gorgeous website significantly.

So, why should you take this course? While this course is available for any number of reasons, you might find that you fall into one or more of the categories:

  • Perhaps you would like to improve your thinking skills.
  • Maybe you're ready for a change of career.
  • You could be looking for a promotion within your current employment.
  • You're simply interested in learning something new.

Regardless of your reason for looking at web development, I have aimed to make the lessons as easy to follow as possible. Each lesson video focuses on one element of HTML, CSS or Bootstrap so that you can maximise your chance of understanding each concept the first time.

I've found, over years of teaching, that the best option for learning, especially when learning to code, is to follow the 'watch then do' approach. This is a fairly common method used by digital technology teachers. As a student, watch what you're being taught first. Fight the desire to get straight into coding. I know, the desire to pause the video at each stage to copy what is happening will be strong, but resist! Instead, first watch the lesson through in its entirely. Then, and only then, open your text editor and while rewatching the video, pause and follow along with the lesson.

Using this method will allow you to really gain a strong understanding of the concept being taught and will allow you to really get good value for money.

Thank you for considering giving me the opportunity to show you how to create websites. If you opt to follow this course, I am certain that you will learn a great deal and that you will have fun along the way.

I look forward to partnering with you in your learning journey.

Related Skills

Course overview - 105

  • Introduction

  • Why

  • What Will You Get?

  • What Will You Need?

  • Let's Go..!

  • Learn Front-End Web Development from Scratch - Course Files

  • HTML - What is HTML?

  • HTML - Your First HTML

  • HTML - Basic Document Structure

  • HTML - Your First HTML 2.0

  • HTML - Headings

  • HTML - Carriage Returns

  • HTML - Formatting Text

  • HTML - Lists

  • HTML - Links

  • HTML - Images

  • Quiz 1: Links, Lists and Images

  • HTML - Tables

  • HTML - Form Input

  • HTML - More Form Inputs

  • Quiz 2: Tables and Forms

  • HTML - Entities

  • HTML - Emojis

  • HTML - Final Project Part 1

  • HTML - Final Project Part 2

  • HTML - Final Project Part 3

  • HTML *BONUS* - Audio

  • HTML *BONUS* - Video

  • HTML - Closing

  • CSS - Introduction

  • CSS - Inline CSS

  • CSS - In-document CSS

  • CSS - External CSS

  • CSS - Classes

  • CSS - ID's

  • CSS - DIV Element

  • CSS - Colour

  • CSS - Width and Height

  • CSS - Styling Text Part 1

  • CSS - Styling Text Part 2

  • CSS - Styling Text Part 3

  • CSS - Fonts Part 1

  • CSS - Fonts Part 2

  • Quiz 3: Text and Colours

  • CSS - Box Model

  • CSS - Margins

  • CSS - Padding

  • CSS - Borders

  • Quiz 4: Spacing Out

  • CSS - Border Radius

  • CSS - Display

  • CSS - Position

  • CSS - Float

  • Quiz 5: Moving Around

  • CSS - Final Project Files

  • CSS - Final Project Part 1

  • CSS - Final Project Part 2

  • CSS - Final Project Part 3

  • CSS - Final Project Part 4

  • CSS - Final Project Part 5

  • CSS - Final Project Part 6

  • CSS - Final Project Part 7

  • CSS - Final Project Part 8

  • CSS *BONUS* - Opacity

  • CSS *BONUS* - Gradients

  • CSS *BONUS* - Drop Cap

  • CSS - Closing

  • Bootstrap - Introduction

  • Bootstrap - Inclusion

  • Bootstrap - Containers

  • Bootstrap - Fixed-width Columns

  • Bootstrap - Different-width Columns

  • Quiz 6: Bootstrap Layout

  • Bootstrap - Headings

  • Bootstrap - Typography

  • Bootstrap - Images

  • Bootstrap - Lists

  • Quiz 7: Typography and Images

  • Bootstrap - Alerts

  • Bootstrap - Buttons

  • Bootstrap - Jumbotron

  • Bootstrap - Navigation Bars

  • Bootstrap - Navs

  • Bootstrap - Dropdowns

  • Quiz 8: Components 1

  • Bootstrap - Cards

  • Bootstrap - Carousels

  • Bootstrap - Forms

  • Bootstrap - Input Groups

  • Bootstrap - Modals

  • Quiz 9: Components 2

  • Bootstrap - Final Project Files

  • Bootstrap - Final Project Part 1

  • Bootstrap - Final Project Part 2

  • Bootstrap - Final Project Part 3

  • Bootstrap - Final Project Part 4

  • Bootstrap - Final Project Part 5

  • Bootstrap - Final Project Part 6

  • Bootstrap - Final Project Part 7

  • Bootstrap - Final Project Part 8

  • Bootstrap - Final Project Part 9

  • Bootstrap - Final Project Part 10

  • Bootstrap - Closing

  • Where To Now?

  • Just The Beginning

Learners who have already enrolled in this course

Meet your instructor

Steven Blucher
Steven BlucherSecondary School Teacher
I have been a secondary Digital Technologies teacher for 15 years, teaching across all middle and senior school levels, from 6 to 12. For many years, I have believed that the web is the paramount platform for all future communications, and as such, have developed units that assist students in learning how to develop applications for the browser. During this time, I have seen the web change siginificantly and have adapted my classes accordingly, keeping my students inline, as best as possible, with relevent and engaging lessons and activities that will set them up to be life-long coders, if that's what they want. Further to this, I have developed my ability to explain concepts in a way that makes them understandable by just about every student I help. I aim, at all times, to mentor both my classroom and online students in a way that they leave my courses feeling as if they have achieved something that they may have never thought possible. Learning is about accomplishment, and I expect all of my students to walk away from each lesson feeling as if they have done just that: accomplished something. Web development is fun, and HTML, CSS and JavaScript are easy to learn. There is nothing quite as exhilarating as creating your first piece of code and seeing how it looks in a browser window. I still remember how I felt when I discovered this! Thank you for taking the time to read through this, and if there's anything I can do to assist you in your web development journey, please do not hesitate to contact me. Steve