Web Development Notes Sem 5 DU DSE
Web Development Notes Sem 5 DU DSE
History:
Features:
Web Design:
Components:
Aesthetic Design:
Layout: The way elements like text, images, and navigation menus
are arranged on the webpage.
Functional Design:
Goals:
Server: A server is a powerful computer that stores and serves web pages
to clients upon request. Servers run web server software (like Apache or
IIS) to manage these requests.
Web Pages:
Static Web Pages: Content is fixed and does not change unless
manually updated by the webmaster. HTML is the primary language
used.
Protocols:
Website Hosting:
Types:
Tools:
Features:
Extensible: HTML can be extended with CSS (for styling) and JavaScript
(for interactivity).
Versions:
HTML5: The latest version, which supports new elements and APIs for
multimedia, graphical content, and interactive applications.
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, ini
tial-scale=1.0">
</head>
<body>
<h1>Welcome to HTML</h1>
<p>This is a paragraph.</p>
</body>
</html>
Tags:
<body> : Contains the content of the web page, including text, images,
and other media.
Lists:
<ol>
<li>First Item</li>
<li>Second Item</li>
</ol>
<ul>
<li>First Item</li>
<li>Second Item</li>
</ul>
<dl>
<dt>HTML</dt>
<dd>Hypertext Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets</dd>
</dl>
Attributes:
href : Specifies the URL of the page the link goes to.
Tables:
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>
Attributes:
Images:
Attributes:
Embedding Audio:
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Embedding Video:
Key Methods:
document.getElementById("demo").innerHTML = "Hello,
document.querySelector(".myClass").style.backgroundC
olor = "yellow";
Variable Declarations:
Syntax:
function addNumbers(a, b) {
return a + b;
Events:
Examples:
document.getElementById("myButton").onclick = functi
on() {
alert("Button clicked!");
};
Loops:
let i = 0;
while (i < 5) {
console.log(i);
i++;
}
Do-While Loop: Similar to the while loop, but the block of code is
executed at least once before the condition is tested.
let i = 0;
do {
console.log(i);
i++;
} while (i < 5);
Example:
Basic Syntax:
<?php
echo "Hello, World!";
?>
Variables:
Example:
$name = "John";
$age = 25;
echo "Name: $name, Age: $age";
Special: NULL.
Operators:
+ (Addition)
(Subtraction)
(Multiplication)
/ (Division)
== (Equal)
!= (Not Equal)
|| (Logical OR)
! (Logical NOT)
Loops:
$i = 0;
while ($i < 5) {
echo $i;
$i++;
}
Do-While Loop: Similar to the while loop, but the block of code is
executed at least once before the condition is tested.
$i = 0;
do {
echo $i;
$i++;
} while ($i < 5);
Syntax:
function greet($name) {
return "Hello, $name";
}
echo greet("John");
GET Method:
Example:
$name = $_GET['name'];
echo "Name: $name";
POST Method:
Example:
$name = $_POST['name'];
echo "Name: $name";
Example:
if (empty($_POST['name'])) {
echo "Name is required.";
} else {
$name = htmlspecialchars($_POST['name']);
echo "Name: $name";
}
Explanation:
Explanation:
method: Defines the HTTP method used to send the form data (POST in
this case).
Explanation:
SQL Query:
PHP Code:
Explanation:
Read:
Explanation:
Update:
Explanation:
Explanation:
Best Practices:
Example:
Explanation:
parameters.
Example:
Explanation:
Inner Join: Combines rows from two or more tables based on a related
column.
Left Join: Returns all rows from the left table, and matched rows from the
right table.
Indexes:
Creating an Index:
Transactions:
Example:
$conn->begin_transaction();
try {
$conn->query("INSERT INTO users (name) VALUES ('Joh
n')");
$conn->query("INSERT INTO orders (user_id, product) V
ALUES (LAST_INSERT_ID(), 'Product1')");
$conn->commit();
} catch (Exception $e) {
$conn->rollback();
echo "Failed: " . $e->getMessage();
}
Explanation:
of an error.