Front-End Web Development
Categories: Computer Science
About Course
Welcome to the Front-End Web Development course! In this comprehensive program, you’ll delve into the exciting world of building dynamic and interactive websites. Whether you’re a complete beginner or looking to refine your skills, this course is designed to equip you with the knowledge and tools needed to thrive in the ever-evolving field of web development.
Before we dive in, I’d like to express my gratitude to the talented creators whose videos have been incorporated into this course. Special thanks to:
Dave Gray
The Minimal Jess
SuperSimpleDev
Their invaluable contributions have enriched the learning experience, and I encourage you to explore their channels, like, and follow their content to further enhance your understanding of front-end development.
Are you ready to embark on this exciting journey? Without further ado, let’s dive in.
What Will You Learn?
- HTML Basics:
- Introduction to HTML (HyperText Markup Language)
- Understanding HTML tags and structure
- Creating lists, links, images, tables, and forms in HTML
- Implementing semantic HTML for better accessibility and SEO
- CSS Basics:
- Introduction to CSS (Cascading Style Sheets)
- Working with CSS selectors, colors, units, and sizes
- Understanding the CSS box model for layout design
- Styling text, fonts, lists, and backgrounds
- Implementing CSS layouts using Flexbox and Grid systems
- Creating responsive designs with media queries and custom variables
- JavaScript Basics:
- Introduction to JavaScript
- Linking JavaScript to HTML
- Working with JavaScript data types, variables, and operators
- Using control structures like if statements, switch statements, and loops
- Understanding functions, arrays, objects, and classes in JavaScript
- Manipulating the Document Object Model (DOM) with JavaScript
- Handling events and user input with event listeners
- Working with browser storage using LocalStorage and Session Storage API
- Building interactive projects and games using JavaScript
- Throughout this course, you'll not only learn the technical aspects of front-end development but also essential soft skills such as problem-solving, attention to detail, time management, communication, teamwork, adaptability, and critical thinking.
Course Content
Soft Skills for Professional Development
-
Developing Personal Skills
00:00 -
Soft Skills
00:00
Front-end development
It's great to have you here. Front-end development focuses on creating the visual and interactive parts of websites and web applications. Using languages like HTML, CSS, and JavaScript, front-end developers build the user interface that people see and interact with directly in their web browsers. It's all about making websites look good and work smoothly for users. Let's dive in together!
-
Introduction to front-end development
10:10 -
Introduction to Front-End Development
-
What Does a Front-End Web Developer Do?
18:15 -
Web development road map for beginners
00:59
HTML Basics
-
Introduction to HTML (HyperText Markup Language)
20:20 -
Head Tag in HTML
09:32 -
HTML Tag Text Basics
21:25 -
HTML Lists
10:51 -
Adding Links in HTML code
31:25 -
Inserting Images in HTML
31:01 -
Semantic HTML Tags
24:37 -
Creating Tables in HTML
16:30 -
HTML Forms and Inputs
45:18 -
HTML5 Website Project for Beginners | First HTML Project
42:54
CSS Basics
-
Introduction to CSS
14:47 -
CSS Selectors
20:33 -
CSS Colors
17:14 -
CSS Units & Sizes
21:24 -
CSS Box Model
25:55 -
CSS Text and Fonts
24:03 -
Styling hypertext links in CSS
16:51 -
CSS List Styles
16:37 -
CSS Display Property
16:00 -
CSS Floats and Clears
13:07 -
CSS Columns
22:26 -
CSS Position Property
24:07 -
CSS Flexbox Intro
24:28 -
CSS Grid Intro and Basic Layout
25:37 -
CSS Background Images and Responsive Image Properties
46:49 -
CSS Media Queries & Responsive Web Design
27:02 -
CSS Custom Variables & Dark Mode
28:14 -
CSS Mini-Project
13:16
JAVASCRIPT Basics
-
Introduction to Javascript
08:00 -
Linking Javascript to HTML
07:52 -
JavaScript String Methods and Properties
07:19 -
JavaScript Numbers, Number Methods, isNaN
06:01 -
Math Methods and How to Generate a Random Number with JavaScript
05:23 -
Problem Solving with Code
07:32 -
If Statements in Javascript
06:34 -
Switch Statements in JavaScript
03:37 -
Ternary Operator in Javascript
05:28 -
User Input in Javascript
10:29 -
JavaScript Loop
16:20 -
Functions in Javascript
12:17 -
Arrays in Javascript
28:47 -
Javascript Objects
23:16 -
Javascript Classes
31:18 -
JSON
07:12 -
Javascript Error Handling
15:03 -
JavaScript DOM (Document Object Model)
35:39 -
Event Listeners in JavaScript
39:32 -
JavaScript LocalStorage and Session Storage API
19:00 -
Your First Javascript Game
16:17
Final Project
-
Personal Portfolio Website
00:00 -
Quiz project
Student Ratings & Reviews
No Review Yet