0% found this document useful (0 votes)
0 views

php

This document outlines a micro-project focused on developing a To-Do List web application using PHP, HTML, CSS, JavaScript, and MySQL, submitted for a Diploma in Computer Technology. The application allows users to manage tasks by adding, editing, deleting, and updating them through a user-friendly interface. It includes a detailed methodology for implementation, resource requirements, and an action plan for project execution.
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
0 views

php

This document outlines a micro-project focused on developing a To-Do List web application using PHP, HTML, CSS, JavaScript, and MySQL, submitted for a Diploma in Computer Technology. The application allows users to manage tasks by adding, editing, deleting, and updating them through a user-friendly interface. It includes a detailed methodology for implementation, resource requirements, and an action plan for project execution.
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 26

MICRO-PROJECT ON

Develop a To-Do-List web application

Submitted: 2024-2025

Under the guidance of


Prof. K. U. Koche
( Lecturer in Computer Technology)

This Micro-project work submitted in partial fulfilment of requirement


for the award of Diploma in Computer Technology for subject
Hypertext Preprocessor (PHP).

Submitted By:

Sr. No. Name Enrollment No. Roll No.


1 Trisha T. 2201210114 13
Chandankhede
2 Shivani S. Wasnik 22012110115 14

3 Gauri V. Naktode 22012110118 17


Government Polytechnic, Bramhapuri
Department of Computer Technology

This is to certify that the following student of this institute have carried
out this micro- project work on “Develop a To-Do-List Web
Application. ”under the guidance of Prof. K. U. Koche in the
Department of Computer Technology during the session 2024-25. This
work has been done in the partial fulfilment of the award for in Diploma
in Computer Technology from Maharashtra State Board of Technical
Education, Mumbai.

SUBMITTED-BY

Sr. No. Name Enrollment No. Roll No.


1 Trisha T. Chandankhede 2201210114 13

2 Shivani S. Wasnik 22012110115 14

3 Gauri V. Naktode 22012110118 17

Project Guide Head of Department


Prof K. U. Koche Sir Prof. S. K. Kharkate. Mam
Part A:Micro-Project Proposal
1. Brief Description
A simple and efficient To-Do List web application built using PHP, HTML,
CSS, JavaScript and MySQL. This application allows users to add, edit, delete,
and update tasks with a user-friendly interface.

2. Aim of Micro-Project
Develop a To-Do-List web application

3. Intended Course Outcome


• Understanding Digital Marketing Basics
• Applying Digital Marketing for Startup Growth

4. Literature Review

A To-Do List Web Application built using PHP allows users to manage and
organize tasks efficiently through a dynamic, server-side application. PHP, a
widely used server-side scripting language, offers the flexibility and simplicity
required to develop interactive and user-friendly web applications.

1. PHP: A Server-Side Programming Language


PHP is a widely-used server-side scripting language designed for web
development. It is known for its ease of integration with HTML and databases,
making it ideal for developing dynamic websites like this user authentication
system.
• Database Interaction: The application uses PHP’s mysqli library for connecting
to the MySQL database and executing SQL queries. It provides secure and
efficient methods for interacting with the database.
• Session Management: PHP's session handling capabilities (session_start() and
$_SESSION[]) ensure that once a user is logged in, their state is maintained
across pages.
2. MySQL Database: Data Storage and Retrieval
The user information, such as username and password, is stored securely in a
MySQL database. The system interacts with the database using SQL queries to
insert, retrieve, and verify user credentials.
• Password Hashing: When a user registers, their password is hashed using PHP’s
password_hash() function. This ensures that the password is securely stored in
the database, protecting it from potential breaches.
• Prepared Statements: To mitigate SQL injection vulnerabilities, the application
uses prepared statements with parameterized queries ($stmt->bind_param()),
providing a secure means of interacting with the database.

3. HTML and CSS: Structure and Presentation


HTML and CSS are used to structure and style the To-Do List application’s
user interface. HTML provides the form inputs, buttons, and displays, while
CSS is used to enhance the visual design of the application, ensuring a
responsive and intuitive layout.

• Form Elements: Forms are used to accept user inputs, such as task titles and
descriptions, and also allow users to mark tasks as completed or delete them.
• Responsive Layout: CSS ensures that the application layout adjusts well to
different screen sizes, making it usable on both desktop and mobile devices.

4. JavaScript: Enhancing User


Interaction
JavaScript is used to add interactivity
to the application. It enables
features like task editing, status
toggling (from 'pending' to
'completed'), and asynchronous
operations like fetching data
without reloading the page.
• Task Editing and Deleting:
JavaScript allows users to edit or
delete tasks without refreshing the
entire page. This provides a
smoother user experience
5. Proposed Methodology:

Algorithm:
The To-Do List Application in PHP follows a systematic and user-friendly
approach for managing tasks. The system uses a web-based interface, allowing
users to create, view, edit, and delete tasks. Here's a step-by-step description of
the proposed methodology for managing tasks:
Step 1: Initialize Database and Session
• Database Setup: Initialize a MySQL database to store tasks and user
information.
o Create a tasks table with columns such as task_id, user_id,
task_title, task_description, status, and created_at.
o Create a users table to store user credentials (username and
password).
• Session Management: Use PHP sessions to handle user login and ensure
tasks are associated with specific users.
Step 2: Display a Menu-Driven Interface
• Login: The user can log into their account to view their personal tasks.
• Register: If the user doesn’t have an account, they can register.
• Logout: The user can log out once they are finished.

Step 3: Handle User Registration


When the user registers:
1. Prompt the User for Registration Details:
o Username: Validate that the username is not already taken.
o Password: Securely hash the password before storing it.
2. Store the Details in the Database: Insert the user’s information into the
users table in the database.
3. Display a Success Message: Notify the user of successful registration
and prompt them to log in.
Step 4: Handle User Login
When the user logs in:
1. Prompt the User for Username and Password: Check the credentials
against the data in the users table.
2. Validate Login: If the credentials are correct, start a session and allow
the user to manage their tasks.
3. Redirect to Dashboard: Once logged in, the user is redirected to the
dashboard where they can see their tasks and manage them.
Step 5: Add a New Task
1. Prompt the User for Task Details:
o Title: The user enters the title of the task.
o Description (optional): The user enters a brief description of the
task.
2. Insert Task into Database:
o Use an SQL INSERT statement to add the task to the tasks table in
the database with the user’s user_id.
o Set the default task status to "pending."
3. Confirm Task Creation: Notify the user that the task has been added.
Step 6: View Tasks
1. Fetch and Display Tasks: Retrieve all tasks associated with the user’s
user_id from the database.
2. Display Task Details:
o For each task, show the task title, description, and status (e.g.,
pending, completed).
o Provide options to edit or delete the task.
Step 7: Edit a Task
The user can edit a task:
1. Choose the Task to Edit: The user selects a task from their task list.
2. Prompt for New Details:
o Allow the user to update the task title, description, and status
(pending/completed).
3. Update the Database: Execute an SQL UPDATE statement to modify
the task’s details in the database.
4. Notify the User: Confirm that the task has been updated.
Step 8: Delete a Task
1. Select a Task to Delete: The user chooses a task from their task list.
2. Confirm Deletion: Prompt the user to confirm that they wish to delete
the task.
3. Delete Task from Database: Use an SQL DELETE statement to remove
the task from the database.
4. Notify the User: Confirm that the task has been deleted.
Step 9: Exit the Program
When the user is done:
1. Logout: The user can log out, which will destroy the session.
2. Redirect to Login Page: Once logged out, the user is redirected to the
login page.
6. Resource Required
Sr No. Resource Used Specification Quantity
1. Web Browser notepad -

2. Laptop HP RAM, 512 SSD, AMD 1


RYZEN

7. Action Plan

Sr No. Detail of Activity Start Date End Date Name of Student

1. Discuss about the topic

2. Information search from


various sources.

3. Discuss with project


guide

4. Implement part-A

5. Implement part-B

6. Final Report

7. Submission of final
report
Part B
Develop a To-Do-List web application
Rationale:
The rational for including “edit” and “delete” functionality in a to-do list
application is to enhance user control, flexibility, and productivity.

1. Aim of Micro-Project
Develop a To-Do-List web application

3. Course Outcomes
• Understanding Digital Marketing Basics
• Applying Digital Marketing for Startup Growth

4. Literature Review

A To-Do List Web Application built using PHP allows users to manage and
organize tasks efficiently through a dynamic, server-side application. PHP, a
widely used server-side scripting language, offers the flexibility and simplicity
required to develop interactive and user-friendly web applications.

1. PHP: A Server-Side Programming Language


PHP is a widely-used server-side scripting language designed for web
development. It is known for its ease of integration with HTML and databases,
making it ideal for developing dynamic websites like this user authentication
system.
• Database Interaction: The application uses PHP’s mysqli library for connecting
to the MySQL database and executing SQL queries. It provides secure and
efficient methods for interacting with the database.
• Session Management: PHP's session handling capabilities (session_start() and
$_SESSION[]) ensure that once a user is logged in, their state is maintained
across pages.

2. MySQL Database: Data Storage and Retrieval


The user information, such as username and password, is stored securely in a
MySQL database. The system interacts with the database using SQL queries to
insert, retrieve, and verify user credentials.
• Password Hashing: When a user registers, their password is hashed using PHP’s
password_hash() function. This ensures that the password is securely stored in
the database, protecting it from potential breaches.
• Prepared Statements: To mitigate SQL injection vulnerabilities, the application
uses prepared statements with parameterized queries ($stmt->bind_param()),
providing a secure means of interacting with the database.

3. HTML and CSS: Structure and Presentation


HTML and CSS are used to structure and style the To-Do List application’s user
interface. HTML provides the form inputs, buttons, and displays, while CSS is
used to enhance the visual design of the application, ensuring a responsive and
intuitive layout.

• Form Elements: Forms are used to accept user inputs, such as task titles and
descriptions, and also allow users to mark tasks as completed or delete them.
• Responsive Layout: CSS ensures that the application layout adjusts well to
different screen sizes, making it usable on both desktop and mobile devices.

3. JavaScript: Enhancing User


Interaction

JavaScript is used to add


interactivity to the application. It
enables features like task editing,
status toggling (from ‘pending’ to
‘completed’), and asynchronous
operations like fetching data
without reloading the page.

Task Editing and Deleting:


JavaScript allows users to edit or
delete tasks without refreshing the
entire page. This provides a
smoother user experience
5. Actual Methodology Followed

Algorithm:
The To-Do List Application in PHP follows a systematic and user-friendly
approach for managing tasks. The system uses a web-based interface, allowing
users to create, view, edit, and delete tasks. Here's a step-by-step description of
the proposed methodology for managing tasks:
Step 1: Initialize Database and Session
• Database Setup: Initialize a MySQL database to store tasks and user
information.
o Create a tasks table with columns such as task_id, user_id, task_title,
task_description, status, and created_at.
o Create a users table to store user credentials (username and
password).
• Session Management: Use PHP sessions to handle user login and ensure
tasks are associated with specific users.
Step 2: Display a Menu-Driven Interface
• Login: The user can log into their account to view their personal tasks.
• Register: If the user doesn’t have an account, they can register.
• Logout: The user can log out once they are finished.

Step 3: Handle User Registration


When the user registers:
4. Prompt the User for Registration Details:
o Username: Validate that the username is not already taken.
o Password: Securely hash the password before storing it.
5. Store the Details in the Database: Insert the user’s information into the
users table in the database.
6. Display a Success Message: Notify the user of successful registration and
prompt them to log in.
Step 4: Handle User Login
When the user logs in:
4. Prompt the User for Username and Password: Check the credentials
against the data in the users table.
5. Validate Login: If the credentials are correct, start a session and allow the
user to manage their tasks.
6. Redirect to Dashboard: Once logged in, the user is redirected to the
dashboard where they can see their tasks and manage them.
Step 5: Add a New Task
4. Prompt the User for Task Details:
o Title: The user enters the title of the task.
o Description (optional): The user enters a brief description of the
task.
5. Insert Task into Database:
o Use an SQL INSERT statement to add the task to the tasks table in
the database with the user’s user_id.
o Set the default task status to "pending."
6. Confirm Task Creation: Notify the user that the task has been added.
Step 6: View Tasks
3. Fetch and Display Tasks: Retrieve all tasks associated with the user’s
user_id from the database.
4. Display Task Details:
o For each task, show the task title, description, and status (e.g.,
pending, completed).
o Provide options to edit or delete the task.
Step 7: Edit a Task
The user can edit a task:
5. Choose the Task to Edit: The user selects a task from their task list.
6. Prompt for New Details:
o Allow the user to update the task title, description, and status
(pending/completed).
7. Update the Database: Execute an SQL UPDATE statement to modify the
task’s details in the database.
8. Notify the User: Confirm that the task has been updated.
Step 8: Delete a Task
5. Select a Task to Delete: The user chooses a task from their task list.
6. Confirm Deletion: Prompt the user to confirm that they wish to delete the
task.
7. Delete Task from Database: Use an SQL DELETE statement to remove
the task from the database.
8. Notify the User: Confirm that the task has been deleted.
Step 9: Exit the Program
When the user is done:
4. Logout: The user can log out, which will destroy the session.
5. Redirect to Login Page: Once logged out, the user is redirected to the
login page.
Code:-

<?php
// INSERT INTO `notes` (`sno`, `title`, `description`, `tstamp`) VALUES
(NULL, 'But Books', 'Please buy books from Store', current_timestamp());
$insert = false;
$update = false;
$delete = false;
// Connect to the Database
$servername = "localhost";
$username = "root";
$password = "";
$database = "database";

// Create a connection
$conn = mysqli_connect($servername, $username, $password, $database);

// Die if connection was not successful


if (!$conn){
die("Sorry we failed to connect: ". mysqli_connect_error());
}

if(isset($_GET['delete'])){
$sno = $_GET['delete'];
$delete = true;
$sql = "DELETE FROM `notes` WHERE `sno` = $sno";
$result = mysqli_query($conn, $sql);
}
if ($_SERVER['REQUEST_METHOD'] == 'POST'){
if (isset( $_POST['snoEdit'])){
// Update the record
$sno = $_POST["snoEdit"];
$title = $_POST["titleEdit"];
$description = $_POST["descriptionEdit"];

// Sql query to be executed


$sql = "UPDATE `notes` SET `title` = '$title' , `description` = '$description'
WHERE `notes`.`sno` = $sno";
$result = mysqli_query($conn, $sql);
if($result){
$update = true;
}
else{
echo "We could not update the record successfully";
}
}
else{
$title = $_POST["title"];
$description = $_POST["description"];

// Sql query to be executed


$sql = "INSERT INTO `notes` (`title`, `description`) VALUES ('$title',
'$description')";
$result = mysqli_query($conn, $sql);

if($result){
$insert = true;
}
else{
echo "The record was not inserted successfully because of this error ---> ".
mysqli_error($conn);
}
}
}
?>

<!doctype html>
<html lang="en">

<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-
to-fit=no">

<!-- Bootstrap CSS -->


<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
integrity="sha384-
Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23
Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet"
href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">

<title>iNotes - Notes taking made easy</title>

</head>

<body>

<!-- Edit Modal -->


<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-
labelledby="editModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="editModalLabel">Edit this Note</h5>
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form action="/crud/index.php" method="POST">
<div class="modal-body">
<input type="hidden" name="snoEdit" id="snoEdit">
<div class="form-group">
<label for="title">Note Title</label>
<input type="text" class="form-control" id="titleEdit"
name="titleEdit" aria-describedby="emailHelp">
</div>

<div class="form-group">
<label for="desc">Note Description</label>
<textarea class="form-control" id="descriptionEdit"
name="descriptionEdit" rows="3"></textarea>
</div>
</div>
<div class="modal-footer d-block mr-auto">
<button type="button" class="btn btn-secondary" data-
dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</div>
</form>
</div>
</div>
</div>

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">


<a class="navbar-brand" href="#"><img src="/crud/logo.svg" height="28px"
alt=""></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-
target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-
label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="navbarSupportedContent">


<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-
only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact Us</a>
</li>

</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search"
aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0"
type="submit">Search</button>
</form>
</div>
</nav>

<?php
if($insert){
echo "<div class='alert alert-success alert-dismissible fade show' role='alert'>
<strong>Success!</strong> Your note has been inserted successfully
<button type='button' class='close' data-dismiss='alert' aria-label='Close'>
<span aria-hidden='true'>×</span>
</button>
</div>";
}
?>
<?php
if($delete){
echo "<div class='alert alert-success alert-dismissible fade show' role='alert'>
<strong>Success!</strong> Your note has been deleted successfully
<button type='button' class='close' data-dismiss='alert' aria-label='Close'>
<span aria-hidden='true'>×</span>
</button>
</div>";
}
?>
<?php
if($update){
echo "<div class='alert alert-success alert-dismissible fade show' role='alert'>
<strong>Success!</strong> Your note has been updated successfully
<button type='button' class='close' data-dismiss='alert' aria-label='Close'>
<span aria-hidden='true'>×</span>
</button>
</div>";
}
?>
<div class="container my-4">
<h2>Add a Note to iNotes</h2>
<form action="/crud/index.php" method="POST">
<div class="form-group">
<label for="title">Note Title</label>
<input type="text" class="form-control" id="title" name="title" aria-
describedby="emailHelp">
</div>

<div class="form-group">
<label for="desc">Note Description</label>
<textarea class="form-control" id="description" name="description"
rows="3"></textarea>
</div>
<button type="submit" class="btn btn-primary">Add Note</button>
</form>
</div>

<div class="container my-4">

<table class="table" id="myTable">


<thead>
<tr>
<th scope="col">S.No</th>
<th scope="col">Title</th>
<th scope="col">Description</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<?php
$sql = "SELECT * FROM `notes`";
$result = mysqli_query($conn, $sql);
$sno = 0;
while($row = mysqli_fetch_assoc($result)){
$sno = $sno + 1;
echo "<tr>
<th scope='row'>". $sno . "</th>
<td>". $row['title'] . "</td>
<td>". $row['description'] . "</td>
<td> <button class='edit btn btn-sm btn-primary'
id=".$row['sno'].">Edit</button> <button class='delete btn btn-sm btn-primary'
id=d".$row['sno'].">Delete</button> </td>
</tr>";
}
?>

</tbody>
</table>
</div>
<hr>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"
integrity="sha384-
J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJ
oZ+n"
crossorigin="anonymous"></script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"
integrity="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfo
oAo"
crossorigin="anonymous"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
integrity="sha384-
wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8i
fwB6"
crossorigin="anonymous"></script>
<script src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function () {
$('#myTable').DataTable();

});
</script>
<script>
edits = document.getElementsByClassName('edit');
Array.from(edits).forEach((element) => {
element.addEventListener("click", (e) => {
console.log("edit ");
tr = e.target.parentNode.parentNode;
title = tr.getElementsByTagName("td")[0].innerText;
description = tr.getElementsByTagName("td")[1].innerText;
console.log(title, description);
titleEdit.value = title;
descriptionEdit.value = description;
snoEdit.value = e.target.id;
console.log(e.target.id)
$('#editModal').modal('toggle');
})
})

deletes = document.getElementsByClassName('delete');
Array.from(deletes).forEach((element) => {
element.addEventListener("click", (e) => {
console.log("edit ");
sno = e.target.id.substr(1);

if (confirm("Are you sure you want to delete this note!")) {


console.log("yes");
window.location = `/crud/index.php?delete=${sno}`;
// TODO: Create a form and use post request to submit a form
}
else {
console.log("no");
}
})
})
</script>
</body>

</html> index.php
<?php
session_start();

// Database connection
$conn = new mysqli("localhost", "root", "", "database");

// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}

// Initialize variables
$message = "";
$page = isset($_GET['page']) ? $_GET['page'] : 'login';

// Registration Logic
if (isset($_POST['register'])) {
$username = trim($_POST['username']);
$password = trim($_POST['password']);

if (!empty($username) && !empty($password)) {


$hashed_password = password_hash($password,
PASSWORD_DEFAULT);
$stmt = $conn->prepare("INSERT INTO users (username, password)
VALUES (?, ?)");
$stmt->bind_param("ss", $username, $hashed_password);

if ($stmt->execute()) {
$message = "Registration successful. <a href='?page=login'>Login
here</a>";
} else {
$message = "Username already exists.";
}
} else {
$message = "All fields are required.";
}
}

// Login Logic
if (isset($_POST['login'])) {
$username = trim($_POST['username']);
$password = trim($_POST['password']);

if (!empty($username) && !empty($password)) {


$stmt = $conn->prepare("SELECT password FROM users WHERE
username = ?");
$stmt->bind_param("s", $username);
$stmt->execute();
$result = $stmt->get_result();

if ($row = $result->fetch_assoc()) {
if (password_verify($password, $row['password'])) {
$_SESSION['user'] = $username;
header("Location: ?page=dashboard");
exit();
} else {
$message = "Invalid password.";
}
} else {
$message = "Username not found.";
}
} else {
$message = "All fields are required.";
}
}

// Logout Logic
if ($page == "logout") {
session_destroy();
header("Location: ?page=login");
exit();
}

// Protect dashboard pages


if ($page == "dashboard" && !isset($_SESSION['user'])) {
header("Location: ?page=login");
exit();
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>User System</title>
<style>
body { font-family: Arial, sans-serif; text-align: center; background:
#f4f4f4; }
.container { background: white; padding: 20px; margin: 100px auto; width:
300px; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); }
input, button { width: 90%; padding: 10px; margin: 10px; }
.message { color: red; }
</style>
</head>
<body>
<div class="container">
<?php if ($page == "register") { ?>
<h2>Register</h2>
<p class="message"><?php echo $message; ?></p>
<form method="POST">
<input type="text" name="username" placeholder="Enter Username"
required>
<input type="password" name="password" placeholder="Enter
Password" required>
<button type="submit" name="register">Register</button>
</form>
<p>Already registered? <a href="?page=login">Login</a></p>
<?php } elseif ($page == "login") { ?>
<h2>Login</h2>
<p class="message"><?php echo $message; ?></p>
<form method="POST">
<input type="text" name="username" placeholder="Enter Username"
required>
<input type="password" name="password" placeholder="Enter
Password" required>
<button type="submit" name="login">Login</button>
</form>
<p>Not registered? <a href="?page=register">Register</a></p>
<?php } elseif ($page == "dashboard") { ?>
<h2>Welcome, <?php echo $_SESSION['user']; ?>!</h2>
<a href="?page=logout">Logout</a>
<br><br>
<a href="index.php">Go to Notes</a>
<?php } ?>
</div>
</body>
</html>
login.php
6. Resources Used

Sr No. Resource Used Specification Quantity


1. Web Browser Google Chrome -

2. Laptop HP 1
AMD RYZEN 16gb RAM,
512 SSD,

7. Skill Developed:

Focus: Word search puzzles require focus and concentration, helping


improve your ability to stay on task.

Memory: They strengthen memory as you remember the positions of the


words in the grid.

Problem Solving: You solve a mini-challenge by figuring out where the


words are hidden, enhancing problem-solving skills.

8.Conclusion
the To-Do List Web Application developed using PHP is an efficient and
user-friendly system designed to help individuals manage their tasks and
stay organized. Through its simple and intuitive interface, the application
allows users to easily add, view, edit, and delete tasks, ensuring that they
can efficiently manage their day-to-day activities.

You might also like