Overview of Web Development Technologies

Key Topics Covered:

1. What is Web Development?

- Web development refers to the creation and maintenance of websites. It includes
everything from building static web pages to dynamic web applications that run in a browser.
- Web development can be broadly divided into front-end development (what users see) and
back-end development (server-side processing and databases).

2. Main Web Technologies:

- HTML (HyperText Markup Language):

- Purpose: The foundation of all websites, HTML structures the content of a page (headings,
paragraphs, images).
- Role: Provides a skeleton for the website; it doesn't provide any styling or interactive
features.
- Advantage: Simple and supported by all web browsers.
- Disadvantage: Limited functionality without CSS or JavaScript.

- CSS (Cascading Style Sheets):

- Purpose: Handles the presentation of web pages by styling HTML elements (fonts, colors,
spacing).
- Role: CSS allows developers to control how websites look on different devices or screen
sizes.
- Advantage: Separates content from design, improving maintainability.
- Disadvantage: Managing complex layouts can become cumbersome.

- JavaScript:
- Purpose: Adds interactivity and dynamic elements to web pages (animations, event
handling, etc.).
- Role: Executes in the browser, allowing for responsive and interactive user interfaces.
- Advantage: Enables real-time content updates without page reloads (AJAX, React).
- Disadvantage: Can slow down page performance, especially if poorly optimized.

3. Web Development Models:

- Client-Server Model:
- The most common model in web development, where the client (browser) makes requests
to the server, and the server responds.
- Involves front-end technologies (client-side) for user interactions and back-end
technologies (server-side) for processing and data handling.

4. Server-side vs. Client-side:

- Client-side: Code executed in the browser (HTML, CSS, JavaScript). This is what users interact
with.
- Server-side: Code executed on the server (PHP, Python, Ruby, etc.), which handles
databases, authentication, and other complex processes.

5. Frameworks and Libraries:

- Bootstrap (CSS framework): Simplifies responsive web design.
- jQuery (JavaScript library): Eases DOM manipulation and event handling, though now less
popular due to frameworks like React.
- Angular / React: JavaScript frameworks for building complex, interactive single-page
applications (SPAs).

6. Popular Back-end Technologies:

- PHP: Popular for server-side scripting and is often used with MySQL for database interaction.
 - MySQL: A relational database system frequently used in conjunction with PHP for data
storage and retrieval.
- [Link]: Enables running JavaScript on the server-side, known for its speed and real-time
applications.
Front-end and Back-end Development

Key Topics Covered:

1. Front-end Development (Client-side):

- What is Front-end Development?
- Involves everything users see on a website. It is built using HTML, CSS, and JavaScript.
- Focuses on User Interface (UI) and User Experience (UX).

- HTML (Structure):
- The structure of the web page: headings, paragraphs, lists, and links.

- CSS (Styling):
- Defines the appearance of elements, ensuring a consistent look across different browsers
and devices.
- Use of CSS frameworks like Bootstrap to make development faster and more responsive.

- JavaScript (Interactivity):
- Adds interactivity to the static elements of HTML (click events, form validation).
- Libraries like jQuery make handling HTML manipulation easier, but modern development
often prefers frameworks like React or [Link].

2. Back-end Development (Server-side):

- What is Back-end Development?
- Manages the business logic of a website. It ensures that the data is processed, stored, and
retrieved properly.
- Involves server-side languages like PHP, Python, Ruby, and databases like MySQL or
MongoDB.
- Back-end logic handles tasks such as form submissions, user authentication, and
interactions with the database.

- Server-side Scripting with PHP:

- PHP is commonly used to build dynamic websites by generating HTML on the server-side
and communicating with databases like MySQL.
- Example: A login form that checks user credentials against a database.

- Database Integration:
- MySQL is often used with PHP to handle database operations.
- SQL (Structured Query Language) is used to retrieve, insert, update, and delete data in
relational databases.

3. Interaction Between Front-end and Back-end:

- How the Front-end and Back-end Communicate:
- The front-end makes HTTP requests to the back-end, often through AJAX or fetch API for
asynchronous data loading.
- Data is exchanged in formats like JSON or XML, which is processed and displayed
dynamically on the front-end.

- Session Management and Cookies:

- Session is managed by the back-end to track users between requests (e.g., user
authentication).
- Cookies are stored on the client-side to save preferences or track user activity.

4. Examples of Web Development Stacks:

- LAMP Stack:
- Linux, Apache, MySQL, and PHP. One of the most popular stacks for web development.
- MEAN Stack:
 - MongoDB, [Link], Angular, and [Link]. A JavaScript-centric stack used for building
modern, scalable web applications.

5. Advantages and Disadvantages of Using PHP/MySQL:

- Advantages:
- PHP is open-source and widely supported.
- Integrates easily with MySQL, providing a powerful combination for building data-driven
websites.
- Disadvantages:
- PHP can become slow with larger projects, and scaling can be more challenging compared
to more modern languages like [Link].
- Security risks exist if PHP code is not written carefully (e.g., SQL injection).

Summary

- Web Development Technologies: Front-end technologies (HTML, CSS, JS) handle the client
side, while back-end technologies (PHP, MySQL) manage server-side logic and data.
- Front-end and Back-end Development: Front-end is responsible for the user-facing part of a
web application, while back-end handles the business logic, databases, and server-side
functions.
- PHP/MySQL: A powerful and common combination for creating dynamic websites, although
scalability and performance can be concerns.
Overview of Web Development Technologies

1. What is Web Development?

Web development refers to the process of building, creating, and maintaining websites and
web applications. It involves everything from coding web pages to ensuring they function
correctly on various devices and browsers. The goal of web development is to create engaging,
functional websites that users can interact with.

Web development is divided into two main categories:

- Front-end development: This involves everything that users see and interact with in their
browsers.
- Back-end development: This involves the server-side processes that handle data and the logic
that powers the front-end.

2. Front-end Technologies
Front-end development focuses on creating the parts of a website or web application that users
interact with. It's often referred to as client-side development because it takes place in the
user's browser.

The three main technologies used in front-end development are:

- HTML (Hypertext Markup Language):

HTML is the backbone of web pages. It provides the structure of a page by using tags such as
`<h1>` for headings, `<p>` for paragraphs, and `<a>` for links. Think of HTML as the skeleton of a
website.
- Advantage: Easy to learn and use. Every web browser supports HTML, making it a universal
language for web development.
- Disadvantage: On its own, HTML is quite limited. It can't style a web page or make it
interactive without other technologies like CSS and JavaScript.

- CSS (Cascading Style Sheets):

CSS is responsible for the styling of a website, including layout, colors, fonts, and spacing. It
ensures that a website looks visually appealing and consistent across different devices.
- Advantage: CSS makes it easier to separate design from content. This improves the
maintainability of a website and allows developers to apply the same styles across multiple
pages.
- Disadvantage: Complex layouts and responsive designs can be challenging to implement,
especially across different browsers.

- JavaScript:
JavaScript is a scripting language that adds interactivity to websites. It can be used for tasks
like form validation, animations, and dynamically updating content without refreshing the page
(via AJAX).
- Advantage: JavaScript is extremely powerful and is the only language that works directly in
the browser. It allows for real-time updates and complex user interactions.
- Disadvantage: Overuse or poorly optimized JavaScript can slow down a website, leading to
performance issues. It also opens up security risks if not properly handled.

3. Back-end Technologies
Back-end development involves working with server-side logic, databases, and APIs (Application
Programming Interfaces). This is the part of the application that users don’t directly interact
with, but it is critical for managing data, user authentication, and server processes.

The main technologies in back-end development include:

- PHP (Hypertext Preprocessor):

 PHP is a popular server-side scripting language used to create dynamic web pages by
embedding code within HTML. It's commonly paired with the MySQL database to create
powerful, data-driven websites.
- Advantage: PHP is open-source and has a large developer community, making it easy to find
resources, libraries, and tools. It integrates seamlessly with MySQL, making it a popular choice
for data-driven applications.
- Disadvantage: PHP can become slow for very large applications. If not written carefully, it can
also introduce security vulnerabilities such as SQL injection attacks.

- MySQL:
MySQL is an open-source relational database management system. It is used to store and
manage data for web applications, such as user information, posts, and comments.
- Advantage: MySQL is fast, reliable, and scalable. It works exceptionally well with PHP,
allowing for efficient database querying and manipulation.
- Disadvantage: Managing very large or complex databases can be challenging, especially as
the number of users and data increases.

- [Link]:
[Link] is a JavaScript runtime that allows developers to write server-side code in JavaScript.
It’s particularly well-suited for real-time applications like chat applications or online games.
- Advantage: Because it uses JavaScript, [Link] allows developers to use the same language
on both the front-end and back-end, simplifying development. Its event-driven architecture
makes it ideal for handling many simultaneous requests.
- Disadvantage: [Link] may not perform well for CPU-intensive tasks. It requires deep
knowledge of asynchronous programming to use effectively.

Front-end vs. Back-end Development

Front-end Development:
Front-end development is all about what the user experiences directly. It deals with the layout,
design, and interaction of the website. Everything you see on a website – colors, fonts, buttons,
images, and menus – is the result of front-end development. Tools like HTML, CSS, and
JavaScript are essential here.

- Key Tasks:
- Structuring web pages with HTML.
- Styling with CSS to ensure visual appeal and responsiveness.
- Adding interactivity using JavaScript.

- Example Technologies:
- Frameworks: Bootstrap, Foundation (for CSS)
- Libraries: React, [Link], Angular (for JavaScript)

Back-end Development:
Back-end development is focused on what goes on behind the scenes. When you log in to a
website or submit a form, the back-end handles this information, processes it, and saves it to a
database. The back-end manages business logic, interactions with the database, and the overall
performance of the site.

- Key Tasks:
- Managing server requests and responses.
- Storing and retrieving data from the database.
- Ensuring security and scalability.

- Example Technologies:
- Programming Languages: PHP, Python, Ruby, Java, [Link]
- Databases: MySQL, PostgreSQL, MongoDB
Interaction Between Front-end and Back-end:

The front-end and back-end are two sides of the same coin. For a web application to work, both
must communicate with each other. When a user interacts with the front-end (for example,
filling out a form), the back-end processes the request (validating the data, interacting with the
database) and sends back a response (such as a success message or retrieved data).

- HTTP Requests: The front-end sends requests to the back-end using HTTP (Hypertext Transfer
Protocol). Common methods include:
- GET: Requesting data from the server (e.g., fetching user data).
- POST: Sending data to the server (e.g., submitting a form).

- AJAX (Asynchronous JavaScript and XML): This technique allows the front-end to send and
receive data from the server without reloading the entire page. It is often used for dynamic
content updates.

- JSON (JavaScript Object Notation): A lightweight data-interchange format that is easy for
humans to read and write, and for machines to parse and generate. It is commonly used for
data exchange between the front-end and back-end.

Advantages and Disadvantages of Using PHP and MySQL

Advantages of PHP/MySQL:
1. Open-source: Both PHP and MySQL are free to use, which lowers development costs.
2. Large Community: There is a vast community of developers who use PHP/MySQL, providing
plenty of resources, tutorials, and third-party libraries.
3. Cross-platform: PHP and MySQL can run on various operating systems, including Windows,
Linux, and macOS.
4. Simplicity: PHP is easy to learn and use, especially for building simple web applications.
MySQL’s syntax is also straightforward, making it accessible for new developers.

Disadvantages of PHP/MySQL:
1. Performance: PHP can become slower when handling very large applications, particularly
when compared to more modern back-end languages like [Link].
2. Security: PHP applications are susceptible to common security issues like SQL injection, cross-
site scripting (XSS), and session hijacking, especially if the code is not properly secured.
3. Scalability: While PHP and MySQL are great for small to medium-sized applications, they can
struggle with scaling to handle large volumes of traffic and data, especially in enterprise-level
applications.
Setting Up a Local Development Environment Using XAMPP

XAMPP is a free and open-source cross-platform web server solution stack that allows you to
create a local server environment on your computer. It includes key software components such
as Apache (the web server), MySQL (database), and PHP (server-side scripting language),
making it an all-in-one package for web development.

1. Installation of PHP and MySQL Using XAMPP

Steps to Install XAMPP:

1. Download XAMPP:
- Go to the official XAMPP website
[[Link] and download the version
suitable for your operating system (Windows, Linux, or macOS).

2. Run the Installer:

- Open the downloaded file and run the installer. You may be prompted with a warning from
Windows or macOS asking if you want to allow the app to make changes. Click "Yes" or "Allow."

3. Choose Components:
- During installation, you can choose which components to install. By default, Apache, MySQL,
PHP, and phpMyAdmin are selected, which are essential for most development needs. Ensure
these are selected, and you can uncheck others if not needed (like Perl, Tomcat, etc.).

4. Select Installation Directory:

- Choose the directory where XAMPP will be installed. It’s recommended to use the default
directory (usually `C:\xampp` on Windows).

5. Complete the Installation:

- Once the installation is complete, you can launch the XAMPP Control Panel. This panel
allows you to manage the services such as starting and stopping Apache (the web server) and
MySQL (the database).

6. Start Apache and MySQL:

- In the XAMPP Control Panel, click Start next to Apache and MySQL. You should see both
services turn green, indicating that they are running.
- If everything is working correctly, you can check by opening your browser and typing
`[Link] If XAMPP is set up correctly, you’ll see the XAMPP welcome page.

2. Introduction to a Code Editor or IDE for Development

To develop PHP applications and manage your MySQL database, you’ll need a good code editor
or IDE (Integrated Development Environment). Here are some popular choices:

- Visual Studio Code (VS Code):

- A free and open-source editor from Microsoft. It supports syntax highlighting for PHP,
JavaScript, HTML, and CSS, making it a great tool for web development.
- Features: Extensions for debugging, Git integration, themes, and auto-completion.

- Sublime Text:
- A lightweight and fast text editor. Sublime Text is easy to use and has many extensions for
PHP and web development.

- PHPStorm:
- A full-featured IDE designed specifically for PHP development. It includes built-in support for
debugging, version control, and database management.
- Features: Advanced code analysis, error detection, and a built-in debugger for PHP.
3. Troubleshooting Installation Issues with XAMPP

While setting up XAMPP, you may encounter some common issues. Here’s how to troubleshoot
them:

- Apache Port Issues:

- Apache may fail to start because another application (like Skype or another web server) is
using port 80 or 443 (the default ports for HTTP and HTTPS).
- Solution: Change the Apache ports in the `[Link]` file. Open the file located in the
`C:\xampp\apache\conf\` directory and change the `Listen 80` to `Listen 8080` or another port
number.
- Afterward, access your local server with `[Link]

- MySQL Failing to Start:

- MySQL may not start if another instance of MySQL or a different database service is already
running.
- Solution: Check if there are any other MySQL services running on your machine and stop
them. Alternatively, change the MySQL port by going to `C:\xampp\mysql\bin\[Link]` and
changing the default port from 3306 to 3307 or another free port.

- Permission Denied Issues:

- On macOS and Linux, permission errors can occur if XAMPP doesn’t have access to certain
directories.
- Solution: Run XAMPP as an administrator or provide the necessary permissions using the
terminal (`chmod` command on Linux/macOS).

4. Hands-on Demonstration of XAMPP Installation and Troubleshooting

Here’s how you can practically install and set up XAMPP:

1. Installation Demo:
- Walk through the steps of downloading and installing XAMPP.
- Show the XAMPP Control Panel and demonstrate how to start Apache and MySQL services.

2. Testing the Localhost:

- Once XAMPP is installed, demonstrate how to create a simple PHP file (e.g., `[Link]`) and
place it in the `htdocs` folder located in the XAMPP installation directory (`C:\xampp\htdocs`).
- Code example for `[Link]`:
```php
<?php
echo "Hello, World!";
?>
```
- Access this file by navigating to `[Link] in a browser.

3. Troubleshooting Demo:
- Simulate common issues such as port conflicts and demonstrate how to resolve them by
editing configuration files.
- Show how to change Apache’s default port and restart services from the XAMPP Control
Panel.

5. Practical Assignment (Hands-on):

- Students should follow the steps to install XAMPP and troubleshoot any issues they
encounter.
- They will also write a simple PHP script to test their setup and configure their MySQL
database using phpMyAdmin, a web interface for managing MySQL databases.
Lesson 2: PHP Basics

In this lesson, we’ll dive into the fundamental syntax of PHP, focusing on how to use variables,
and how to debug simple PHP scripts by identifying and correcting syntax errors.

1. PHP Syntax Overview

PHP (Hypertext Preprocessor) is a widely-used open-source scripting language designed

specifically for web development. Its syntax is influenced by languages like C, Java, and Perl,
which makes it relatively easy for beginners to learn.

Basic PHP Script Structure

A PHP script typically begins and ends with PHP tags:
```php
<?php
// Your PHP code goes here
?>
```
PHP code is executed on the server, and the result is sent to the browser as plain HTML.

Key Components of PHP Syntax:

- Statements: PHP statements are lines of code that are executed in order. Each statement
must end with a semicolon (`;`).
```php
echo "Hello, World!";
```

- Comments: Comments in PHP can be single-line or multi-line.

```php
// This is a single-line comment
/* This is a
multi-line comment */
```

2. PHP Variables

Variables are used to store data and are declared using the `$` symbol followed by the variable
name. In PHP, variable names are case-sensitive, and they must begin with a letter or an
underscore.

Declaring Variables
```php
<?php
$name = "John"; // A string variable
$age = 25; // An integer variable
?>
```
- Types of Data in Variables:
- String: A sequence of characters (e.g., `"Hello, World!"`).
- Integer: Whole numbers (e.g., `10`).
- Float: Numbers with decimals (e.g., `3.14`).
- Boolean: Either `true` or `false`.
- Array: A collection of values (e.g., `["apple", "banana", "orange"]`).

Important Note: PHP is a loosely-typed language, meaning you do not need to declare the type
of a variable. PHP automatically determines the variable type based on the value assigned to it.
3. Debugging PHP Syntax Errors

Common mistakes in PHP often revolve around missing semicolons, mismatched parentheses,
misspelled variable names, and unclosed string quotes.

Example of a Script with Errors:

```php
<?php
$name = "John; // Missing closing quote
echo "Hello " . $name; // Forgot semicolon at the end of the statement
echo age; // Undefined variable
?>
```
Here’s what’s wrong:
- The first line has a missing closing quote (`"`).
- The second line is missing a semicolon after `echo`.
- The third line references an undefined variable `age`.

Debugging and Fixing the Script:

```php
<?php
$name = "John"; // Added closing quote
echo "Hello " . $name; // Added semicolon
$age = 25; // Defined the variable 'age'
echo $age; // Corrected variable usage
?>
```

4. Debugging Tools and Techniques

1. Using PHP’s Built-in Error Reporting:

To make debugging easier, always enable error reporting in your PHP scripts:
```php
<?php
error_reporting(E_ALL); // Display all PHP errors (warnings, notices, etc.)
ini_set('display_errors', 1); // Ensure errors are displayed
?>
```

This setting will ensure that you see error messages in the browser, which can help you
identify issues with your code.

2. Common Errors:
- Parse Error: Occurs when PHP encounters a syntax mistake (e.g., missing semicolons or
brackets).
- Undefined Variable: Happens when you reference a variable that hasn't been declared.
- Missing Semicolon: Each PHP statement must end with a semicolon (`;`). Forgetting this will
result in a syntax error.

5. Hands-On Laboratory Activity: Debugging PHP Scripts

In the lab, students will be tasked with identifying and fixing errors in PHP scripts. The goal is to
practice understanding PHP error messages and resolving issues. Below is a sample activity to
guide students through debugging:

Sample Script to Debug:

```php
<?php
$greeting = "Hello;
echo greeting;
echo "The result is: " . (5 / 0);
?>
```

Errors to Identify and Fix:

- Line 1: The variable `$greeting` is missing a closing double quote (`"`).
- Line 2: The variable `$greeting` should be referenced with the `$` symbol (`$greeting`).
- Line 3: Division by zero error in PHP.

Fixed Script:
```php
<?php
$greeting = "Hello"; // Added closing quote
echo $greeting; // Added $ symbol for the variable
echo "The result is: " . (5 / 1); // Fixed division by zero
?>
```

6. Demonstration

As part of the lesson, you can demonstrate how to troubleshoot and debug PHP code by:
1. Running a sample PHP script with syntax errors.
2. Showing students how PHP generates error messages in the browser.
3. Step-by-step identification and correction of each error.
4. Running the corrected PHP script and discussing the output.

References

- Nixon, R. (2018). *Learning PHP, MySQL & JavaScript: A Step-by-Step Guide to Creating
Dynamic Websites* (Pages 37-44).
PHP Basics: Data Types and Operators

In this section, we will explore the different data types in PHP and how to use operators to
manipulate these data types and control the program flow.

1. PHP Data Types

PHP supports various data types used to store different types of information. Understanding
these data types is essential for effective programming.

Primary Data Types:

1. Integer: Whole numbers, positive or negative (e.g., `100`, `-20`).

```php
<?php
$age = 25; // Integer
?>
```

2. Float: Numbers with a decimal point (e.g., `3.14`, `2.718`).

```php
<?php
$price = 99.99; // Float
?>
```

3. String: A sequence of characters (e.g., `"Hello, World!"`).

```php
<?php
$greeting = "Welcome to PHP!"; // String
?>
```

4. Boolean: Represents a truth value (`true` or `false`).

```php
<?php
$is_active = true; // Boolean
?>
```

5. Array: A collection of values (can be of any data type).

```php
<?php
$fruits = array("apple", "banana", "orange"); // Array
?>
```

6. Null: A special data type that can only have one value: `NULL`.
```php
<?php
$no_value = NULL; // Null
?>
```

2. PHP Operators
Operators are symbols that tell the PHP engine to perform certain operations on variables and
values. They can be used for arithmetic, comparison, logical operations, and more.

Types of Operators:

1. Arithmetic Operators:
These are used to perform basic arithmetic operations like addition, subtraction,
multiplication, division, and modulus.

- Addition (`+`):
```php
<?php
$sum = 5 + 10; // Result: 15
?>
```

- Subtraction (`-`):
```php
<?php
$difference = 15 - 5; // Result: 10
?>
```

- Multiplication (`*`):
```php
<?php
$product = 5 * 10; // Result: 50
?>
```

- Division (`/`):
```php
<?php
$quotient = 10 / 2; // Result: 5
?>
```

- Modulus (`%`):
The modulus operator returns the remainder of the division.
```php
<?php
$remainder = 10 % 3; // Result: 1
?>
```

2. Assignment Operators:
These are used to assign values to variables.

- Equal (`=`):
```php
<?php
$x = 10; // Assigns 10 to the variable $x
?>
```

- Add and Assign (`+=`):

```php
 <?php
$x = 10;
$x += 5; // Adds 5 to $x, Result: 15
?>
```

- Subtract and Assign (`-=`):

```php
<?php
$x = 10;
$x -= 3; // Subtracts 3 from $x, Result: 7
?>
```

3. Comparison Operators:
Used to compare two values and return `true` or `false`.

- Equal (`==`):
```php
<?php
$is_equal = (5 == 5); // Result: true
?>
```

- Not Equal (`!=`):

```php
<?php
$not_equal = (5 != 10); // Result: true
?>
```

- Greater Than (`>`):

```php
<?php
$greater_than = (10 > 5); // Result: true
?>
```

- Less Than (`<`):

```php
<?php
$less_than = (5 < 10); // Result: true
?>
```

4. Logical Operators:
Logical operators combine two or more conditions and return a boolean value.

- AND (`&&`):
```php
<?php
$result = (true && false); // Result: false
?>
```

- OR (`||`):
```php
<?php
 $result = (true || false); // Result: true
?>
```

- NOT (`!`):
```php
<?php
$result = !(true); // Result: false
?>
```

3. Creating a PHP Script with Data Types and Operators

Example Script:
In this script, we will demonstrate the use of various operators to manipulate different data
types.

```php
<?php
// Variables
$num1 = 10; // Integer
$num2 = 5; // Integer
$str1 = "Hello"; // String
$str2 = "World!"; // String

// Arithmetic operations
$sum = $num1 + $num2; // Result: 15
$product = $num1 * $num2; // Result: 50

// String concatenation
$greeting = $str1 . " " . $str2; // Result: "Hello World!"

// Logical operations
$is_greater = ($num1 > $num2); // Result: true
$is_equal = ($num1 == $num2); // Result: false

// Output results
echo "Sum: " . $sum . "<br>";
echo "Product: " . $product . "<br>";
echo "Greeting: " . $greeting . "<br>";
echo "Is Greater: " . ($is_greater ? 'True' : 'False') . "<br>";
echo "Is Equal: " . ($is_equal ? 'True' : 'False') . "<br>";
?>
```

Explanation:
- This script declares several variables of different data types (integers and strings).
- Arithmetic operators are used to calculate the sum and product of two integers.
- String concatenation is performed using the `.` operator to combine two strings into one.
- Logical operators are used to compare values and return `true` or `false` based on the
condition.
- The `echo` statement is used to print the results on the screen.

4. Laboratory Activity: Create a PHP Program Using Data Types and Operators
In this activity, students will create a PHP script that:
1. Declares variables of different data types (e.g., integer, float, string, array).
2. Uses various arithmetic and comparison operators to perform operations on these variables.
3. Prints the results of these operations to the screen.
4. Implements logical conditions to control the flow of the program based on variable values.

Reference

- Nixon, R. (2018). *Learning PHP, MySQL & JavaScript: A Step-by-Step Guide to Creating
Dynamic Websites* (Pages 44-55).
Lesson 3: PHP Basics – Control Structures

In this lesson, we’ll focus on how to use control structures in PHP to solve complex problems by
making decisions, repeating actions, and executing code selectively based on conditions.

1. Control Structures in PHP

Control structures allow you to control the flow of your PHP program by making decisions,
repeating tasks, and performing actions conditionally.

Types of Control Structures:

1. Conditional Statements (if-else, switch):

- These structures let you execute code blocks based on whether a condition is true or false.

2. Loops (while, for, foreach):

- Loops allow you to repeat a block of code multiple times as long as a condition is met.

3. Control Statements (break, continue, exit):

- These help manage the execution flow inside loops and other control structures.

2. Conditional Statements

If-Else Statement
The if-else statement evaluates a condition and executes code based on whether the condition
is `true` or `false`.

Syntax:
```php
<?php
if (condition) {
// Code to execute if condition is true
} else {
// Code to execute if condition is false
}
?>
```

Example:
```php
<?php
$score = 85;

if ($score >= 90) {

echo "Grade: A";
} elseif ($score >= 75) {
echo "Grade: B";
} else {
echo "Grade: C";
}
?>
```
In this example, the code checks the value of `$score` and prints a grade based on the result.
Switch Statement
The switch statement is used when you have multiple possible values for a single variable and
need to execute different code for each value.

Syntax:
```php
<?php
switch (variable) {
case value1:
// Code to execute if variable equals value1
break;
case value2:
// Code to execute if variable equals value2
break;
default:
// Code to execute if variable does not match any case
}
?>
```

Example:
```php
<?php
$day = "Tuesday";

switch ($day) {
case "Monday":
echo "Start of the work week";
break;
case "Friday":
echo "Weekend is near";
break;
default:
echo "It's a regular day";
}
?>
```

3. Loops

While Loop
The while loop repeats a block of code as long as a condition is `true`.

Syntax:
```php
<?php
while (condition) {
// Code to execute while condition is true
}
?>
```

Example:
```php
<?php
$i = 0;

while ($i < 5) {

 echo "The number is: $i <br>";
$i++;
}
?>
```
In this example, the loop will run as long as `$i` is less than 5, and `$i` increments by 1 each time
the loop runs.

For Loop
The for loop is used when you know how many times you want to repeat a block of code.

Syntax:
```php
<?php
for (initialization; condition; increment) {
// Code to execute
}
?>
```

Example:
```php
<?php
for ($i = 0; $i < 5; $i++) {
echo "The number is: $i <br>";
}
?>
```

Foreach Loop
The foreach loop is used to iterate over arrays. For each item in the array, the loop will execute
the code.

Syntax:
```php
<?php
foreach ($array as $value) {
// Code to execute for each array value
}
?>
```

Example:
```php
<?php
$fruits = array("apple", "banana", "cherry");

foreach ($fruits as $fruit) {

echo "I like $fruit <br>";
}
?>
```
This loop will iterate over each item in the array and print the name of the fruit.
4. Control Statements

Control statements like break, continue, and exit are useful for managing the flow of loops or
ending the script’s execution.

Break
The break statement is used to exit a loop early.

Example:
```php
<?php
for ($i = 0; $i < 10; $i++) {
if ($i == 5) {
break; // Exits the loop when $i is 5
}
echo $i;
}
?>
```

Continue
The continue statement skips the current iteration of the loop and moves to the next one.

Example:
```php
<?php
for ($i = 0; $i < 10; $i++) {
if ($i == 5) {
continue; // Skips printing 5
}
echo $i;
}
?>
```

Exit
The exit statement stops the execution of the script completely.

Example:
```php
<?php
echo "Hello World!";
exit(); // Stops further execution of the script
echo "This will not be printed";
?>
```

5. Creating a Well-Structured PHP Script

Task Example:
The following PHP script demonstrates the use of decision-making (if-else), loops (for loop), and
logical operators to calculate the factorial of a number.

```php
<?php
$number = 5;
$factorial = 1;
// Decision making using if-else
if ($number < 0) {
echo "Factorial is not defined for negative numbers";
} else {
// Looping using for loop
for ($i = $number; $i > 0; $i--) {
$factorial *= $i; // Factorial calculation
}
echo "The factorial of $number is: $factorial";
}
?>
```
This script calculates the factorial of a number using a for loop and if-else structure.

6. Laboratory Activity: PHP Program with Control Structures

In the lab, students will create a PHP program that:

1. Asks the user for input (such as a number or name).
2. Uses if-else or switch to make decisions based on the input.
3. Implements loops (while, for, or foreach) to perform repetitive tasks or process arrays.
4. Uses break or continue to control the flow of loops if necessary.

Reference

- Nixon, R. (2018). *Learning PHP, MySQL & JavaScript: A Step-by-Step Guide to Creating
Dynamic Websites* (Pages 55-56).
Lesson 4: PHP Basics – Functions and Server-Side Includes

In this lesson, we will explore how to design modular PHP applications by using functions for
specific tasks and server-side includes for shared code. These tools help in achieving efficient
code organization and reusability across multiple pages in a web application.

1. Functions in PHP

A function is a block of code that can be repeatedly executed whenever called, thus allowing
you to avoid redundancy and make your code cleaner and more maintainable.

Syntax of a Function:
```php
<?php
function functionName() {
// Code to be executed
}
?>
```

You can also pass parameters to a function to make it more dynamic and useful.

Example of a Function with Parameters:

```php
<?php
function addNumbers($a, $b) {
return $a + $b;
}

echo addNumbers(5, 10); // Output: 15

?>
```

Why Use Functions?

- Reusability: You write the code once and reuse it across multiple parts of the application.
- Modularity: Functions break down your application into smaller, manageable pieces.
- Maintainability: Any changes needed can be done in one place rather than multiple locations.

2. Server-Side Includes (SSI) in PHP

Server-side includes are used to include the content of one PHP file into another. This is
especially useful when you want to reuse parts of your code, such as headers, footers, or
navigation menus, across different pages of your website.

include() and require() Functions

PHP provides two ways to include a file: `include()` and `require()`. Both allow you to insert the
content of one file into another, but they behave slightly differently in case of failure.

- include(): Will include the file and continue the script execution even if the file cannot be
found.
- require(): Will include the file but will stop the script execution if the file cannot be found.

Syntax of include() and require():

```php
<?php
include '[Link]'; // Includes the content of [Link]
require '[Link]'; // Includes the content of [Link]
?>
```

Example:
```php
<!-- [Link] -->
<h1>Welcome to My Website</h1>
<nav>
<ul>
<li><a href="[Link]">Home</a></li>
<li><a href="[Link]">About</a></li>
</ul>
</nav>

<!-- [Link] -->

<footer>
<p>© 2024 My Website</p>
</footer>

<!-- [Link] -->

<?php include '[Link]'; ?>
<p>This is the main content of the page.</p>
<?php include '[Link]'; ?>
```

This approach ensures that the same header and footer appear on all pages without duplicating
the code.

3. Designing a Modular PHP Application

To design a modular application, follow these principles:

1. Divide functionality into separate functions: Each function should handle a specific task.
2. Use server-side includes: Shared code (like headers, footers, or navigation) should be placed
in separate files and included where needed.

Example of a Modular PHP Application:

In this example, we’ll create a simple PHP application with functions and server-side includes
for code reusability.

File: [Link] (File for reusable functions)

```php
<?php
function greetUser($name) {
return "Hello, " . $name . "!";
}

function calculateArea($length, $width) {

return $length * $width;
}
?>
```

File: [Link] (Shared header)

```php
<!DOCTYPE html>
<html>
<head>
<title>Modular PHP App</title>
</head>
<body>
<h1>Welcome to My Modular PHP App</h1>
```

File: [Link] (Shared footer)

```php
<footer>
<p>© 2024 Modular PHP App</p>
</footer>
</body>
</html>
```

File: [Link] (Main file)

```php
<?php
// Include shared files and functions
include '[Link]';
include '[Link]';

// Call functions
echo greetUser("KaGayak");

$area = calculateArea(5, 10);

echo "<p>The area of the rectangle is: " . $area . " square units.</p>";

include '[Link]';
?>
```

This modular structure allows you to reuse code efficiently, ensuring that updates are made in
one place, and all pages benefit from them.

4. Laboratory Activity: Using Functions and Server-Side Includes

Objective:
Students will create a PHP application that uses:
1. Functions to perform specific tasks like calculations or data processing.
2. Server-side includes to manage shared code such as navigation bars, headers, and footers.

Steps:
1. Create a [Link] file with at least three functions performing different tasks.
2. Design a [Link] and [Link] that can be included on multiple pages.
3. Build a [Link] file that includes the shared files and uses the functions for dynamic
content.

Interactive Demonstration:
In the demonstration, we’ll guide students through creating a PHP application using functions
and server-side includes to ensure they grasp how to write modular code and include shared
components efficiently.

Reference

- Nixon, R. (2018). *Learning PHP, MySQL & JavaScript: A Step-by-Step Guide to Creating
Dynamic Websites* (Pages 63-89).