Web Development HTML CSS & JS a 2020 Beginner to Advance
4.4 (58 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
3,349 students enrolled

Web Development HTML CSS & JS a 2020 Beginner to Advance

HTML5, CSS3 SASS and JavaScript Modern Responsive websites using CSS Flexbox & CSS Grid, Manipulate the DOM & send JSON
4.4 (58 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
3,349 students enrolled
Last updated 7/2020
English
English [Auto]
Current price: $129.99 Original price: $199.99 Discount: 35% off
2 days left at this price!
30-Day Money-Back Guarantee
This course includes
  • 23.5 hours on-demand video
  • 6 articles
  • 23 downloadable resources
  • 2 Practice Tests
  • Full lifetime access
  • Access on mobile and TV
  • Assignments
  • 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
  • HTML5
  • CSS3
  • Create static HTML and CSS Landing pages
  • JavaScript
  • SASS
  • Flexbox & CSS Grid Projects
  • HTML5 Semantic Layout & CSS Fundamentals
  • Web Development
  • Front End Web Development
  • Create a beautiful, responsive landing page for a startup
  • Use common JS data structures like Arrays and Objects
  • Manipulate the DOM with vanilla JS
  • Write Javascript functions, and understand scope and higher order functions
  • Create static HTML and CSS portfolio sites and landing pages
  • Learn to organize your code and become a professional web developer
Course content
Expand all 123 lectures 23:19:33
+ Introduction
1 lecture 02:23

In this section I will be introducing the topics, pre-Knowledge and need Tools

Preview 02:23
+ Beginner-HTML 5
8 lectures 01:00:17

In this video I explain what HTML is and what it dose.

Preview 02:21

What dos HTML stand for?

Test Your Mind
1 question

In dis lecture we will learn about the HTML 5 Boilerplate.

Preview 08:20

In dis lecture we will learn about the HTML Elements/Tag.

Preview 15:21

In dis lecture we will learn about the Heading Tag.

Preview 03:41
Test Your Mind
1 question

In dis lecture we will learn about the Paragraph Tag.

Preview 05:16

This is a Quiz

Test Your Mind
2 questions

In dis lecture we will learn about the Anchor Tag.

Preview 09:12

In dis lecture we will learn about Lists.

Preview 12:42
+ Test Your Might
0 lectures 00:00
Test Your Might
28 questions
+ Intermediate HTML 5 & Beginner CSS 3
19 lectures 03:01:11
HTML5-CSS3 - Code Editor
11:21
HTML5-CSS3 - Attributes
10:56
HTML5-CSS3 - Table
16:04
HTML5-CSS3 - Divs and Spans
10:35
HTML5-CSS3 - Forms
02:48
HTML5-CSS3 - Input
10:24
HTML5-CSS3 - Labels
04:06
HTML5-CSS3 - Simple Form Validations
04:25
HTML5-CSS3 - Dropdown and Radio Buttons
16:19
HTML5-CSS3 - Form Example and Recap
03:10
Create a Form folwing the Example from the previous Lecture
Test Your Might - HTML5-CSS3 - Form Exercise
1 question

In this lecture we will create the to Forms from the privies Assignment.

HTML5-CSS3 - Form Solution
28:54
Create a HTML file with the name of TermsAndConditions.html
Test Your Might - HTML5-CSS3-List And Text Assignment
1 question
HTML5-CSS3-List And Text Solution
07:08
HTML5-CSS3-List And Text Page Extension
06:52
HTML5-CSS3-Linking CSS to HTML
06:06
HTML5-CSS3-Selectors
10:42
HTML5-CSS3-Text Formatting
19:34
HTML5-CSS3-Colors
10:56
HTML5 CSS3 Color Gradient
00:00
+ Intermediate HTML 5 & Intermediate CSS 3
13 lectures 01:47:42
HTML5-CSS3-Box Model-Border Radius
07:35
Border Radius Tricks and Tips
00:00
HTML5-CSS3-Box Model-Box-Shadow
14:38

Hi all, this are just a few useful tips and tricks for using Box shadow, enjoy! :)

Box Shadow Tricks and Tips
00:00
HTML5 & CSS 3 - Advanced Selectors And !Important
12:03
HTML5 & CSS 3 - AS-Pseudo - Classes:Root
11:45
HTML5-CSS3-AdcancedSelector-Hover
20:59
HTML5-CSS3-AdcancedSelector-Focus
03:28
HTML5-CSS3-AdcancedSelector-Enabled-Disabled
05:44
HTML5-CSS3-AdcancedSelector-Checked
04:27
HTML5-CSS3-AdcancedSelector-Child
04:34
HTML5CSS 3-AS-Pseudo-Elements
14:52
+ Test Your HTML5 Semantic elements Might !
0 lectures 00:00

This will test your basic knowledge about HTML 5

HTML5 Semantic elements Test Your Might!
13 questions
+ Advance CSS3 - Flex Box
14 lectures 01:42:06
Advance CSS3-FlexBox-Displaying Flex & Flex Direction
07:46
Advance CSS3-FlexBox-Flex-Wrap
02:55
Advance CSS3-FlexBox-Justify-Content
05:06
Advance CSS3-FlexBox-Align-Items and Content
09:05
Project-FlexBox-Landing Page-Introduction
01:42
Project-FlexBox-LP-Laying Plans
09:47
Project-FlexBox-LP-Navigation
08:19
Project-FlexBox-LP-Header
09:59
Project-FlexBox-LP-Portfolio
06:03
Project-FlexBox-LP-About
12:55
Project-FlexBox-LP-Contact
13:58
Project-FlexBox-LP-Footer And Adjustments
11:36

Here is the complete HTML and CSS for the Project Flex Box Landing Page

Project FlexBox-LP Resources
00:01
+ Advance CCS3 - Grid Layout
20 lectures 02:33:17
Grid Components
05:40
Grid Template Columns and Rows
12:43
Grid Template Areas
12:09
Grid Template
08:21
Grid Gaps
03:36
Grid-Justify-Items
04:08
Grid-Align-Items
03:10
Grid-Justify-Content
04:07
Grid-Auto
04:51
Grid layout Landing Page-Introduction
02:11
Grid-LP-Laying Plans
04:07
Grid-LP-Boiler Plate
09:37
Grid-LP-Menu
13:15
Grid-LP-Header
12:41
Grid-LP-Services
08:36
Grid-LP-Portfolio
05:48
Grid-LP-About
16:14
Grid-LP-Contact
08:24
Grid-LP-Footer
11:26
+ CSS3 Queris
1 lecture 31:34
At-Rules: Import, Media, Keyframe
31:34
+ CSS3 Practice Projects
1 lecture 50:03
CSS Practice Projects -1
50:03
Requirements
  • Basic PC/Mac Knowledge
  • Beginner Curiosity
Description

This is a beginner friendly course. This course will tech you the Foundations of Web Development. This a more practical orientate Course. Aldo we will start up slow with some basic definitions, the main focus here is to have as much as possible hands on experience. Learning by doing is the key word. That means Examples, Assignments and Exercises!

At this point I would like to invite you to join me on this journey and enrich yourself with the foundations of web development. In this Course You will learn Modern HTML 5, CSS 3, and JavaScript, and through applying them you will be able to building from Easy to progressively more complex responsive Responsive Web Pages.

Throughout the course we cover tons of tools and technologies including:

  • HTML5

  • CSS3

  • CSS FelxBox

  • CSS Grid Layout

  • Projects

  • SASS

  • JavaScript

  • DOM Manipulation

  • JSON

  • Projects , Projects and more Projects :)


Two Important Notes about this Course:

1. This is a hands-on Learning by doing Course. This means that we are going to start up Slowly with basic definitions in HTML and CSS and then we will combine them together by building the structure and applying design to our sites. After that we will apply JS in order to make the Site do Thinks.


2. Is that I will be constantly Updating the Content with New Documentation, Examples and Exercises in order to bring you as much value as possible. So you can always lean beck on this Course if you want to refresh your memory about something.


Bonus!

3. The most important thing the you need to know in life is where to find the information you need!


Who this course is for:
  • Beginner Web Developers
  • Beginner Web Designers
  • Beginner HTML
  • Beginner CSS
  • Beginner SASS / SCSS
  • Beginner JavaScript