# GTU IT Sem 5 Web Development (WD) Important Questions with Solution | 3151606

Q1. )What is HTTP? How do browser and server communicate using HTTP request and response? Explain with example (7 marks)

OR

Q1. )Explain HTTP Header with example. Explain HTTP request and HTTP response mechanism over the Internet (7 marks)

Ans.

HTTP (Hypertext Transfer Protocol):

HTTP is a protocol used for communication between web browsers and servers. It is the foundation of data communication on the World Wide Web. The communication between a browser and a server occurs through a series of HTTP requests and responses.

1. HTTP Protocol Header (or HTTP Header):

HTTP headers are metadata information sent as part of an HTTP request or response. They provide additional details about the data being transferred and instructions on how it should be handled.

Common components of the HTTP header include:

• Request/Response Line: Specifies whether it's a request or a response, along with the HTTP version.
• Headers: These include additional information about the message, such as:
  • Host: The domain name of the server.
  • User-Agent: Information about the client making the request.
  • Accept: The types of media that the client can process.
  • Content-Type: The media type of the resource in the body of the request or response.
• Cookies: Information stored on the client-side and sent with each subsequent request.

2. HTTP Request:

An HTTP request is a message sent by the client to request a particular action from the server. It comprises several parts:

• Request Line: Specifies the HTTP method (e.g., GET, POST) and the target resource (Uniform Resource Identifier, URI).
• Request Headers: Provide additional information about the request, such as:
  • Accept: The expected content types.
  • Authorization: Credentials for access control.
  • Content-Type: The media type of the request body.
• Request Body (Optional): Some requests, like POST or PUT, may include data in the body. For example, when submitting a form or sending JSON data.

3. HTTP Response:

An HTTP response is a message sent by the server to fulfill the client's request. It also consists of several parts:

• Status Line: Contains the HTTP version, a status code (indicating the result of the request), and a corresponding status message.
• Response Headers: Provide additional information about the response, similar to request headers. Common headers include:
  • Content-Type: The media type of the response body.
  • Content-Length: The size of the response body in bytes.
  • Server: Information about the server software.
• Response Body (Optional): Contains the requested data or a message. For example, HTML content for a web page or JSON data.

Q2.) Differentiate GET and POST methods. (4 marks)

Q3.) Explain JSON with example. (4 marks)

JSON, or JavaScript Object Notation, is a text-based data format that represents structured data in a key-value pair format. JSON is often used to transmit data between a server and a web application, as well as for configuration files and data storage.

• JSON is language-independent
• JSON is easy for humans to read and write
• It is a common data format for exchanging information between web servers and clients
• JSON is commonly used for data serialization, allowing the conversion of complex data structures, such as objects and arrays, into a plain text format.

Example:

{
  "name": "John Doe",
  "age": 30,
  "city": "New York"
}

Q4.) Explain pop-up boxes in Java-Script with example

OR

Q4.) Discuss Java script alert, prompt, confirm with example.

JavaScript provides three types of pop-up boxes that are commonly used for interacting with users: alert, confirm, and prompt. These pop-up boxes are modal, meaning they pause the execution of the script until the user interacts with them.

Pop-up Boxes in JavaScript:

JavaScript provides three types of pop-up boxes that are commonly used for interacting with users: alert, confirm, and prompt. These pop-up boxes are modal, meaning they pause the execution of the script until the user interacts with them.

1. alert Box:

   • The alert box is used to display a message to the user. It provides an OK button for the user to acknowledge the message.

   Example:

   alert("This is an alert box!");

2. confirm Box:

   • The confirm box is used to ask the user for confirmation. It displays a message and provides OK and Cancel buttons.

   Example:

   var userConfirmation = confirm("Do you want to proceed?");
   if (userConfirmation) {
     console.log("User clicked OK.");
   } else {
     console.log("User clicked Cancel.");
   }

3. prompt Box:

   • The prompt box is used to prompt the user to enter some input. It displays a message, an input field, and OK and Cancel buttons.

   Example:

   var userInput = prompt("Please enter your name:", "John Doe");
   if (userInput !== null) {
     console.log("User entered: " + userInput);
   } else {
     console.log("User clicked Cancel.");
   }

Q5.) Differentiate Cookie and Session

OR

Q5.) Explain cookie in PHP with the help of example (7 marks)

Cookies are small pieces of data stored on the client's browser, enabling websites to remember user information or preferences across multiple requests. In PHP, you can set, retrieve, and manage cookies using the setcookie() function.

Example:

<?php
// Set a cookie with user preferences
$cookieName = "user_preferences";
$cookieValue = "dark_mode";
$expirationTime = time() + (86400 * 30); // Cookie valid for 30 days

setcookie(<math>cookieName, </math>cookieValue, $expirationTime, "/");

// Check if the cookie is set and retrieve its value
if (isset(<math>_COOKIE[</math>cookieName])) {
    <math>userPreference = </math>_COOKIE[$cookieName];
    echo "User Preference: $userPreference";
} else {
    echo "Cookie not set. Set user preferences.";
}
?>

Retrieving a Cookie:

To retrieve a cookie in PHP, we can use the $_COOKIE superglobal. Like this:

<?php
// Name of the cookie to retrieve
$cookieName = "user_preferences";

// Check if the cookie is set
if (isset(<math>_COOKIE[</math>cookieName])) {
    // Retrieve the value of the cookie
    <math>userPreference = </math>_COOKIE[$cookieName];
    echo "User Preference: $userPreference";
} else {
    echo "Cookie not set. Set user preferences.";
}
?>

Q6.) Explain Array in PHP with example.

OR

Q6.) Describe any four php array function

OR

Q6.) List and explain different types of array in PHP with example.

Array in PHP:

In PHP, an array is a data structure that allows you to store and manipulate multiple values under a single variable name.

Types of Arrays:

1. Indexed Array:

   • An array with numeric keys. Elements are accessed using numeric indices.

   $colors = array("Red", "Green", "Blue");
   echo <math>colors[1]; // Access the element at index 1 in the </math>colors array

2. Associative Array:

   • An array where each element has a named key. Elements are accessed using key names.

   $student = array("name" => "Alice", "age" => 22, "grade" => "A");
   echo <math>student["age"]; // Access the value associated with the key "age" in the </math>person array

3. Multidimensional Array:

   • An array containing one or more arrays. Useful for creating matrices or nested data structures.

   $matrix = array(
       array(1, 2, 3),
       array(4, 5, 6),
       array(7, 8, 9)
   );
   echo <math>matrix[2][1]; // Access the element at row 2, column 1 in the </math>matrix array

Array Functions:

1. count() Function:

   • Returns the number of elements in an array.

   <math>count = count(</math>fruits); // Returns the number of elements in $fruits

2. array_push() Function:

   • Adds one or more elements to the end of an array.

   array_push($colors, "Yellow", "Orange");

3. array_pop() Function:

   • Removes and returns the last element of an array.

   <math>lastColor = array_pop(</math>colors);

4. array_merge() Function:

   • Merges two or more arrays into a single array.

   <math>mergedArray = array_merge(</math>fruits, $colors);

Q7.) Demonstrate session handling in PHP with example

OR

Q7.) Write a note on session in PHP.

Session handling in PHP allows you to persist data across multiple pages for a specific user. Sessions are often used to store user authentication information, user preferences, or other temporary data.

<?php
// Start a session
session_start();

// Set session variables
$_SESSION['user_id'] = 123;
$_SESSION['username'] = 'john_doe';

// Access session variables
<math>userID = </math>_SESSION['user_id'];
<math>username = </math>_SESSION['username'];

// Display session data
echo "User ID: $userID<br>";
echo "Username: $username";

// Destroy the session (for demonstration purposes, you might not want to do this on every page)
session_destroy();
?>

1. session_start():
   • Initiates a new or resumes an existing session.
2. Setting Session Variables:
   • <math>_SESSION['user_id'] and </math>_SESSION['username'] are used to store user-related data in the session.
3. Accessing Session Variables:
   • <math>userID and </math>username retrieve the values stored in the session variables.
4. Displaying Session Data:
   • echo statements are used to display the session data on the page.
5. session_destroy():
   • Destroys the current session. In a real-world scenario, you might not want to destroy the session on every page; it's done here for demonstration purposes.

Q8.) Define term: JQUERY

OR

Q8.) What are the selectors in jQuery? How many types of selectors in jQuery? Explain it in detail.

1. Definition:
   • jQuery is a fast and lightweight JavaScript library.
2. DOM Manipulation:
   • Simplifies DOM manipulation, making it easier to select and modify HTML elements.
3. Event Handling:
   • Provides a concise syntax for attaching event handlers to respond to user interactions.

Example -

$("#myElement").text("Hello, jQuery!");

Selectors in jQuery:

In jQuery, selectors are used to target and manipulate HTML elements.

Types of Selectors in jQuery:

1. Element Selector:

   • Selects HTML elements based on their tag name.

   $("p"); // Selects all <p> elements

2. ID Selector:

   • Selects a single element with a specific ID.

   $("#myId"); // Selects the element with the ID "myId"

3. Class Selector:

   • Selects all elements with a specific class.

   $(".myClass"); // Selects all elements with the class "myClass"

4. Attribute Selector:

   • Selects elements based on the presence or value of their attributes.

   $("[type='text']"); // Selects all elements with the attribute type equal to "text"

5. Multiple Selector:

   • Selects multiple elements using a comma-separated list of selectors.

   $("p, div, .myClass"); // Selects all <p> elements, <div> elements, and elements with class "myClass"

6. First Selector:

   • Selects the first element that matches the selector.

   $("p:first"); // Selects the first <p> element

7. Last Selector:

   • Selects the last element that matches the selector.

   $("p:last"); // Selects the last <p> element

Q9.) How many types of list are supported by HTML? Explain each one in brief

OR

Q9.) Explain ordered and unordered list with example.

HTML supports three main types of lists: ordered lists (<ol>), unordered lists (<ul>), and definition lists (<dl>).

1. Ordered List (<ol>):

   • An ordered list is used to create a list of items in a specific order or sequence. Each list item is marked with a numerical or alphabetical identifier.

   <ol>
     <li>First item</li>
     <li>Second item</li>
     <li>Third item</li>
   </ol>

   Output:

   1. First item
   2. Second item
   3. Third item

2. Unordered List (<ul>):

   • An unordered list is used to create a list of items without any specific order. Each list item is typically marked with a bullet point or other marker.

   <ul>
     <li>Apple</li>
     <li>Orange</li>
     <li>Banana</li>
   </ul>

   Output:

   • Apple
   • Orange
   • Banana

3. Definition List (<dl>):

   • A definition list is used to create a list of terms and their corresponding definitions. It consists of a series of term-description pairs using <dt> for terms and <dd> for descriptions.

   <dl>
     <dt>HTML</dt>
     <dd>HyperText Markup Language</dd>
     <dt>CSS</dt>
     <dd>Cascading Style Sheets</dd>
   </dl>

   Output:

   • HTML
     • HyperText Markup Language
   • CSS
     • Cascading Style Sheets

What is meta tag? How it is useful by search engine?

Meta Tag in HTML:

A <meta> tag in HTML is used to provide metadata or additional information about the document. Metadata includes information such as character encoding, viewport settings, keywords, and descriptions. The <meta> tag is placed within the <head> section of an HTML document.

Usefulness for Search Engines:

1. Improved Search Engine Rankings:
   • Search engines may use the information provided in meta tags, such as the description and keywords, to understand the content of a webpage.
2. Enhanced Click-Through Rates:
   • A well-crafted meta description can serve as a concise and compelling summary of the page's content. This may increase the likelihood of users clicking on the link when it appears in search results.
3. Character Encoding Information:
   • The character encoding specified in the <meta charset> tag ensures that the browser and search engines interpret the text correctly.

Example -

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="This is a sample webpage" />
    <meta name="keywords" content="HTML, CSS, Metadata" />
    <title>Sample Webpage</title>
  </head>
</html>

1. <meta charset="UTF-8">:
   • Specifies the character encoding of the HTML document as UTF-8.
2. <meta name="viewport" content="width=device-width, initial-scale=1.0">:
   • Defines viewport settings for responsive web design, ensuring the webpage adapts to various device widths and sets the initial zoom level to 1.0.
3. <meta name="description" content="This is a sample webpage">:
   • Provides a brief description of the webpage's content, potentially used by search engines in search result snippets.
4. <meta name="keywords" content="HTML, CSS, Metadata">:
   • Specifies keywords related to the webpage content; historically used by search engines, but less influential today.

Q 10.) What is CSS? Explain different types of CSS. Explain Class and ID selector and Pseudo class.

CSS (Cascading Style Sheets):

• Definition: CSS is a styling language used for describing the presentation of a document written in HTML or XML.
• Purpose: It is used to enhance the visual presentation of web pages, making them more attractive and user-friendly.

Three Types of CSS:

1. Inline CSS:

   • Applied directly to the HTML element using the style attribute.

   <p style="color: blue;">This is a blue paragraph.</p>

2. Internal (Embedded) CSS:

   • Defined within the <style> tag in the HTML document's <head> section.

   <style>
     p {
       color: red;
     }
   </style>

3. External CSS:

   • Defined in a separate external CSS file and linked to the HTML document.

   <!-- In the HTML document -->
   <link rel="stylesheet" type="text/css" href="styles.css" />
   
   <!-- In the external CSS file (styles.css) -->
   p { font-size: 16px; }

Class, ID, and Pseudo-Selector:

• Class Selector (.):
  • Targets elements with a specific class attribute. css .highlight { background-color: yellow; }
• ID Selector (`#):
  • Targets a specific element with a unique ID attribute. css #header { font-size: 20px; }
• Pseudo-Selector:
  • Selects elements based on their state or position. css a:hover { color: purple; }

CSS Positioning:

• CSS positioning is used to control the layout and positioning of elements on a webpage.
  • Static Positioning:
    • Default positioning; elements are positioned according to the normal flow of the document.
  • Relative Positioning:
    • Positioned relative to its normal position.
  • Absolute Positioning:
    • Positioned relative to the nearest positioned ancestor (if any), otherwise, relative to the initial containing block.
  • Fixed Positioning:
    • Positioned relative to the browser window and will not move even if the page is scrolled.
  • Sticky Positioning:
    • Acts like a combination of relative and fixed positioning, depending on the scroll position.

Important Programs

1. Write PHP program to store user registration with mysql database
2. Write a JavaScript code to find whether given number is prime or not
3. Write a PHP program to store student registration (studentname, address, Date of Birth, age, Aadhar card number, semester) with MySQL database
4. Write a PHP program to find whether entered year is leap year or not
5. Write a code to validate user input using jQuery
6. Develop a PHP Code which read employee code, year and month. On submit button press, it generates salary slip for that month-year for that employee (Refer W21 Paper Solution)
7. Prepare a PHP Code to read and write content from File (Refer W21 Paper Solution)
8. Write a java script code to find whether given number is prime or not (Refer W22 Paper Solution)
9. Any program using session like - Prepare a PHP Code to manage online shopping cart using session
10. Develop a web page which contains two list box. First list ask to select State and according to state selection second list box loads name of city. Develop it using AJAX (Refer W21 Paper Solution)