JavaScript coding essentials | A Front-End Web Developer MasterClass Using HTML, CSS, and JavaScript

Book Overview & Buying
Table Of Contents

A Front-End Web Developer MasterClass Using HTML, CSS, and JavaScript

By : Laurence Svekis

Buy this Video

A Front-End Web Developer MasterClass Using HTML, CSS, and JavaScript

By: Laurence Svekis

Buy this Video

Overview of this book

This course is going to take you on a journey where you’ll learn and practice HTML CSS and JavaScript all in one course. This includes various topics in HTML such as how to write and practice HTML, Heading Tags, Update template and lot more. You will be able to understand CSS, Advanced CSS, and Apply CSS in creating a website etc. This course is designed to help you learn and practice front-end coding for website development and design. Source Code and examples are included to get you started quickly. Links to top resources and more all available in one massive course. You will be able to create interactive websites from scratch and allows you to become familiar with coding and creating web pages and applications.

Introduction to web development course

Web development introduction

Welcome to front end web development

How the internet works

DNS Names and IP addresses

Code of the internet

HTML and CSS how they work

JavaScript Code

Web development and how it works

Dynamic Static Frontend Backend Client Side Server Side

Editors creating frontend code

Web development Browsers

File Structure

Hosting websites

Get your website files to your server

Web developer Resources and info

Basics of HTML

What is HTML

How to Write and Practice HTML

How to create an HTML boilerplate

Exercise creating a boilerplate HTML file

Self Closing tags Meta tags and attributes

Heading Tags

Update template

Common tags P BR HR separate text

Clean Code Comments and more

HTML preformatted text

HTML Character Codes resources

Exercise Recreate as HTML

HTML more tags

HTML Markup Examples

HTML hyperlinks

Hyperlink Attributes

How to create HTML bookmarks

email link HTML mailto

Exercise Create Navbar for website

Adding Images to websites

Exercise Create Thumbnail portfolio

Ordered Lists and Unordered lists

HTML Description List

HTML Nested Lists

Exercise List of services

HTML tables

HTML spanning multiple cells

Quick Tip Styling

Exercise HTML table

HTML forms introduction

Contact Form HTML

New HTML5 input types

Form elements HTML

Form content

Exercise Create Contact Form

HTML5 semantic elements

HTML iframe pages

Exercise Create a Website

Introduction to CSS

Websites with and without CSS

How to add CSS to HTML Pages

Making selections CSS inspector

Divs and spans content selection

CSS selection id tag class

Colors HEX RGB RGBA values

CSS named color values

CSS background images

CSS background shorthand statement

CSS borders shorthand

CSS border Outline

CSS Margins

CSS padding

CSS Box Model Dev Tools

CSS height and Width

Box Model Challenge

Auto Margins Center your elements CSS

CSS font property

CSS Text property

Chrome dev tools editors and options

Adding Font families Google Fonts

Line Height CSS

CSS letter spacing

CSS links

CSS table styling

Display and Hiding elements CSS

Display Inline 4 squares Challenge

CSS position Properties

DevTools Design Tips

Coding Challenge Make a NavBar from an unordered list

Code Challenge Solution

Using CSS to build webpage layouts

Floats section introduction

More about Floats

Intro to Floats

CSS Float images inline with text

CSS float thumbnails

HTML build basic page layout CSS

2 column CSS site

Create a 2 column page layout in minutes

Create 3 column webpage

3 column height background color fix

Advanced CSS

CSS Combinators

CSS Pseudo Classes

CSS Pseudo Elements

CSS Selectors by attributes

CSS Media Queries secret to responsive design

Do more with CSS

Multiple Background Images CSS

Element box properties CSS

More border options CSS3

background gradients CSS

CSS3 Animation

Apply CSS create a website

HTML build a basic website structure with HTML

Apply CSS build a navbar

Build 2 Column main content area CSS

Sidemenu links hover CSS

CSS website tweak

JavaScript do more on your web page

What is JavaScript

How to add JavaScript to Webpages

Debugging and commenting JavaScript

JavaScript Basic Data Types

JavaScript Variables

JavaScript Variable Rules

Exercise 1 Output to console link to js file

Data type Null vs Undefined JavaScript

Declaring multiple variables at once JavaScript

JavaScript Operators

Increment and Decrement Values JavaScript

Assignment Operators JavaScript

Comparison Operators JavaScript

JavaScript String Operators

JavaScript Logical Operators

JavaScript coding essentials

prompt and alert JavaScript

Writing content to the HTML document object

JavaScript Objects

JavaScript Objects Dynamic Outputs

JavaScript Objects within Objects

JavaScript update values

JavaScript Arrays

Working with Array Methods JavaScript

Array Methods extended

Sorting and more with Arrays JavaScript

More with Arrays JavaScript

Objects and Arrays together

JavaScript if condition statement

JavaScript switch statement

JavaScript Do while loops

For loops and more JavaScript

Looping items in arrays and objects JavaScript

JavaScript introduction to functions

Working with JavaScript Functions

Global and Local Variables Functions

Self-Executing function

Break out of function JavaScript

JavaScript String Methods

Strings and Arrays

Numbers to strings back to numbers

JavaScript Math Method

JavaScript Date Method

JavaScript DOM

What is the DOM

Select Node value using JavaScript

JavaScript Objects and selection within the DOM

Windows Object Model

document write method

Selecting Elements by ID

Update Output Div content from input form

Select Elements by Tag Name

Selecting elements by Class

document query Selector

Making Selections like CSS

Traversing the DOM

Add styling to Elements Dynamically

Append and Remove Elements using JavaScript

Add Event listeners to elements using JavaScript

Event listeners click events

Hover over elements make them change background color

Image popup window

Create a single page website from scratch HTML CSS JavaScript

Single page website section introduction what we are building

development environment setup

webpage setup

Setup Nav Structure and Elements

Style NavBar CSS

Add Placeholder Content to Sections

Tweak Header NavBar and Sections

CSS HTML Build Sections

Build Page Footer

Final Page Tweaks

JavaScript ScrollSpy Effect

Webpage Final Overview

A Front-End Web Developer MasterClass Using HTML, CSS, and JavaScript

By : Laurence Svekis

A Front-End Web Developer MasterClass Using HTML, CSS, and JavaScript

By: Laurence Svekis

Overview of this book

Confirmation

Buy this book with your credits?

Submit Your Feedback

Create a Free Account To Continue Reading

Sign in to activate your 7-day free access