R20 Regualtion mern stack answer

Unit-1

1. > Explain in detailed about List tag in HTML?

The <list> tag in HTML is used to create an unordered list of items. It allows you to display a set of related items in a structured manner. The syntax for the <list> tag is as follows:

<ul>

</ul>

The <ul> tag defines an unordered list and the <li> tag defines each item in the list. The text inside the <li> tags represents the content of each list item.

There are also other types of lists that can be created using the type attribute. The type attribute can have the following values:

* disc (default): creates a disc (a solid circle) as the bullet point for each list item

* circle: creates an open circle as the bullet point for each list item

* square: creates a square as the bullet point for each list item

* none: removes the bullet point from each list item

</ul>

In addition to the type attribute, the <list> tag also has the start attribute, which specifies the starting number for the first item in the list.

</ul>

Lists can also be nested, which means you can have a list inside another list. To do this, simply add another <ul> or <ol> tag inside an <li> tag.

<ul>

<li>Item 1

<ul>

<li>Subitem 1</li>

<li>Subitem 2</li>

</ul>

</li>

</ul>

2.> Explain in detailed about Form elements: Text field, password, radio button, Check box?

The <form> element is a container for different types of input elements, such as: text fields, checkboxes, radio buttons, submit buttons, etc.

<form>

form elements

</form>

An <input> element can be displayed in many ways, depending on the type attribute.

Text Fields

The <input type="text"> defines a single-line input field for text input.

Input Type Password

<input type="password"> defines a password field:

Radio Buttons

The <input type="radio"> defines a radio button.

Radio buttons let a user select ONE of a limited number of choices.

Checkboxes

The <input type="checkbox"> defines a checkbox.

Checkboxes let a user select ZERO or MORE options of a limited number of choices.

<form>

<label>Email Id:</label><br>

<label>Password:</label><br>

</form>

3.> Explain in detailed about table tag in HTML

HTML table tag is used to display data in tabular form (row * column). There can be many columns in a row.

We can create a table to display data in tabular form, using <table> element, with the help of <tr> , <td>, and <th> elements.

In Each table, table row is defined by <tr> tag, table header is defined by <th>, and table data is defined by <td> tags.

HTML tables are used to manage the layout of the page e.g. header section, navigation bar, body content, footer section etc.

<table>

<tr><th>First_Name</th><th>Last_Name</th><th>Marks</th></tr>

<tr><td>Sonoo</td><td>Jaiswal</td><td>60</td></tr>

<tr><td>James</td><td>William</td><td>80</td></tr>

<tr><td>Swati</td><td>Sironi</td><td>82</td></tr>

<tr><td>Chetna</td><td>Singh</td><td>72</td></tr>

</table>

4.> Explain in detailed about Form elements: date picker, drop down lists, range

The <input type="date"> defines a date picker.

The resulting value includes the year, month, and day.

<label for="birthday">Birthday:</label>

We define a Drop-Down List By using the <select> Element in the Document. This tag is used to create a drop-down list. The <select> tag contains <option> tag to display the available option of drop-down list.

Data Structure

</option>

</select>

The <input type="range"> defines a control for entering a number whose exact value is not important

Default range is 0 to 100. However, you can set restrictions on what numbers are accepted with the attributes below.

max - specifies the maximum value allowed

min - specifies the minimum value allowed

step - specifies the legal number intervals

value - Specifies the default value

4.>write about HTML injection, clickjacking.

HTML Injection:

HTML injection is a web security vulnerability that allows an attacker to inject malicious code into a website or web application. HTML injection can occur when user input is not properly validated or sanitized before being included in an HTML page. This can lead to the execution of arbitrary code, theft of sensitive data, or the redirection of users to malicious websites.

Clickjacking:

Clickjacking is a web security vulnerability that tricks a user into clicking on a button or link on a web page without their knowledge or consent. Clickjacking attacks typically involve overlaying an invisible or disguised element on top of a legitimate button or link. When the user clicks on the disguised element, they unknowingly trigger the action associated with the underlying button or link. Clickjacking attacks can be used to steal user credentials, install malware, or carry out other malicious actions.

5.> Explain Table Elements : Colspan/ Rowspan Attributes, border, cellspacing and cellpadding attributes,

To make a cell span over multiple columns, use the colspan attribute:

<table>

<tr>

</tr>

<tr>

<td>Smith</td>

</tr>

<tr>

<td>Jackson</td>

</tr>

</table>

To make a cell span over multiple rows, use the rowspan attribute:

<table>

<tr>

</tr>

<tr>

<th rowspan="2">Phone</th>

</tr>

<tr>

</tr>

</table>

Border Attribute:

The border attribute is used to add a border to a table or a cell. The value of this attribute specifies the width of the border in pixels. For example, if you set the border attribute to 1, a 1-pixel border will be added to the table or the cell.

Cellspacing and Cellpadding Attributes:

The cellspacing attribute specifies the amount of space between two cells in a table. It is used to create gaps between cells. The cellpadding attribute specifies the amount of space between the cell content and the cell border. It is used to create space between the cell content and the cell border.

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

Unit - 2

1.> explain arrow function in javascript

Arrow function is one of the features introduced in the ES6 version of JavaScript. The Arrow Functions in JavaScript helps us to create anonymous functions or methods i.e. functions without name. As they do not have any names, the arrow makes the syntax shorter.

let sum = (a, b) => {

let result = a + b;

return result;

}

let result1 = sum(5,7);

console.log(result1); // 12

2.> demonstrate the implementation of inheritance in javascript

To create a class inheritance, use the extends keyword.

A class created with a class inheritance inherits all the methods from another class:

The super() method refers to the parent class.

By calling the super() method in the constructor method, we call the parent's constructor method and gets access to the parent's properties and methods.

class Car {

constructor(brand) {

this.carname = brand;

}

present() {

return 'I have a ' + this.carname;

}

class Model extends Car {

constructor(brand, mod) {

super(brand);

this.model = mod;

}

show() {

return this.present() + ', it is a ' + this.model;

}

let myCar = new Model("Ford", "Mustang");

document.getElementById("demo").innerHTML = myCar.show();

3.> Explain event handling in javascript

Event handlers typically have names that begin with on, for example, the event handler for the click event is onclick.

To assign an event handler to an event associated with an HTML element, you can use an HTML attribute with the name of the event handler.

When you assign JavaScript code as the value of the onclick attribute, you need to escape the HTML characters such as ampersand (&), double quotes ("), less than (<), etc., or you will get a syntax error.

function showAlert() {

alert('Clicked!');

}

</script>

4.> illustrate cloning and combining objects in javascript

In JavaScript, there are different ways to clone and combine objects, depending on the use case and desired outcome. Here are some examples:

Shallow cloning an object using the spread operator:

const obj1 = { a: 1, b: 2 };

const obj2 = { ...obj1 };

console.log(obj2); // { a: 1, b: 2 }

Deep cloning an object using JSON.parse() and JSON.stringify():

const obj1 = { a: 1, b: { c: 2 } };

const obj2 = JSON.parse(JSON.stringify(obj1));

console.log(obj2); // { a: 1, b: { c: 2 } }

Combining objects using the spread operator:

const obj1 = { a: 1 };

const obj2 = { b: 2 };

const obj3 = { ...obj1, ...obj2 };

console.log(obj3); // { a: 1, b: 2 }

Combining objects using Object.assign():

const obj1 = { a: 1 };

const obj2 = { b: 2 };

const obj3 = Object.assign({}, obj1, obj2);

console.log(obj3); // { a: 1, b: 2 }

5. > Explain Browser and Document Object Model

The Browser Object Model (BOM) refers to the set of objects and methods that are exposed by the web browser itself. This includes things like the window object, which represents the current browser window or tab, and provides access to properties such as the current URL, the history of visited pages, and methods for displaying alerts or prompts to the user.

The Document Object Model (DOM) is a programming interface that allows scripts to dynamically access and update the content and structure of a web page. The DOM is a hierarchical tree-like structure that represents the HTML elements, attributes, and text content of a web page. Each element in the DOM is represented by a node object, which has properties such as childNodes, parentNode, attributes, and methods for manipulating the element's content, style, or event listeners.

Unit - 3

1.> what are the need and capabilities of node-js?

Node.js provides developers with a high-performance, cross-platform, and efficient environment to build scalable network applications with ease. Its rich package ecosystem and single programming language make it an excellent choice for developers looking to build complex applications quickly.

High-performance: Node.js is designed to handle a large number of simultaneous connections with high efficiency and low overhead. It uses an event-driven, non-blocking I/O model that makes it ideal for building scalable network applications.

Cross-platform: Node.js runs on various platforms such as Windows, macOS, and Linux. This makes it an ideal choice for developers who work across multiple platforms.

Huge package ecosystem: Node.js has a vast library of open-source modules and packages that can be easily installed and used in your project using the npm (Node Package Manager). This saves time and effort and makes it easier to build complex applications quickly.

Single programming language: Node.js uses JavaScript as its primary language, which means that developers can use the same language for both the front-end and back-end of their applications. This helps to simplify the development process and reduce the learning curve.

Real-time applications: Node.js is ideal for building real-time applications such as chat applications, gaming applications, and streaming services. This is due to its ability to handle multiple connections and events simultaneously.

2.> Illustrate the features of node-js

Features of Node.js is

Event-driven and non-blocking I/O model: Node.js uses an event-driven, non-blocking I/O model that allows it to handle multiple connections and events simultaneously. This makes it highly scalable and efficient, as it can handle a large number of requests without causing delays or blocking the server.

Cross-platform: Node.js runs on various platforms such as Windows, macOS, and Linux. This makes it an ideal choice for developers who work across multiple platforms.

Single-threaded: Node.js is single-threaded, but it can handle multiple concurrent requests using event loops and callbacks. This allows it to handle a large number of requests without consuming a lot of system resources.

NPM (Node Package Manager): Node.js has a vast library of open-source modules and packages that can be easily installed and used in your project using the npm (Node Package Manager). This saves time and effort and makes it easier to build complex applications quickly.

Asynchronous programming: Node.js supports asynchronous programming, which means that developers can write code that doesn't block the main thread and allows other tasks to be executed while waiting for a response from a database or network.

Fast execution: Node.js uses the V8 JavaScript engine from Google Chrome, which is optimized for fast execution. This makes Node.js highly performant and efficient.

R20 Regualtion mern stack answer

Contact Form