![A Front-End Web Developer MasterClass Using HTML, CSS, and JavaScript [Video]](https://static.packt-cdn.com/products/9781789803358/cover/smaller)
A Front-End Web Developer MasterClass Using HTML, CSS, and JavaScript [Video]
- FREE Subscription Access now
- $182.99 Video Buy
-
What do you get with a Packt Subscription?
- Instant access to this title and 7,500+ eBooks & Videos
- Constantly updated with 100+ new titles each month
- Breadth and depth in over 1,000+ technologies
-
Introduction to web development course
-
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
-
Advanced CSS
-
Do more with CSS
-
Apply CSS create a website
-
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
About this video
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.
Style and Approach
This course will teach you how you can create interactive websites from scratch. This is the complete front end web developer starting course. You will learn HTML and HTML5, CSS and CSS3, JavaScript, JavaScript DOM selecting elements and manipulating element content all in one course. Source Code and examples are included to get you started quickly. Links to top resources and more all available in one massive course.
- Publication date:
- September 2018
- Publisher
- Packt
- Duration
- 17 hours 1 minute
- ISBN
- 9781789803358
Download code from GitHub