A-Z HTML, CSS and JS in 2 Minutes

Here we go👇

HTML

1.Document Structure •

<!DOCTYPE> • <html> • <head> • <title> • <meta> • <link> • <script> • <noscript>

2.Text Content • <h1>, <h2>, <h3>, <h4>, <h5>, <h6> • <p> • <span> • <strong> • <em> • <br> • <hr>

3.Lists • <ul> • <ol> • <li> • <dl> • <dt> • <dd>

4.Links and Navigation • <a> • <nav> • <link>

5.Embedded Content • <img> • <audio> • <video> • <iframe> • <canvas> • <svg>

6.Forms • <form> • <input> • <textarea> • <button> • <select> • <option> • <label> • <fieldset> • <legend> • <datalist> • <output>

7.Tables • <table> • <tr> • <th> • <td> • <caption>

8.Semantic Elements • <article> • <section> • <header> • <footer> • <aside> • <main> • <figure> • <figcaption> • <mark> • <progress> • <time> • <details> • <summary>

9.Deprecated Elements (Avoid Using) • <center> • <font> • <strike>

CSS

1. Box Model • width • height • margin • padding • border • box-sizing

2. Positioning • position • top • right • bottom • left • float • clear • z-index

3. Typography • font-family • font-size • font-weight • font-style • color • line-height • letter-spacing • text-align • text-decoration • text-transform

4. Visual Formatting • background-color • background-image • background-repeat • background-position • background-size • color • display • visibility • overflow • opacity

5. Flexbox • display: flex; • flex-direction • justify-content • align-items • align-self • flex

6. Grid Layout • display: grid; • grid-template-columns • grid-template-rows • grid-column • grid-row • grid-gap • grid-area

7. Transforms and Animations • transform • transition • animation

8. Others • cursor • list-style • outline • user-select • pointer-events

avaScript

1.Variables • var • let • const

2. Data Types • number • string • boolean • null • undefined • symbol

3.Declaring variables • var • let • const

4.Expressions Primary expressions • this • Literals • [] • {} • function • class • function* • async function • async function* • /ab+c/i • string • ( ) Left-hand-side expressions • Property accessors • ?. • new • new .target • import.meta • super • import()

5.operators • Arithmetic Operators: +, -, *, /, % • Comparison Operators: ==, ===, !=, !==, <, >, <=, >= • Logical Operators: &&, ||, !

6.Control Structures • if • else if • else • switch • case • default

7.Iterations/Loop • do...while • for • for...in • for...of • for await...of • while

8.Functions • Arrow Functions • Default parameters • Rest parameters • arguments • Method definitions • getter • setter

9.Objects and Arrays • Object Literal: { key: value } • Array Literal: [element1, element2, ...] • Object Methods and Properties • Array Methods: push(), pop(), shift(), unshift(), splice(), slice(), forEach(), map(), filter()

10.Classes and Prototypes • Class Declaration • Constructor Functions • Prototypal Inheritance • extends keyword • super keyword • Private class features • Public class fields • static • Static initialization blocks

11.Error Handling • try • catch • finally (exception handling)

ADVANCED CONCEPTS--------------------------

12.Closures • Lexical Scope • Function Scope • Closure Use Cases

13.Asynchronous JavaScript • Callback Functions • Promises • async/await Syntax • Fetch API • XMLHttpRequest

14.Modules • import and export Statements (ES6 Modules) • CommonJS Modules (require, module.exports)

15.Event Handling • Event Listeners • Event Object • Bubbling and Capturing

16.DOM Manipulation • Selecting DOM Elements • Modifying Element Properties • Creating and Appending Elements

17.Regular Expressions • Pattern Matching • RegExp Methods: test(), exec(), match(), replace()

18.Browser APIs • localStorage and sessionStorage • navigator Object • Geolocation API • Canvas API

19.Web APIs • setTimeout(), setInterval() • XMLHttpRequest • Fetch API • WebSockets

20.Functional Programming • Higher-Order Functions • map(), reduce(), filter() • Pure Functions and Immutability

21.Promises and Asynchronous Patterns • Promise Chaining • Error Handling with Promises • Async/Await

22.ES6+ Features • Template Literals • Destructuring Assignment • Rest and Spread Operators • Arrow Functions • Classes and Inheritance • Default Parameters • let, const Block Scoping

23.Browser Object Model (BOM) • window Object • history Object • location Object • navigator Object

24.Node.js Specific Concepts • require() • Node.js Modules (module.exports) • File System Module (fs) • npm (Node Package Manager)

25.Testing Frameworks • Jasmine • Mocha • Jest

------------------- END -------------------

Good resources learn Html, Css and Js

HTML

1.MDN https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics…

2.W3Schools https://w3schools.com/html/

3.Codecademy https://codecademy.com/learn/learn-html…

4.freeCodeCamp https://freecodecamp.org/learn/

5. YouTube - The Net Ninja's https://youtube.com/watch?v=UB1O30fR-EE…

CSS