Learning Web developement

 HTML:

http://www.simplehtmlguide.com/cheatsheet.php

CSS :  

PADDING: It is the space between border and the content.

MARGIN: It is teh space outside the border.

* means evrything

*{

    margin : 0;

    padding: 0;

}

/* will reset the changes made */

What are Semantic Elements?

A semantic element clearly describes its meaning to both the browser and the developer.

Examples of non-semantic elements: <div> and <span> - Tells nothing about its content.

Examples of semantic elements: <form>, <table>, and <article> - Clearly defines its content.

The HTML DOM (Document Object Model)

When a web page is loaded, the browser creates a Document Object Model of the page.

The HTML DOM model is constructed as a tree of Objects:

With the object model, JavaScript gets all the power it needs to create dynamic HTML:

• JavaScript can change all the HTML elements in the page
• JavaScript can change all the HTML attributes in the page
• JavaScript can change all the CSS styles in the page
• JavaScript can remove existing HTML elements and attributes
• JavaScript can add new HTML elements and attributes
• JavaScript can react to all existing HTML events in the page
• JavaScript can create new HTML events in the page

Difference between id and class attribute: The only difference between them is that “id” is unique in a page and can only apply to at most one element, while “class” selector can apply to multiple elements.

HTML id and class attributes identify an element in an HTML document. This is useful for applying styles and manipulating an element with DOM and JavaScript. This happens when the value of id attribute of an HTML element matches the name of id, either in CSS or in a script (e.g. JavaScript)

CSS Section:

The two main types of length units are absolute and relative. Absolute units tie to physical units of length. For example, in and mm refer to inches and millimeters, respectively. Absolute length units approximate the actual measurement on a screen, but there are some differences depending on a screen's resolution.

Relative units, such as em or rem, are relative to another length value. For example, em is based on the size of an element's font. If you use it to set the font-size property itself, it's relative to the parent's font-size.

Javascript section:

MDN: Mozilla developer network best documentation for javascript!

let: It allows to change value

const : vvalue cant be changes one assigned!!!

///////// ECMAScript is a general-purpose programming language, standardized by Ecma International according to the document ECMA-262. It is a JavaScript standard meant to ensure the interoperability of Web pages across different Web browsers

---????? http://kangax.github.io/

Jsbin - online compiler for javascript

----->>>>>>>>>

== : Equality operator

=== : Identity operator

Demo 1

 

1==”1″ // it will return true because here-string will be converted as number

1 === “1” // it will return false because here 1 is number and “1” is string

 

Demo 2

 

0 == false // it will return true because here false is equivalent to 0

0 === false // it will return false because both are different operands

"This"  keyword refers to current object!!!

if Todo is an object:

 to acees a property in it we use Todo.thatobject

to access a function we use Todo.thatobject()

--->>>>>>flexbox deals with the row or column

-->>>>>CSS Grid deals with row and column

Arrow function : represented in =>

const todos = [{

    title: 'Buy Goods',

    isDone: true,

},

{

    title: 'Buy bOOKS',

    isDone: true,

},

{

    title: 'SELECT APPOUINMENT',

    isDone: false,

}]

//filter : it filter those element where isDone is true;

// => represents arrow function we can use  {} & but no "function" keyword!!!

const ThingsDone = todos.filter((todo) => todo.isDone === true)

console.log(ThingsDone);

//Values that are interpreted as false:

false

0

''

null

undefined

What is a Callback Function?

In JavaScript, functions are objects. Can we pass objects to functions as parameters? Yes.

So, we can also pass functions as parameters to other functions and call them inside the outer functions. Sounds complicated? Let me show that in an example below:

function print(callback) {  
    callback();
}

The print( ) function takes another function as a parameter and calls it inside. This is valid in JavaScript and we call it a “callback”. So a function that is passed to another function as a parameter is a callback function. But that’s not all.

ECMA SCRIPT: ITS A CLIENT SIDE STANDARD TO BE FOLLOWED BY ALL THE CLIENT SIDE SCRIPTING LANGUAGES LIKE JAVASCRIPT, ACTION SCRIPT etc.

Ecma is a standards organization for information and communication systems. It acquired its current name in 1994, when the European Computer Manufacturers Association (ECMA) changed its name to reflect the organization's global reach and activities.

--> Using const is safer than using var, because a function expression is always a constant value.

Arrow function:

// ES5
var x = function(x, y) {
   return x * y;
}

// ES6
const x = (x, y) => x * y;

Imp:

A JavaScript class is not an object.

It is a template for JavaScript object.

JavaScript Promise Object

A JavaScript Promise object contains both the producing code and calls to the consuming code:

Promise Syntax

let myPromise = new Promise(function(myResolve, myReject) {
// "Producing Code" (May take some time)

  myResolve(); // when successful
  myReject();  // when error
});

// "Consuming Code" (Must wait for a fulfilled Promise)
myPromise.then(
  function(value) { /* code if successful */ },
  function(error) { /* code if some error */ }
);