Scribd
Upload
9 views17 pages

Ajay Yadav Assignment 12

This document provides a comprehensive guide for installing and setting up XAMPP, including steps to download, install, and start services like Apache and MySQL. It also outlines how to create a PHP project, manage databases using phpMyAdmin, and includes code snippets for HTML, CSS, JavaScript, and PHP for form handling. Additionally, it addresses common issues and their solutions related to XAMPP setup.

Uploaded by

Ajay Yadav
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
9 views17 pages

Ajay Yadav Assignment 12

This document provides a comprehensive guide for installing and setting up XAMPP, including steps to download, install, and start services like Apache and MySQL. It also outlines how to create a PHP project, manage databases using phpMyAdmin, and includes code snippets for HTML, CSS, JavaScript, and PHP for form handling. Additionally, it addresses common issues and their solutions related to XAMPP setup.

Uploaded by

Ajay Yadav
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 17

ASSIGNMENT 2

WEB TECHNOLOGY

Submitted To:- Submitted By:- ajay

Dr. Honey Gocher A21704822079


Sec B
AIIT
BCA 6th Sem
XAMPP Installation and Setup Guide

1. Download and Install XAMPP


Step 1: Download XAMPP
1. Go to the official XAMPP website:
o https://www.apachefriends.org/download.html
2. Choose the version for your operating system:
o Windows
o macOS
o Linux
3. Click on the Download button to start downloading
the installer.

Step 2: Install XAMPP


1. Open the downloaded XAMPP installer (xampp-
windows-x64-*.exe).
2. If prompted by Windows User Account Control
(UAC), click Yes.
3. Select Components to Install:
o Keep the default selection:
⬛ Apache (Web Server)
⬛ MySQL (Database)
⬛ PHP (Programming Language)
⬛ phpMyAdmin (Database Management Tool)
o Click Next.
4. Choose Installation Directory:
o Default location: C:\xampp\ (recommended).
o Click Next.
5. Language Selection: Choose your preferred
language and click Next.
6. Begin Installation: Click Next to start installing
XAMPP.
7. Wait for the installation to complete and then click
Finish.
XAMPP is now installed on your system!

2. Start XAMPP and Services


Step 1: Open XAMPP Control Panel
1. Go to Start Menu and search for XAMPP Control
Panel.
2. Click to open it.
Step 2: Start Apache and MySQL
1. In the XAMPP Control Panel, find:
o Apache (Web Server)
o MySQL (Database)
2. Click the Start button next to both services.
3. If they turn green, XAMPP is running successfully! ⬛

3. Check If XAMPP is Working


1. Open your browser (Chrome, Edge, Firefox, etc.).
2. Type in the address bar:
3. http://localhost/
4. If you see the XAMPP dashboard, the installation is
successful. ˙~
·ª
˙
.
~˛
.
‘3

4. Configure XAMPP for Future Use


Start XAMPP on Every Restart
• Each time you restart your computer, you must start
Apache and MySQL in the XAMPP Control Panel.
Changing MySQL Password
1. Open phpMyAdmin (http://localhost/phpmyadmin).
2. Click User Accounts → Find root user → Edit
privileges.
3. Change password under "Change Password" section.
4. Update C:\xampp\phpMyAdmin\config.inc.php
with the new password.

Common Issues s Fixes


+ Apache or MySQL Not Starting?
⬛ Solution:
• Another application (like Skype, IIS) may be using port
80 (Apache) or port 3306 (MySQL).
• Open XAMPP Config → Apache (httpd.conf) and
change:
• Listen 80 → Listen 8080
• Restart XAMPP.
+ Error: "Access Denied for User ‘root’@’localhost’"
⬛ Solution:
• Reset the MySQL password in phpMyAdmin and
update config.inc.php.

Summary of XAMPP Setup


1. Download and install XAMPP from Apache Friends
website.
2. Start Apache and MySQL using the XAMPP Control
Panel.
3. Check if XAMPP is working by visiting
http://localhost/.
4. Create a new PHP project inside
C:\xampp\htdocs\my_project\.
5. Run your project using
http://localhost/my_project/index.php.
6. Use phpMyAdmin to manage MySQL databases
(http://localhost/phpmyadmin).
I'll provide the code separately for each part:
1. HTML – Form structure
2. CSS – Styling
3. JavaScript – Form validation
4. PHP – Backend to handle form submission and store
data in a database
You'll need to set up XAMPP and configure it to run this.

1. HTML (index.html)
This file creates the form.
2. CSS (styles.css)
Save this in the same directory as index.html.
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
text-align: center;
padding: 20px;
}
.container {
background: white;
padding: 20px;
max-width: 400px;
margin: auto;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

input, textarea {
width: 100%;
padding: 10px;
margin: 10px 0;
border: 1px solid #ddd;
}

button {
background: blue;
color: white;
padding: 10px;
border: none;
cursor: pointer;
}
3. JavaScript (script.js)
Handles form validation before submitting.
document.getElementById("contactForm").addEventListe
ner("submit", function(event) {
let name = document.getElementById("name").value;
let email = document.getElementById("email").value;
let message =
document.getElementById("message").value;

if (name === "" || email === "" || message === "") {


alert("All fields are required!");
event.preventDefault();
}
});

4. PHP Backend (process.php)


Handles form submission and stores data in MySQL.
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "form_db";

// Create connection
$conn = new mysqli($servername, $username,
$password, $dbname);

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

// Get form data


$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];

// Insert into database


$sql = "INSERT INTO contacts (name, email, message)
VALUES ('$name', '$email', '$message')";

if ($conn->query($sql) === TRUE) {


echo "Form submitted successfully!";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();
?>

5. Database Setup (MySQL)


1. Open XAMPP Control Panel and start Apache and
MySQL.
2. Open phpMyAdmin (http://localhost/phpmyadmin).
3. Create a new database: form_db.
4. Run this SQL query to create the table:
CREATE TABLE contacts (
id INT AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(100),
email VARCHAR(100),
message TEXT
);
6. Run the Project

ajay yadav
1. Place all files inside htdocs/form_project/ in the
XAMPP folder.
2. Open http://localhost/form_project/index.html in
your browser.
3. Fill the form and submit—data will be saved in the
database.

You might also like