Learn By Example: The Foundations of HTML, CSS & Javascript [Video]

Preview in Mapt

Learn By Example: The Foundations of HTML, CSS & Javascript [Video]

Loonycorn

Closures, prototypes, JSON, the DOM, selectors, inheritance in CSS and in Javascript, and first-class functions

Quick links: > What will you learn?> Table of content

Mapt Subscription
FREE
$29.99/m after trial
Video
$43.35
RRP $50.99
Save 14%
What do I get with a Mapt Pro subscription?
  • Unlimited access to all Packt’s 5,000+ eBooks and Videos
  • Early Access content, Progress Tracking, and Assessments
  • 1 Free eBook or Video to download and keep every month after trial
What do I get with an eBook?
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with Print & eBook?
  • Get a paperback copy of the book delivered to you
  • Download this book in EPUB, PDF, MOBI formats
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
What do I get with a Video?
  • Download this Video course in MP4 format
  • DRM FREE - read and interact with your content when you want, where you want, and how you want
  • Access this title in the Mapt reader
$0.00
$43.35
$29.99 p/m after trial
RRP $50.99
Subscription
Video
Start 14 Day Trial

Frequently bought together


Learn By Example: The Foundations of HTML, CSS & Javascript [Video] Book Cover
Learn By Example: The Foundations of HTML, CSS & Javascript [Video]
$ 50.99
$ 43.35
Learn By Example: C++ Programming - 75 Solved Problems [Video] Book Cover
Learn By Example: C++ Programming - 75 Solved Problems [Video]
$ 50.99
$ 43.35
Buy 2 for $35.00
Save $66.98
Add to Cart

Video Details

ISBN 139781789132052
Course Length13 hours 03 minutes

Video Description

Closures, prototypes, JSON, the DOM, selectors, inheritance in CSS and in JavaScript, and first class functions - that's what this course is about. This is not a course on JavaScript frameworks - its about solid, fundamental HTML, CSS and JavaScript. You'll be surprised by how much more you can get done on your web pages once you learn these technologies the right way. Basic HTML: Folks stopped counting HTML as a language worth formally learning sometime in the 90s, but this is only partially justified. It always helps to have strong basics. CSS: Cascading Stylesheets are incredibly powerful, and incredibly hard to use - until you know how they really work. Once you understand inheritance and selection in CSS, it will all make a lot more sense. JavaScript is a full-fledged, powerful and complicated language. Its really important to learn JavaScript formally, because it is just so different from most other languages you would have encountered. For instance - JavaScript has objects and inheritance but no classes. Closures in JavaScript are a rather mind-bending concept - functions that "remember" how the world looked when they were created. Prototypes are JavaScript's way of doing inheritance, and its very different from the C++/Java way of doing it. JSON is not conceptually difficult to use, but it is incredibly important, and you should understand why - because its the glue between backends written in Java or other traditional languages, and front-ends written in JavaScript. The Document-Object-Model is what ties JavaScript back to HTML and CSS. Together with JSON, the DOM ties it all together from server to skin.

Style and Approach

That "quick-and-dirty" way of learning and doing leads to problems over time, because Javascript and CSS are actually quite complex, so it is easy to do things the wrong wayThis course will help, because it has 75 examples, 20 in HTML/CSS and 55 in Javascript. Each is self-contained, has its source code attached, and gets across a simple, specific use-case. Each example is simple, but not simplistic.

Table of Contents

Welcome to HTML, CSS and Javascript!
Welcome to HTML, CSS and JavaScript!
Introducing HTML and CSS
Introducing HTML and CSS
Introduction to HTML
Introduction to CSS
The A Tag
Paths
Quotes
Lists - Ordered and Unordered
Other Miscellaneous HTML Tags
URL and Domain Names
The img Tag
The HTML Standard
CSS
Cascading Stylesheets reintroduced
Inheritance in CSS
CSS Selectors
Fonts
Colors
The Box Model
The <div> Element
What is the exact style applied?
The <span> Element
HTML States and Pseudo-classes
Normal Rendering Flow Of The Browser
The CSS float and clear properties
Experimenting with the position attribute
Fluid And Fixed Layouts
The CSS display property
Chrome Developer Tools
JavaScript Basics
Introducing JavaScript
Example 1: Executing JavaScript code
Example 2: Basic programming constructs
Example 3: Separating HTML and JS files
Example 4: Using the console.log statement
Example 5: Local and global variables
Example 6: Undeclared variables in JS are global
Example 7: Local variables hide global variables of the same name
Example 8: JavaScript is ephemeral, reloading a page resets everything
Example 9: Creating and using arrays
Example 10: Copying an array
Example 11: Adding an element to an array
Example 12: Deleting elements from an array
Example 13: Arrays can contain different types
Example 14: Non-existent array elements are undefined
First class functions
Objects in Javascript
Introduction to JavaScript objects
Example 15: Creating an object using JSON
Example 16: Creating an object using a constructor
Example 17: Adding properties to objects dynamically
Example 18: Removing properties from objects dynamically
Example 19: Object properties can be functions
Example 20: Object constructors can have property functions
Example 21: Two ways of accessing object properties
Example 22: Iterating over all properties in an object
Example 23: Calling a constructor without new
Example 24: Understanding the typeof operator
Example 25: Paternity tests using instanceof
Example 26: Faking public and private properties
First Class Functions - In Detail
Example 27: Functions as arguments to functions
Example 28: Functions that return functions
Example 29: Arguments pass by value to functions
Example 30: Arguments pass by reference
Javascript Quirks
Introduction to JavaScript Quirks
Example 31: Understanding undefined
Example 32: Understanding null
Example 33: Understanding NaN
Example 34: Strings and numbers and conversions between them
Example 35: Strange comparison operators
Example 36: Truthy and falsy
Example 37: Simple string operations
Functions Yet Again
Example 38: Declared Functions, Function Literals and Hoisting
Example 39: Named And Anonymous Function Literals
Example 40: Nested Functions
Example 41: Nested functions can be declared
Closures
Introduction to closures
Example 42: Closure variables win over local variables
Example 43: Closures with declared functions and function literals
Example 44: Referencing environment with function parameters
Example 45: Closure variables cooler than global variables
Prototypes, Dynamic Prototyping and Inheritance
Introduction to prototypes
Example 46: Prototypical Inheritance In Action
Example 47: Dynamic Prototyping
Example 48: Inheritance hierarchy using chained prototypes
Example 49: Overriding properties using prototypes
Example 50: The base object as the ultimate prototype
Example 51: Overriding properties of built-in objects
The Document Object Model & Event Handling
Introduction to the Document Object Model
Example 52: Modifying the HTML of a page using the DOM
Example 53: Event Handling
Example 54: Adding Multiple Event Handlers on the Same Event
Example 55: Setting Arbitrary HTML Attributes
Example 56: The window object
JSON
Introduction To JSON
Example 57: Simple JSON Use Cases
Example 58: Creating meaningful objects with JSON

What You Will Learn

  • Understand HTML - its structure, and the commonly used tags
  • Utilise CSS, including inheritance, selectors, the box model - the very topics that make CSS hard to use
  • Master the fundamentals of JavaScript
  • Use closures, dynamic prototyping, JSON, and the Document-Object-Model with confidence

Authors

Table of Contents

Welcome to HTML, CSS and Javascript!
Welcome to HTML, CSS and JavaScript!
Introducing HTML and CSS
Introducing HTML and CSS
Introduction to HTML
Introduction to CSS
The A Tag
Paths
Quotes
Lists - Ordered and Unordered
Other Miscellaneous HTML Tags
URL and Domain Names
The img Tag
The HTML Standard
CSS
Cascading Stylesheets reintroduced
Inheritance in CSS
CSS Selectors
Fonts
Colors
The Box Model
The <div> Element
What is the exact style applied?
The <span> Element
HTML States and Pseudo-classes
Normal Rendering Flow Of The Browser
The CSS float and clear properties
Experimenting with the position attribute
Fluid And Fixed Layouts
The CSS display property
Chrome Developer Tools
JavaScript Basics
Introducing JavaScript
Example 1: Executing JavaScript code
Example 2: Basic programming constructs
Example 3: Separating HTML and JS files
Example 4: Using the console.log statement
Example 5: Local and global variables
Example 6: Undeclared variables in JS are global
Example 7: Local variables hide global variables of the same name
Example 8: JavaScript is ephemeral, reloading a page resets everything
Example 9: Creating and using arrays
Example 10: Copying an array
Example 11: Adding an element to an array
Example 12: Deleting elements from an array
Example 13: Arrays can contain different types
Example 14: Non-existent array elements are undefined
First class functions
Objects in Javascript
Introduction to JavaScript objects
Example 15: Creating an object using JSON
Example 16: Creating an object using a constructor
Example 17: Adding properties to objects dynamically
Example 18: Removing properties from objects dynamically
Example 19: Object properties can be functions
Example 20: Object constructors can have property functions
Example 21: Two ways of accessing object properties
Example 22: Iterating over all properties in an object
Example 23: Calling a constructor without new
Example 24: Understanding the typeof operator
Example 25: Paternity tests using instanceof
Example 26: Faking public and private properties
First Class Functions - In Detail
Example 27: Functions as arguments to functions
Example 28: Functions that return functions
Example 29: Arguments pass by value to functions
Example 30: Arguments pass by reference
Javascript Quirks
Introduction to JavaScript Quirks
Example 31: Understanding undefined
Example 32: Understanding null
Example 33: Understanding NaN
Example 34: Strings and numbers and conversions between them
Example 35: Strange comparison operators
Example 36: Truthy and falsy
Example 37: Simple string operations
Functions Yet Again
Example 38: Declared Functions, Function Literals and Hoisting
Example 39: Named And Anonymous Function Literals
Example 40: Nested Functions
Example 41: Nested functions can be declared
Closures
Introduction to closures
Example 42: Closure variables win over local variables
Example 43: Closures with declared functions and function literals
Example 44: Referencing environment with function parameters
Example 45: Closure variables cooler than global variables
Prototypes, Dynamic Prototyping and Inheritance
Introduction to prototypes
Example 46: Prototypical Inheritance In Action
Example 47: Dynamic Prototyping
Example 48: Inheritance hierarchy using chained prototypes
Example 49: Overriding properties using prototypes
Example 50: The base object as the ultimate prototype
Example 51: Overriding properties of built-in objects
The Document Object Model & Event Handling
Introduction to the Document Object Model
Example 52: Modifying the HTML of a page using the DOM
Example 53: Event Handling
Example 54: Adding Multiple Event Handlers on the Same Event
Example 55: Setting Arbitrary HTML Attributes
Example 56: The window object
JSON
Introduction To JSON
Example 57: Simple JSON Use Cases
Example 58: Creating meaningful objects with JSON

Video Details

ISBN 139781789132052
Course Length13 hours 03 minutes
Read More

Read More Reviews

Recommended for You

Learn By Example: C++ Programming - 75 Solved Problems [Video] Book Cover
Learn By Example: C++ Programming - 75 Solved Problems [Video]
$ 50.99
$ 43.35
Learn By Example: Hadoop, MapReduce for Big Data problems [Video] Book Cover
Learn By Example: Hadoop, MapReduce for Big Data problems [Video]
$ 49.99
$ 42.50
Learn By Example: Statistics and Data Science in R [Video] Book Cover
Learn By Example: Statistics and Data Science in R [Video]
$ 49.99
$ 42.50
Learn by Example : HBase - The Hadoop Database [Video] Book Cover
Learn by Example : HBase - The Hadoop Database [Video]
$ 49.99
$ 42.50
Learn By Example: Scala [Video] Book Cover
Learn By Example: Scala [Video]
$ 49.99
$ 42.50
TensorFlow and the Google Cloud ML Engine for Deep Learning [Video] Book Cover
TensorFlow and the Google Cloud ML Engine for Deep Learning [Video]
$ 19.99
$ 17.00