The Complete Front-End Web Development Course!

272,187 students enrolled

The Complete Front-End Web Development Course!

Get started as a front-end web developer using HTML, CSS, JavaScript, jQuery, and Bootstrap!

272,187 students enrolled

Created by Joseph Delgadillo, Nick Germaine

Last updated 6/2020

English

English

Preview this course

The Complete Front-End Web Development Course!

$126.99 $194.99 35% off

2 days left at this price!

30-Day Money-Back Guarantee

17 hours on-demand video
1 article
Full lifetime access
Access on mobile and TV

Certificate of Completion

Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business

What you'll learn

Build a simple HTML text site
Style web pages using CSS
Program websites with JavaScript
Build a Pipboy using Bootstrap
Build and publish a Google Chrome Extension

+ – Welcome to the Course!

2 lectures 07:01

Introduction to the course

Preview 01:46

Preview 05:15

+ – Web Development Basics - HTML

9 lectures 57:56

HTML document structure

Preview 04:05

HTML elements - div and span

06:43

HTML elements - i, b, p, and a

06:28

HTML elements - ul, li, and ol

05:23

HTML elements - header and footer

05:21

HTML elements - section, main, and article

08:14

HTML elements - h1-h6 and aside

03:16

HTML tables

09:56

Project #1 - HTML text site

08:30

+ – Advanced HTML Concepts

10 lectures 53:12

Images

03:30

Forms

04:48

Inputs

07:01

Checkboxes

04:55

Radio buttons

04:40

Select, option, and buttons

06:19

HTML5 videos

07:13

HTML5 audio

04:35

Doctypes

02:58

Meta tags

07:13

+ – Introduction to Cascading Style Sheets (CSS)

11 lectures 01:31:41

Targeting color and background

15:58

Element specificity

03:48

ID targeting, margin, and border

11:50

Padding, margin, and float

08:11

Max-width and background-image

16:43

Switching over to an IDE

01:45

Font weight, style, and family

13:43

Text decorations

03:51

Text spacing

03:54

Text decoration modification

04:16

Text shadow

07:42

+ – Advanced CSS

7 lectures 51:57

Pseudo-states

08:52

Border radius

08:27

Positions

09:04

Pseudo-elements

06:54

Z-index

05:50

Viewpoint width and height, overflowing content

07:20

Transition property

05:30

+ – JavaScript for Beginners

11 lectures 01:02:32

Intro to JavaScript

04:23

Alerts and console logging

05:44

Integers, strings, and variables

06:49

Undefined variables and modifying values of variables

05:27

Boolean operators

02:48

Comparing values

05:10

If statements

10:53

For loops

03:19

Defining functions

06:04

Event handling

09:06

Setting an elements innerHTML

02:49

+ – More JavaScript Concepts

12 lectures 01:39:37

Arrays pt.1

05:57

Arrays pt.2

06:55

Arrays pt.3

05:24

Textareas and getting the value of inputs

13:43

Functions - parameters and return values

07:34

Multiple parameters in functions

05:01

Flexible function parameters

11:57

Exercise - find the missing number

07:52

Exercise solution

07:33

Classes explained

04:55

Class constructor, instance variables, and static variables

09:07

Extending classes

13:39

+ – Getting Started with jQuery

11 lectures 01:38:48

jQuery setup

06:17

Targeting elements

04:10

Event handling

10:48

Dropdown menus

22:22

Making our dropdown disappear

04:36

Multiple targets, events, and attr method

08:45

Prepend, append, and html

05:16

preventDefault

06:11

event.which and switch properties

09:01

Custom context menu, pageY, and pageX

13:28

is method

07:54

+ – More jQuery

8 lectures 57:24

Writing our own version of jQuery

17:23

Find method

04:40

First and last

01:59

Focusin and focusout

11:21

Contains, is, and hasClass

07:08

Each method

02:36

Callbacks

07:14

CSS

05:03

+ – Bootstrap Basics

6 lectures 48:36

Bootstrap setup

06:48

Navbar pt.1

06:44

Navbar pt.2

10:41

Forms pt.1

13:59

Forms pt.2

04:41

Buttons

05:43

4 more sections

Requirements

No previous development experience required
Access to various open-source (free) software.

Description

If you would like to get started as a front-end web developer, you are going to LOVE this course! Work on projects ranging from a simple HTML page to a complete JavaScript based Google Chrome extension. We will cover the following technologies in this course:

Web development basics with HTML
Cascading Style Sheets (CSS)
JavaScript programming
jQuery JavaScript library
Bootstrap framework

We will work on 3 class projects throughout this course:

Simple text site - We will use what we learned in the HTML sections to create a simple text site. This project will help you learn HTML structure and the essential elements.

Fallout inspired Pip-Boy - We will take what we learned in the CSS and Bootstrap sections of the course to code a Pip-Boy from the game Fallout. This project will help you learn the design elements of modern web development.

Google Chrome extension - We will finish the course by programming a JavaScript based Google Chrome extension. This project will help you understand the logical parts of web development.

This course covers the most popular web development frameworks, and will get you started on your path towards becoming a full-stack web developer!

Still not sold? Check out a few of the awesome reviews this course has received!

"Excellent Course! Highly Recommend It! Such a great hands on experience with this course."

"Very nice course, covers all the stuff you need, good voice and good explanation makes it perfect for people that are new to HTML. Also there's some best practices recommendations which are useful even for advanced developers."

"Excellence in giving the optimal set of tools for web development beginners seeking a well-rounded start for professional web development."

Thank you for taking the time to read this, and we hope to see you in the course!

Who this course is for:

Anyone who would like to learn front-end web development