Explore

HTML, CSS, and Javascript for Web Developers

Approx. 40 hours to complete

Save Course

Go to Course

Course Summary

This course provides a comprehensive introduction to HTML, CSS, and JavaScript for web development. It covers the basics of web development and is suitable for both beginners and experienced developers.

Key Learning Points

Learn the basics of web development with HTML, CSS, and JavaScript
Develop your skills in web design and coding
Create your own web pages and applications

Learning Outcomes

Understand the basics of web development
Create your own web pages and applications
Develop your skills in web design and coding

Prerequisites or good to have knowledge before taking this course

Basic computer skills
Internet access

Course Difficulty Level

Beginner

Course Format

Online
Self-paced
Video lectures

Similar Courses

Web Design for Everybody: Basics of Web Development & Coding
Full Stack Web Development

Related Education Paths

Notable People in This Field

Chris Coyier
Jen Simmons

Related Books

Description

Do you realize that the only functionality of a web application that the user directly interacts with is through the web page? Implement it poorly and, to the user, the server-side becomes irrelevant! Today’s user expects a lot out of the web page: it has to load fast, expose the desired service, and be comfortable to view on all devices: from a desktop computers to tablets and mobile phones.

In this course, we will learn the basic tools that every web page coder needs to know. We will start from the ground up by learning how to implement modern web pages with HTML and CSS. We will then advance to learning how to code our pages such that its components rearrange and resize themselves automatically based on the size of the user’s screen. You’ll be able to code up a web page that will be just as useful on a mobile phone as on a desktop computer. No “pinch and zoom” required! Last but certainly not least, we will get a thorough introduction to the most ubiquitous, popular, and incredibly powerful language of the web: Javascript. Using Javascript, you will be able to build a fully functional web application that utilizes Ajax to expose server-side functionality and data to the end user.

Outline

Introduction to HTML5
Course Introduction
Welcome to Module 1: Introduction to HTML5
Development Environment Setup, Part 1
Development Environment Setup, Part 2: MacOS
Development Environment Setup, Part 2: Windows
Development Environment Setup, Part 3: Github and Browser Sync
Resources for Asking Questions
Lecture 1: What is HTML?
Lecture 2: Relevant History of HTML
Lecture 3: Anatomy of an HTML Tag
Lecture 4: Basic HTML Document Structure
Lecture 5: HTML Content Models
Lecture 6: Heading Elements (and some new HTML5 semantic comments)
Lecture 7: Lists
Lecture 8: HTML Character Entity References
Lecture 9: Creating Links
Lecture 10: Displaying Images
Module 1 Wrap-Up
How Grading and Being Late on Assignments Works
Recommended Books
CHECK OUT MY SITE!
ALL of the EXAMPLE SOURCE CODE for this Course
Frequently Asked Questions
CONNECT WITH ME!
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Module 1 Quiz

Introduction to CSS3
Welcome to Module 2: Introduction to CSS3
Lecture 11: Power of CSS
Lecture 12: Anatomy of a CSS Rule
Lecture 13: Element, Class, and ID Selectors
Lecture 14: Combining Selectors
Lecture 15: Pseudo-Class Selectors
Lecture 16: Style Placement
Lecture 17, Part 1: Conflict Resolution
Lecture 17, Part 2: Conflict Resolution
Lecture 18, Part 1: Styling Text
Lecture 18, Part 2: Styling Text
Lecture 19, Part 1: The Box Model
Lecture 19, Part 2: The Box Model
Lecture 19, Part 3: The Box Model
Lecture 20: The background Property
Lecture 21: Positioning Elements by Floating
Lecture 22, Part 1: Relative and Absolute Element Positioning
Lecture 22, Part 2: Relative and Absolute Element Positioning
Lecture 23, Part 1: Media Queries
Lecture 23, Part 2: Media Queries
Lecture 24, Part 1: Responsive Design
Lecture 24, Part 2: Responsive Design
Lecture 25, Part 1: Introduction to Twitter Bootstrap
Lecture 25, Part 2: Introduction to Twitter Bootstrap
Lecture 26, Part 1: The Bootstrap Grid System
Lecture 26, Part 2: The Bootstrap Grid System
Module 2 Wrap-Up
Recommended Books
New Tutorials - here is how...
CONNECT WITH ME!
Frequently Asked Questions
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz

Coding the Static Restaurant Site
Welcome to Module 3: Coding the Static Restaurant Site
Lecture 27, Part 1: Visit with the Client
Lecture 27, Part 2: Visit with the Client (Field Trip)
Lecture 28: Design Overview
Lecture 29: Some Ground Rules and Overview of Setup
Lecture 30, Part 1: Coding Basics of Navbar Header
Lecture 30, Part 2: Coding Basics of Navbar Header
Lecture 31: Coding Button for Future Collapsible Menu
Lecture 32, Part 1: Coding Nav Menu Buttons
Lecture 32, Part 2: Coding Nav Menu Buttons
Lecture 33, Part 1: Fixing Navbar Layout, Text, and Dropdown Menus
Lecture 33, Part 2: Fixing Navbar Layout, Text, and Dropdown Menus
Lecture 34: Coding the Jumbotron
Lecture 35, Part 1: Coding Navigation Tiles
Lecture 35, Part 2: Coding Navigation Tiles
Lecture 36, Part 1: Coding the Footer
Lecture 36, Part 2: Coding the Footer
Lecture 37, Part 1: Coding the Menu Categories
Lecture 37, Part 2: Coding the Menu Categories
Lecture 38, Part 1: Coding the Single Menu Category Page
Lecture 38, Part 2: Coding the Single Menu Category Page
Lecture 38, Part 3: Coding the Single Menu Category Page
Lecture 39: Testing the Mobile Version on a Real Phone
Module 3 Wrap-Up
Recommended Books
New Tutorials - here is how...
Frequently Asked Questions
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz

Introduction to Javascript
Welcome to Module 4: Introduction to Javascript
Lecture 40, Part 1: Adjusting Development Environment for Javascript Development
Lecture 40, Part 2: Where to Place Javascript Code
Lecture 41, Part 1: Defining Variables, Function, and Scope
Lecture 41, Part 2: Defining Variables, Function, and Scope
Lecture 42, Part 1: Javascript Types
Lecture 42, Part 2: Javascript Types
Lecture 43, Part 1: Common Language Constructs
Lecture 43, Part 2: Common Language Constructs
Lecture 43, Part 3: Common Language Constructs
Lecture 44: Handling Default Values
Lecture 45, Part 1: Creating Objects Using 'new Object()' Syntax
Lecture 45, Part 2: Creating Objects Using Object Literal Syntax
Lecture 46: Functions Explained
Lecture 47, Part 1: Passing Variables by Value vs. by Reference
Lecture 47, Part 2: Passing Variables by Value vs. by Reference
Lecture 48: Function Constructors, prototype, and the 'this' Keyword
Lecture 49: Object Literals and the 'this' Keyword
Lecture 50, Part 1: Arrays
Lecture 50, Part 2: Arrays
Lecture 51: Closures
Lecture 52, Part 1: Fake Namespaces
Lecture 52, Part 2: Immediately Invoked Function Expressions (IIFEs)
Module 4 Wrap-Up
Recommended Books
New Tutorials - here is how...
Frequently Asked Questions
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz

Using Javascript to Build Web Applications
Welcome to Module 5: Using Javascript to Build Web Applications
Lecture 53, Part 1: DOM Manipulation
Lecture 53, Part 2: DOM Manipulation
Lecture 54: Handling Events
Lecture 55: The 'event' Argument
Lesson 56: HTTP Basics
Lesson 57, Part 1: Ajax Basics
Lesson 57, Part 2: Ajax Basics
Lesson 57, Part 3: Ajax Basics
Lecture 58: Processing JSON
Lecture 59: Fixing Mobile Nav Menu Automatic Collapse
Lecture 60: Dynamically Loading Home View Content
Lecture 61, Part 1: Dynamically Loading Menu Categories View
Lecture 61, Part 2: Dynamically Loading Menu Categories View
Lecture 62: Dynamically Loading Single Category View
Lecture 63: Changing 'active' Button Style Through Javascript
Course Wrap-Up
Recommended Books
CONNECT WITH ME!
Check out the final deployed site
Frequently Asked Questions
New Tutorials - here is how...
CONNECT WITH ME!
Optional Practice Quiz
Optional Practice Quiz
Optional Practice Quiz

Summary of User Reviews

Discover the essentials of web development with HTML, CSS, and JavaScript in this course on Coursera. Students praise the comprehensive lessons, real-world examples, and useful exercises. One key aspect that many users appreciate is the instructor's clear explanations of complex concepts.

Pros from User Reviews

Comprehensive lessons covering HTML, CSS, and JavaScript
Real-world examples and useful exercises
Clear explanations of complex concepts from the instructor

Cons from User Reviews

Some users find the pace of the course too slow
Not enough hands-on coding exercises for some users
Some users feel that the course doesn't cover advanced topics in depth

Recommended for you

End to End ASP.NET Core 3.1 API and Blazor Development

Learn ASP. NET Core 3. 1 API Development by building a RESTful API and consuming it in a Blazor Client Application...

Save Course

Build Modern Web Layouts With CSS Flexbox

Get a hands-on, in-depth look at building CSS Flexbox layouts Then came Flexbox, a layout mode for CSS that got rid of all the headaches....

Save Course

Fastrack WEB DEVLOPMENT: Learn HTML5, CSS3, JavaScript

And host your website live on INTERNET for FREE! Do you get fascinated when you get to see an awesome website, full of features, great User Experience and Security....

Save Course