Introduction to HTML, CSS, and JavaScript from scratch

Learn real world hands -on web development skills | Create 7 Apps

4.50 (131 reviews)
Udemy
platform
English
language
Web Development
category
10,820
students
10.5 hours
content
Jun 2021
last update
$49.99
regular price

What you will learn

Understand core concepts of HTML

Understand core concepts of CSS

Understand core concepts of JavaScript

Create HTML Document Structure

Style HTML elements with CSS

Create interactivity with JavaScript

Create a basic website

Create web apps

Description

This  introductory course to  HTML ,CSS and JavaScript is  vital for anyone who wants to become a web developer..

These three technologies are skills every web developer must learn and have.

HTML : Used to create  content

CSS: Used to present the content

JavaScript : Used to create interaction

They are the building blocks of all websites and web based projects.

This course will teach you the basics of these three technologies by creating a basic one page website and 7 other projects.


What You will learn  include:


Introduction to basic HTML

  • Creating a very basic website

  • Planning a basic website

  • Assembling files and folders

  • What is HTML

  • HTML document structure

  • Anatomy of HTML element

  • Marking up text

  • Links

  • Using comments

  • HTML Attributes


Introduction to  basic CSS

  • What is CSS

  • Ways to apply CSS

  • CSS Ruleset

  • CSS basic selectors

  • Styling multiple elements

  • CSS Box model

  • Using margin and padding properties

  • Changing background color

  • CSS Display property

  • CSS Font property

  • Using google fonts


Introduction to basic JavaScript

  • What is JavaScript

  • Where to place JavaScript

  • Variables

  • Data Types

  • Operators

  • Operator precedence

  • Using Conditionals

  • Functions

  • Events

  • Using Linting tools

  • Adding image changer

  • Adding personalized message


Projects we will create :

  • TodoList

  • Calculator

  • Interactive quiz

  • Image slider

  • Countdown timer

  • Weight converter tool

  • Loan calculator




Content

Getting Started

Introduction
Core Web Development Languages
Text Editors
Web Browsers
Planning a web project
Sketching out your design
Creating files and folders for your web project

Free Online Labs

Introduction
JSBIN
JSFIDDLE
CODEPEN
DABBLET
PLUNKER
LIVEWEAVE

Introduction to HTML

What is HTML
Anatomy of an HTML Element
HTML document -Basic structure
Build a basic HTML document structure -Part 1
Build a basic HTML document structure -Part 2
Build a basic HTML document structure -Part 3
What are Attributes
How to Markup Text
How to create Links
Adding comments to your HTML code
What is a source code

Introduction to CSS

What is CSS
Methods of applying CSS
How to style multiple properties
How to style multiple elements
How to modify your CSS
Basic CSS Selectors
The CSS Box Model
CSS Padding and Margin Property
CSS background property
Styling a web page title
The CSS Font Property
CSS Display property
Exploring and using Google Fonts
Adding comments to CSS Code

Introduction to JavaScript

What is JavaScript
The developer Console
Where to Place JavaScript
JavaScript Syntax
What are statements
What are expressions
What are Variables
Variable Naming Convention
What are Arrays
Data Types
Mixing Data Types
Operators
Arithmetic Operators
Assignment Operators
Operator Precedence
Comparison Operators
Logical Operators
Conditional statements
Functions
Linting tools
Events
Adding an Image Changer
Fixing linting issues - part 1
Fixing linting issues - part 2
Adding a welcome message to a web page
Adding comments to JavaScript Code

Project 1: Build a Basic Web Calculator

What we will create
Project design and sketch
Create directory and files
Creating the structure with HTML - Part 1
Creating the structure with HTML - Part 2
Add functionality with JavaScript
Add styling with CSS

Project 2: Create a TodoList Web App

What we will create
Create project directory and files
Create the structure with HTML
Add style with CSS
Add functionality with JavaScript - Part 1
Add functionality with JavaScript - Part 2

Project 3: Build an Image Slider

What we will create
Creating directory and files
Creating structure with HTML
Add styling with CSS
Add functionality with JavaScript

Project 4: Create a Loan Calculator

What we will create
Creating directory and Structure
Adding the logic with JavaScript
Adding styling with CSS

Project 5: Create Event Count Down Timer

What we will create
Overview
Creating directory and files
Creating structure with HTML
Add styling with CSS
Add functionality with JavaScript

Project 6: Create an Interactive Quiz Web App

What we will create
Overview
Creating directory and files
Creating project structure with HTML
Add styling with CSS
Adding functionality with JavaScript - Part 1
Adding functionality with JavaScript - Part 2

Project 7: Create a Weight Conversion Web App

What we will create
Creating directory and structure with HTML
Adding functionality with JavaScript
Add styling with CSS
Converting pounds to kilograms

Screenshots

Introduction to HTML, CSS, and JavaScript  from scratch - Screenshot_01Introduction to HTML, CSS, and JavaScript  from scratch - Screenshot_02Introduction to HTML, CSS, and JavaScript  from scratch - Screenshot_03Introduction to HTML, CSS, and JavaScript  from scratch - Screenshot_04

Reviews

Gemelia
June 22, 2023
I love the course just wish you could add some quizzes inside so I can know I fully understand these lectures.
Karan
June 8, 2022
Concepts were explained in a simple fashion, easy to following instructions. The only criticism is rushed through the javascript process when making the apps.
Abayomi
September 4, 2021
well.. i'm new here' .also,it's my pleasure having this class i hope it will create a beter field of learning and practising new skill.
Mogau
May 8, 2021
This course gave more than I personally expected, it challenges one to go the extra mile, and I liked it
Anders
March 19, 2020
Although cheap, definitely not worth the money – low production quality, slow, unengaging and not to the point.

Coupons

DateDiscountStatus
2/13/2021100% OFF
expired

Charts

Price

Introduction to HTML, CSS, and JavaScript  from scratch - Price chart

Rating

Introduction to HTML, CSS, and JavaScript  from scratch - Ratings chart

Enrollment distribution

Introduction to HTML, CSS, and JavaScript  from scratch - Distribution chart

Related Topics

1995192
udemy ID
10/29/2018
course created date
11/20/2019
course indexed date
Bot
course submited by