Web Devloper LogBook

Thursday, January 2, 2025

Task3: Create a web layout with a header, a footer & a content area containing 3 divs; set the height & width of divs to 100 px(add the previous navbar in the header)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Navigation</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
a{
text-decoration: none;
padding-right: 10%;
}
#navbar{
height: 30px;
background-color: grey;}
button{
background-color: pink;
}
footer{
height: 100px;
position: fixed;
background-color: grey;
text-align: center;
bottom:0;
width: 100%;
}
.contentbox {
height: 100px;
width: 100px;
border: 1px solid black;
display: inline-block;
resize: both;
overflow: auto;
}
</style>
</head>
<body>
<div id="navbar">
<a id="logo" href="#">Template</a>
<a href="#">About us</a>
<a href="#">Contact us</a>
<a href="#">Downloads</a>
<input placeholder="Enter your keyword">
<button>Search</button>
</div>
<div id="content">
<div class="contentbox" id="box1" style="background-color: red; left: 50px; top: 50px;"></div>
<div class="contentbox" id="box2" style="background-color: yellow; left: 200px; top: 50px;"></div>
<div class="contentbox" id="box3" style="background-color: green; left: 350px; top: 50px;"></div>
</div>
<footer>This is footer</footer>

</body>
</html>

Filed in CSS | No comments | January 02, 2025

Wednesday, January 1, 2025

Task2: Create a Traffic Light

Filed in CSS | No comments | January 01, 2025

Task1: Create a nav bar

Lets Write HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Navigation Bar</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="navbar">
<a id="logo">amazon.in</a>
<a href="#">Account</a>
<a href="#">My cart</a>
<a href="#">Contact Us</a>
<input placeholder="search amazon" ><button>Search</button>
</div>
</body>
</html>

Now lets create CSS

padding:0;

margin:0;

color: white;

}

#navbar{

height: 60px;

background-color: #0f1111;

}

button{

background-color: #f08804;}

#logo{

color: #f08804;

font-size: 25px;

}

margin-right:200px;

text-decoration:none ;

}

Filed in CSS | No comments | January 01, 2025

Wednesday, December 25, 2024

Task 8: create a delete page for Task 7

<?php
$sn = $_GET['sn']; // use $_GET instead of $_POST because you're passing sn via the URL
$conn = mysqli_connect('localhost', 'ksumanadhikari', 'welcome', 'task');
$sql = "DELETE FROM data WHERE sn = $sn"; // Potential risk of SQL injection
mysqli_query($conn, $sql);

mysqli_close($conn);

header("location: index.php");
exit();
?>

Filed in PHP_MYSQL | No comments | December 25, 2024

Task 7: You had fetch the data on task 6 now you need to create a file name update.php and update is with new variable.

index.php

<html>
<body>
<?php
$conn=mysqli_connect('localhost','ksumanadhikari','welcome','task');
$sql='select * from data';
$result=mysqli_query($conn,$sql);
?>

<form action="submit.php" method="post">
    <input type="number" name="num">
    <button name="submit">Submit</button>
</form>
<?php
if(mysqli_num_rows($result)>0){
?>
<table border="1">
<tr>
<th>sn</th>
<th>num</th>
</tr>
<?php
while($row=mysqli_fetch_assoc($result)) {
?>
<tr>
<td><?php echo $row['sn'];?></td>
<td><?php echo $row['num'];?></td>
<td><a href='edit.php?sn=<?php echo $row['sn'];?>'>Edit</a></td>
<td><a href='delete.php?sn=<?php echo $row['sn'];?>'>delete</a></td>
</tr>

<?php } ?>
</table>
<?php }else {
    echo "no table found";
    mysqli_close($conn);
    } ?>
</body>
</html>

submit.php

<?php
$conn=mysqli_connect('localhost','ksumanadhikari','welcome','task') or die("margaya madarchood! la la lalalalalalala la la");
$num=$_POST['num'];
$sql="insert into data(num) values('$num')";
mysqli_query($conn,$sql);
header("location: index.php");
exit();
?>

edit.php

<?php
$conn=mysqli_connect('localhost','ksumanadhikari','welcome','task') or die("connection failed");
$sn=$_GET['sn'];
$sql="select * from data where sn='$sn'";
$result=mysqli_query($conn,$sql);

if(mysqli_num_rows($result)>0){
while($row=mysqli_fetch_assoc($result)) {
?>
<form action="update.php" method="post">
<input type="hidden" name="sn" value="<?php echo $row['sn']; ?>" />
Change Number <input type="number" name="num" value="<?php echo $row['num']; ?>" />
<input type="submit" value="Update Data">
</form>
<?php } } ?>

update.php

<?php
$conn=mysqli_connect('localhost','ksumanadhikari','welcome','task') or die("Connection Failed");

$sn=$_POST['sn'];
$num=$_POST['num'];

$sql = "UPDATE data SET num = $num WHERE sn = $sn";
mysqli_query($conn, $sql);

mysqli_close($conn);

header("location: index.php");
exit();
?>

Filed in PHP_MYSQL | No comments | December 25, 2024

Task 6: You have to Edit your Task 5 data using another page named 'edit.php' and you need to make Fetch your changing number will appear on it .

index.php

submit.php

edit.php

<?php
$conn=mysqli_connect('localhost','ksumanadhikari','welcome','task') or die("connection failed");
$sn=$_GET['sn'];
$sql="select * from data where sn='$sn'";
$result=mysqli_query($conn,$sql);

if(mysqli_num_rows($result)>0){
while($row=mysqli_fetch_assoc($result)) {
?>
<form action="update.php" method="post">
SN <input type="number" name="sn" value="<?php echo $row['sn']; ?>" />
Change Number <input type="number" name="num" value="<?php echo $row['num']; ?>" />
<input type="submit" value="Update Data">
</form>
<?php } } ?>

Filed in PHP_MYSQL | No comments | December 25, 2024