Scribd
Upload
2 views315 pages

WEB Development Course

Uploaded by

anesboukhecha42
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
2 views315 pages

WEB Development Course

Uploaded by

anesboukhecha42
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

Web basics

Dr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 1
Work Plan
1. WEB basics
2. HTML
3. CSS
4. Javascript
5. Jquery
6. UML
7. Database (Mysql)
8. PHP

2
1. WEB basics
● Internet
● World Wide Web (W3)
● Client-server architecture
● Web browser (client) / Web server
● Static vs Dynamic Website
● Front-end vs Backend
● Library, Framework, Plug-in, Add-ons
● HTTP protocol
● URL, URI, URN
● Code editor 3
Internet
- Internet, also known as "network of networks"

- Is a vast global computer network that connects millions of computers and

other digital resources around the world.

4
World Wide Web (WWW , W3)
- Refers to all public websites or pages that users can access on their

local computers and other devices via the Internet

5
Client-Server Architecture
- A design model used for communication between computers, software or

services.

- 2 types of entities interact: client and server.

6
Browser
⇒ Represents an essential software that facilitates your Internet exploration.

⇒ It offers you the opportunity to:

1. Visit websites
2. Search online
3. Read emails
4. Watch videos
5. Make purchases on the Internet
6. …etc.
7
Web Server
A web server is a computer or software that stores and transmits web

pages to users when they access a website.

8
The most used Web servers

9
Static website
A static website is a website whose content is previously created and does

not change depending on the user or other variables.

10
Static website

11
Dynamic Website
A dynamic website is a website whose content is generated in real time

based on user interactions or other running data.

12
Frontend, Backend
1. Frontend : the visible and interactive part of an application

2. Backend : is the non-visible part of an application that manages

behind-the-scenes operations, such as data management and server

processes.

13
14
Library vs Framework

The technical difference between a framework and a library is a term

called inversion of control.

15
Plug-in
A plug-in is a small piece of software that adds specific functionality to

an existing application.

16
Add-ons
Add-ons is a general term used to describe modules, extensions or

add-ins that enhance ( ‫ ) ﺗﺤﺴﯿﻦ‬functionality specific to an existing

software or system.

17
Protocol
A protocol is a set of rules for a specific mission

‫اﻟﺒﺮوﺗﻮﻛﻮل ھﻮ ﻣﺠﻤﻮﻋﺔ ﻣﻦ اﻟﻘﻮاﻋﺪ ﻟﻤﮭﻤﺔ ﻣﻌﯿﻨﺔ‬

18
Or : A protocol is a set of rules that define how two entities (objects) can

communicate on the network.

.‫اﻟﺒﺮوﺗﻮﻛﻮل ھﻮ ﻣﺠﻤﻮﻋﺔ ﻣﻦ اﻟﻘﻮاﻋﺪ اﻟﺘﻲ ﺗﺤﺪد ﻛﯿﻒ ﯾﻤﻜﻦ ﻟﻜﺎﺋﻨﯿﻦ اﻟﺘﻮاﺻﻞ ﻋﻠﻰ اﻟﺸﺒﻜﺔ‬

19

19
HTTP protocol (HyperText Transfer Protocol)

HTTP is a client-server communication protocol developed for the

World Wide Web

20
HTTP protocol (HyperText Transfer Protocol)

Hypertext is a way to link and access information of various kinds, such

as a network of nodes in which the user can navigate at will

21
HTTP communication process

22
HTTP communication process

23
24
25
HTTP Query

26
HTTP Response

27
URL, URI, URN

28
URI structure

29
Understanding the Web and HTTP

[Link]

30
Code editor
- Software that allows developers to create, modify and organize codes

for programming applications, websites, etc.

- Examples : Visual Studio Code, Sublime Text, PHPstorm.

31
32
Mr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 33
HTML
● HTML is the standard markup language for creating web pages

● HTML describes the structure of a web page

● The extension of html files is . html (ex: page_1.html)

34
Basic structure

35
Basic structure
● <!DOCTYPE html> : defines this document as an HTML5 document

● <html> : the root element of an HTML page

● <head> : contains meta information about the HTML page (SEO part)

● <body> : defines the body of the document (which sees the user)

36
Html Elements
- The HTML element is everything from the start tag to the end tag:

- <tagname> The content goes here… </tagname>

37
Html Elements

38
Heading

39
Paragraphs

40
Lists

1. Unordered list

41
Lists

2. Ordered list

42
Lists

3. Description List

43
Links

Images

44
Tables

⇒ Used to organize data into rows and columns.

45
Les tables

46
HTML attributes
- All HTML elements can have attributes

- Attributes usually come in name / value pairs

47
Classes
● The HTML class attribute is used to specify a class for an HTML

element.

● Multiple HTML elements can share the same class.

48
IDs
● The HTML id attribute is used to specify a unique identifier for an HTML

element

● You cannot have more than one element with the same identifier in an

HTML document

49
Forms

50
Forms

51
Form elements
The HTML <form> element may contain one or more of the following
form elements:
● input : to insert data with specific type (text , email , number …)
● label : to add explanation to input element
● select : select option from list
● textarea : input multi row
● button
● ….etc
52
Form elements - Input types

53
input attributes
1. value : an initial value for an input field

2. readonly : an input field is read-only.

3. disabled : an input field must be disabled

4. size: the visible width, in characters, of an Input (default = 20 )

5. maxlength : the maximum number of characters allowed in an input

field.
54
input attributes
6. min and max : the minimum and maximum values of an input field.

7. multiple : multiple values in an input field is allowed.

8. pattern : a regular expression against which the value of the input

field is checked when the form is submitted

55
input attributes
9. placeholder : a short index that describes the expected value of an
input field.

10. required : an input field must be completed before submitting the


form

11. step : the legal number intervals for an input field.

12. height and width : specify the height and width of a <input
type="image">
56
Form elements - Button

57
SEO (Search Engine Optimization)
- The purpose of any website is to generate traffic
- And many of these visitors come from search engines.
- The best ways to engage an audience is to use HTML tags for SEO.

58
HTML tags pour SEO
⇒ SEO is the process of improving your website to increase its visibility
in search engines (google, bing, etc.)

59
HTML Semantic vs Non-semantic elements

60
61
HTML tags pour SEO
[Link]

62
HTML Emmet
⇒ It is a way to write html code quickly

63
HTML Emmet
[Link]

64
CSS

Dr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 66
CSS
CSS describes how HTML elements should be displayed on the screen

67
CSS integration in HTML

68
CSS integration in HTML

69
CSS Syntax

70
CSS Box model

71
Common CSS properties

72
73
74
Common CSS properties
[Link]

75
CSS selectors

76
77
CSS Responsive Design
● Responsive web design makes your web page look good on all devices.

● Responsive web design uses only HTML and CSS

78
CSS responsive design - Viewport
- A Browser’s viewport is the area of the web page in which the content

is visible to the user.

- The viewport varies with the variation in screen size of the devices on

which the website is visible.

- For a laptop, the viewport has a larger size as compared to a

smartphone or tablet.
79
CSS responsive design - Viewport Syntax

<meta name="viewport" content="width=device-width, initial-scale=1.0">

- width =device-width : sets the width of the page to follow the

screen-width of the device

- initial-scale=1.0 : sets the initial zoom level when the page is first

loaded by the browser.


80
CSS responsive design - Viewport attributes

81
CSS responsive design - Grid view

Many web pages are based on a grid-view, which means that the page is

divided into columns

82
CSS responsive design - Grid view

Using a grid-view is very helpful when designing web pages. It makes it

easier to place elements on the page.

83
CSS responsive design - Grid view

A responsive grid-view often has 12 columns and has a total width of

100% , and will shrink and expand as you resize the browser window.

84
CSS responsive design - Grid view

Read more about grid view :

[Link]

85
CSS responsive design - Media queries

- Media query is a CSS technique introduced in CSS3.

- It uses the @media rule to include a block of CSS properties only if a

certain condition is true

86
CSS responsive design - Media queries Example

If the browser window is 600px or smaller, the background color will be

lightblue :

87
CSS responsive design - Media queries Example

88
CSS responsive design - Media queries Example

⇒ If we execute the code in screen is 600px or smaller :

89
CSS responsive design - Media queries
Read more about media queries :

[Link]

90
CSS responsive design - Images
If the width property is set to a percentage and the height property is set

to "auto", the image will be responsive and scale up and down :

91
CSS responsive design - Video
If the width property is set to a percentage and the height property is set

to "auto", the video will be responsive and scale up and down :

92
93
JavaScript

Dr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 94
95
Usefulness of Javascript ‫ﻓﺎﺋﺪة‬
● Create interactive elements : such as forms, drop-down menus, buttons and

animations.

● Event Processing : such as Mouse Clicks, Mouse Movements and Keyboard

Keys… e

● Data access : such as browsing history, cookies and user settings.

● Communication with the server : for example to send data or receive

answers. 96
JS integration
There are following 3 main ways to add JavaScript to your web pages:

1. Embedding code

2. Inline code

3. External file

97
JS integration

1. Embedding code : Adding the JavaScript code between a pair of

<script>...</script> tag

98
JS integration - Embedded

99
JS integration - Embedded

After clicking
on the button

100
JS integration - Inline
2. Inline code : Placing JS code directly inside HTML tags

After clicking on the button

101
JS integration - External file
3. External file : Making a separate JavaScript file having .js as an extension.

102
Output

JavaScript can “display” data in different ways:

1. Write in an HTML element, using innerHTML

2. Write to HTML output using [Link]()

3. Write to an alert box, using [Link]()

4. Writing to the browser console, using [Link]()

103
Output

104
Output

See different ways with example in :

[Link]

105
Keywords

106
Functions

108
Objects

const car = { type:"Fiat", model:"500", color:"white" };

109
Objects

110
HTML Events

An HTML event can be something the browser does, or something a user

does.

1. An HTML web page has finished loading

2. An HTML input field has been modified

3. An HTML button has been clicked

4. ….etc.
111
Common HTML Events
Html Events

See different ways with example in :

[Link]

114
Loops
JavaScript supports different types of loops:

115
Loops
1. for - loop through a block of code a number of times

2. for/in - loops the properties of an object

3. for/of - loops the values of an iterable object

4. while - loop through a block of code when a specified condition is true

5. do/while - loop also through a block of code when a specified condition

is true

116
Loops
for - loop through a block of code a number of times

● Expression 1 is executed (one time) before the execution of the code


block.
● Expression 2 defines the condition for executing the code block.
● Expression 3 is executed (every time) after the code block has been
executed. 117
Loops

118
For loop

119
Loops

for/in - loops the properties of an object

120
For in loop

121
Loops
for/of - loops the values of an iterable object

- variable : can be declared with const, let, or var.

- iterable : An object that has iterable properties.

122
For of loop

123
Loops

while - loop through a block of code when a specified condition is true

124
While loop

125
Loops

do/while - loop also through a block of code when a specified condition is true

126
Do while Loops

127
Break/continue

128
HTML DOM Elements

129
HTML DOM Elements

130
HTML DOM Elements
- Often, with JavaScript, you want to manipulate HTML elements.
- To do that, we must first find the elements. There are several ways of doing
it:
1. Find HTML elements by id
2. Find HTML elements by tag name
3. Find HTML elements by class name
4. Search for HTML elements by CSS selectors
5. Search for HTML elements by HTML object collections

131
HTML DOM Elements

132
HTML DOM Elements

133
API
API in simple words : a website without frontend

134
API call in Javascript
4 Ways to Make an API Call in JavaScript:

1. API Call in JavaScript Using XMLHttpRequest

2. API Call in JavaScript Using the fetch() method

3. API call in JavaScript using Axios

4. API call in JavaScript Using the jQuery AJAX

135
API call in Javascript - fetch() method

136
API call in Javascript
See all methods with examples :

[Link]

137
Jquery

Dr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 139
Jquery ?
- jQuery is a lightweight JavaScript library, "write less, do more".

- jQuery also simplifies a lot of complicated things about JavaScript,

like AJAX calls (calls BDD in real time) and DOM manipulation.

140
⇒ The jQuery library contains the following features:

● HTML/DOM manipulation

● CSS manipulation

● HTML Event Methods

● Effects and animations

● AJAX

141
Syntax

⇒ The basic syntax is: $(selector). action()

1. $ sign to set/access jQuery

2. selector to search (or find) HTML elements

3. action() to perform an action on the element(s)

142
Examples

$(document).ready(function(){

$("p"). hide() // hides all <p> elements.

$(".test"). hide() // hides all elements with class="test".

$("#test"). hide() // hides the element with id="test".

});

143
Jquery Selectors

144
Jquery Selectors

145
Jquery Events

146
147
- See more examples of Jquery events :

[Link]

148
Json
- JSON is one of the data exchange formats

- JSON comes in the form of light text

149
150
Jquery Ajax

⇒ AJAX = Asynchronous JavaScript and XML.

⇒ Load data in the background and display it on the web page, without

reloading the entire page.

151
Jquery Ajax

152
jQuery call api
$(document).ready(function() {
$.ajax({
url: '[Link]
method: 'GET',
dataType: 'json',
success: function(data) {
[Link]('API response:', data);
},
error: function(error) {
[Link]('Error:', error);
}
});
});
153
154
UML

Dr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 155
1. UML ?

The unified modeling language is a visual modeling language that is

intended to provide a standard way to visualize the design of a system.

156

156
1. why UML ?

- UML diagram provides a visual representation of an aspect of a

system.

- UML diagrams illustrate the quantifiable aspects of a system that can

be described visually, such as relationships, behavior, structure, and

functionality
157

157
2. UML diagrams

158

158
2. UML diagrams
1. Static View

Focuses on the structure of the system showing elements like classes,

objects, and packages, and their relationships.

2. Functional View

Represents the functionality of the system and how users interact with it

through use case diagrams.

159

159
2. UML diagrams
3. Dynamic View

Describes how the system behaves over time, detailing the flow of control

or data through various interactions and state changes.

160

160
Class diagram
- Used to represent the static structure of a software system.
- It represents the system plane ( classes, attributes, methods and relationships
between classes)

161
Class diagram

162
Class diagram

- An abstract class is a class that cannot be instantiated

- It serves as the basis for other derived (inherited) classes

163
Normalizing the Class Diagram

1NF : All data must be atomic ( a single value and not a list of values ) and constant over
time

Person Person Notes


ID
ID ID note
first_name_last_name first_name
age last_name
notes[100] birth_date

164
- 2NF: (on association classes)
1. In addition to respecting the rules of 1NF
2. a table must not contain partial dependencies. A partial dependency exists
when a non-primary key column depends only on part of a composite primary
key.

Product Com_Prod Command


ID
ID ID
quantity
name date
price

165
3NF:

1. In addition to respecting the rules of 2NF


2. A table must not contain any transitive dependency. A transitive dependency
exists when a non-primary key column depends on another non-primary key
column.

Employee Employee Grade


ID ID
first_name ID
first_name
last_name grade_name
last_name
grade salary
salary

166
Use case Diagram

It shows the interactions between the actors and the system, describing the
features offered by the system.

167
Sequences diagram

It illustrates the sequence of interactions between objects or system components


over time.

168
169
Database - Mysql

Dr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 171
Database concept - ‫ﻗﺎﻋﺪة اﻟﺒﯿﺎﻧﺎت‬
The database is simply a huge file used to store information in an

organized way

‫ﻗﺎﻋﺪة اﻟﺒﯿﺎﻧﺎت ھﻲ ﺑﺒﺴﺎطﺔ ﻣﻠﻒ ﺿﺨﻢ ﯾﺴﺘﺨﺪم ﻟﺘﺨﺰﯾﻦ اﻟﻤﻌﻠﻮﻣﺎت ﺑﻄﺮﯾﻘﺔ ﻣﻨﻈﻤﺔ‬

172
The importance of databases

- Easily accessible and managed data (‫)ﯾﺴﮭﻞ اﻟﻮﺻﻮل إﻟﻰ اﻟﺒﯿﺎﻧﺎت وإدارﺗﮭﺎ‬

- Access to information very quickly (especially if indexes are used)

(‫اﻟﻮﺻﻮل إﻟﻰ اﻟﻤﻌﻠﻮﻣﺎت ﺑﺴﺮﻋﺔ ﻛﺒﯿﺮة )ﺧﺎﺻﺔ إذا اﺳﺘﺨﺪﻣﺖ اﻟﻔﮭﺎرس‬

- No need to duplicate the information (‫) ﻻ ﺣﺎﺟﺔ ﻟﺘﻜﺮار اﻟﻤﻌﻠﻮﻣﺎت‬

- The ability to create backups ( ‫) اﻟﻘﺪرة ﻋﻠﻰ إﻧﺸﺎء ﻧﺴﺦ اﺣﺘﯿﺎطﯿﺔ‬

- ……etc.
173
The tables of a database

- This is the basic structure in all BDD types

- Used to represent the information we will store in our BDD

174
The tables of a database

⇒ Each table is composed of 2 important notions

1. The name

2. The attributes with their type (one of them primary key)

175
The tables of a database

176
Key types

177
Key types
1. Primary Key

- A unique identifier for each record in a table.

- Ensures that no two rows have the same value.

- Cannot contain NULL values.

178
2. Foreign Key
- A field (or collection of fields) in one table that uniquely identifies a row of
another table.
- Establishes a relationship between two tables.
- Enforces referential integrity.

179
3. Composite Key
- A primary key composed of two or more columns to uniquely identify a row.

- Used when a single column is not sufficient to identify a row uniquely.

180
4. Candidate Key
- A column or set of columns that could be used as a primary key.

- There can be multiple candidate keys in a table.

- One of the candidate keys is chosen as the primary key.

181
5. Alternate Key
- A candidate key that is not chosen as the primary key.

- Still ensures uniqueness of the column.

182
6. Super Key
- A set of one or more columns that can uniquely identify a row in a table.

- Includes the primary key and candidate keys, as well as any additional

attributes.

183
7. Unique Key
- Ensures all values in a column or set of columns are unique.

- Similar to primary keys but can accept one NULL value (in some databases).

184
What is a relational database ?

- A relational database is a database that uses relationships between tables

to organize information

- This notion is implemented using another notion called “foreign keys”

185
What is a relational database ?

186
Relational vs Non-relational database?

187
Types of data in SQL
Data type Description Example

Int Integer 134

Varchar ( length) String (dynamic length) ‘Ahmed’

Date Dates ‘2024-02-23’

Float Floats 12.7

Boolean the boolean values True , False

Char ( length) string (fixed length) ‘ABC’

Decimal ( p , s ) Float with conditions 13.356 p = 5 , s=3

Timestamp Date and hour ‘2024-01-03 19:26:45’

Text long texts ‘ long text …….’


188
Types of data in SQL

189
SQL
- SQL is the standard language for processing relational databases.

- SQL is used to insert, search, update, and delete database records.

190
The most important SQL commands

● Data Definition Language (DDL)

● Data Manipulation Language (DML)

● Data Control Language (DCL)

● Transaction Control Language (TCL)

● Data Query Language (DQL)

191
The most important SQL commands

192
The most important SQL commands

1. SELECT - extracts data from a database

2. UPDATE - updates data in a database

3. DELETE - deletes data from a database

4. INSERT INTO - inserts new data into a database

5. CREATE DATABASE - creates a new database

6. ALTER DATABASE - modifies a database


193
The most important SQL commands

7. CREATE TABLE - create a new table

8. ALTER TABLE - modifies a table

9. DROP TABLE - delete a table

10. CREATE INDEX - create an index (search key)

11. DROP INDEX - delete an index

194
DBMS
A database management system (DBMS) is a system software that
allows users and programmers to create and manage databases.

195
- Well-known DBMS: Oracle, SQl server, Mysql, Postgresql,

Mariadb, mongoDB

196
Install MySQL in Ubuntu

[Link]
Install Postgres in Ubuntu

[Link]
tall-and-configure-postgresql-on-ubuntu-20-04-4fd3cf072d6f
Database Administration Tool
These tools provide a graphical / Web interface to automate related
tasks with databases
‫ﺗﻮﻓﺮ ھﺬه اﻷدوات واﺟﮭﺔ رﺳﻮﻣﯿﺔ ﻟﻠﻘﯿﺎم ﺑﺎﻟﻤﮭﺎم ذات اﻟﺼﻠﺔ ﺑﻘﻮاﻋﺪ اﻟﺒﯿﺎﻧﺎت‬

199
Exercise
1. Create a database called "ManageEmployees".
2. In this database, create a "Employees" table with the following
columns
● ID (integer, primary key, auto-incremented)
● Name (string of characters)
● Age (number)
● post (string)

200
Exercise (following)
1. Insert 3 dummy employees in the "Employees" table.

2. Display all employees at the table.

3. Update the age of the second employee to 30.

4. Remove the third employee from the table.

201
Aggregate Functions
An aggregate function is a function that performs a calculation on a set of

values, and returns a single value

‫ وﺗﻌﯿﺪ ﻗﯿﻤﺔ واﺣﺪة‬،‫اﻟﺪاﻟﺔ اﻟﺘﺠﻤﯿﻌﯿﺔ ھﻲ داﻟﺔ ﺗﻘﻮم ﺑﺤﺴﺎب ﻣﺠﻤﻮﻋﺔ ﻣﻦ اﻟﻘﯿﻢ‬

202
Aggregate Functions - Example

203
Aggregate Functions

204
Transactions
A transaction in a database is a sequence of operations performed as a

single unit of work.

These operations can include actions like reading or updating data

‫اﻟﻤﻌﺎﻣﻠﺔ ﻓﻲ ﻗﺎﻋﺪة اﻟﺒﯿﺎﻧﺎت ھﻲ ﺳﻠﺴﻠﺔ ﻣﻦ اﻟﻌﻤﻠﯿﺎت اﻟﺘﻲ ﯾﺘﻢ إﺟﺮاؤھﺎ ﻛﻮﺣﺪة ﻋﻤﻞ واﺣﺪة‬

‫ﯾﻤﻜﻦ أن ﺗﺸﻤﻞ ھﺬه اﻟﻌﻤﻠﯿﺎت إﺟﺮاءات ﻣﺜﻞ ﻗﺮاءة اﻟﺒﯿﺎﻧﺎت أو ﺗﺤﺪﯾﺜﮭﺎ‬


205
Transactions when ?
Transactions should be used when there is the possibility that either

failure to complete or someone else reading or writing in the middle of

your task could cause damage to the data

‫ﯾﺠﺐ اﺳﺘﺨﺪام اﻟﻤﻌﺎﻣﻼت ﻋﻨﺪﻣﺎ ﯾﻜﻮن ھﻨﺎك اﺣﺘﻤﺎل أن ﯾﺆدي ﻋﺪم إﻛﻤﺎل أو ﻗﺮاءة أو ﻛﺘﺎﺑﺔ ﺷﺨﺺ‬

‫آﺧﺮ ﻓﻲ ﻣﻨﺘﺼﻒ ﻣﮭﻤﺘﻚ إﻟﻰ ﺗﻠﻒ اﻟﺒﯿﺎﻧﺎت‬


206
Transactions Syntax

207
Transactions

208
ACID properties

[Link]
Functions
A Database Function is a routine that accepts parameters, performs an

action (such as a complex calculation) and returns the result of that action

as a value
Functions keywords
1. Parameters: Functions can accept input parameters, which allow you to pass

values to the function when you call it.

2. Action : The function performs a specific action or series of actions. This

could be a calculation, data transformation, or any other operation.

3. Return Value : The function returns a single value as the result of its

processing. This value can be of any data type supported by the database.
Functions syntax
Functions - Example
Triggers
- A trigger is a database object that is associated with a table.

- It will be activated when a defined action is executed for the table.


Triggers
The trigger can be executed when you run one of the following statements on the

table: INSERT, UPDATE and DELETE and it can be invoked before or after the

event.
Triggers Syntax
Triggers Syntax

Keyword Uses
Create trigger This keyword begins the syntax for creating a new trigger in
MySQL
BEFORE | AFTER These keywords specify when the trigger should execute
INSERT | UPDATE | specify the database operation that causes the trigger to fire
DELETE
ON table_name specifies the table on which the trigger is defined
FOR EACH ROW specifies that the trigger should execute once for each row in
the table
Triggers Syntax

Keyword Uses
BEGIN ... END Used to enclose the body of the trigger

NEW Refers to the new values that will be inserted or updated into the
table
OLD Refers to the old values that will be inserted or updated into the table
SET used to assign values to variables or to update column values in the
`NEW` statement
Triggers Syntax

Keyword Uses
IF ... THEN ... END IF used for conditional logic within trigger bodies,

allowing you to execute certain SQL statements based

on conditions
INSERT INTO used to insert rows into a table, often used within

trigger bodies to log changes or perform audit trails


Triggers Example
Triggers Example
PHP

Mr Benabderrezak
Researcher in Cyber Security
Full-stack Web developer 224
PHP ?
● PHP is a server scripting language, and a powerful tool for creating dynamic

and interactive web pages.

225
How does PHP work?

226
Syntax

227
Variables
● A variable starts with $ followed by the variable name

- Ex: $variable_name

● A variable name must begin with a letter (a , b , z , i ) or the

underscore character ( _ )

● A variable name cannot start with a number

228
Variables
● A variable name can only contain alphanumeric characters and underscores

(A-z, 0-9 and _ )

● Variable names are case sensitive ($age and $AGE are two different

variables

229
Variables

230
Data types
String $name = ”ahmed”;

Integer $number = 12;

Float (double) $float_number = 10.367;

Boolean $bool_var = true;


$another = false;

Array $array = array(‘a’,’b’, ‘c’);

$array_2= [‘a’,’b’,c’];

Object instance of class

NULL $x = null;
231
Constants
- A constant is an identifier (name) for a single value.

- The value cannot be changed during the script.

- Unlike variables, constants are automatically global across

the entire script.

232
Constants

- A valid constant name begins with a letter or underscore (no $ sign

before the constant name).

- Ex: variable_name , _another_variable

233
Constants
- Syntaxe : define(nom, valeur)

234
Magic constants
PHP has 9 predefined constants that change values depending on

where they are used, and so they are called "magic constants".

235
Les constants magiques

236
Operators
1. Arithmetic: +, - , *, / , % , **

2. Assignment: $x = $y , $x += $y, $x -= $y, $x /= $y, $x %= $y

3. Comparison: == , ==, != , <>, !=, <, <= , > , >=, < = >

4. Increment/ Decrement: - -$x, $x - - , $x++ , ++$x

5. Logic: and, && , or, |, ! (not), xor

6. Strings : . (concatenation) , .= (concatenation with old value)

7. Arrays : + , == , ===, != , <> , !==


237
Operators

238
Conditions
1. if (condition) { // code}
2. if (condition { // code} else { // another code}
3. if (condition 1 ) { ……} elseif (condition 2 ) { ….} else { ….}
4. switch ($var) {
case 1 : instructions; break;
case 2 : instructions ; break;
…..
default : code to execute if n is different from all labels ;
}
239
Loop
1. while (condition) { // code}

2. do { // code } while (condition)

3. for ($val_init ; $stop_condition; $incrementation) { // code}

4. foreach ( $variables as $var) { // code}

240
Functions
⇒ syntax : function function_Name() { // code to be executed; }

241
PHP forms
⇒ PHP $_GET and $_POST superglobals are used to collect form

data.

[Link]

[Link]

242
Arrays
- An array is a special variable that can hold many values under a single name

- you can access the values by referring to an index number or name.

243
1- Indexed array

244
1- Indexed array

245
1- Indexed array

246
1- Indexed array

247
1- Indexed array

248
1- Indexed array

249
2- Associative array

250
2- Associative array

251
2- Associative array

252
253
254
3- Multidimensional Arrays

255
3- Multidimensional Arrays

256
3- Multidimensional Arrays

257
3- Multidimensional Arrays

258
3- Multidimensional Arrays (display elements using loops)

259
Array functions

260
Array functions

261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
PHP with MySQL

277
PHP with MySQL

278
279
280
281
282
283
284
PHP sessions
- A session is a way to store information (in variables) to be used across

multiple pages.

- Unlike a cookie, the information is not stored on the users computer

285
PHP sessions
- To use php session , you must start it :

- Then, you define session attributes :

286
PHP sessions
- To use php session attributes:

287
PHP sessions
- To close or destroy php session

288
References

289
PHP OOP
Object-oriented programming (OOP) is a computer programming model

that organizes software design around data, or objects, rather than functions

and logic

290
PHP OOP concepts
Before we dive into PHP specifics, let's grasp the core concepts of OOP:

● Classes / Objects

● Inheritance

● Polymorphism

● Encapsulation

● Abstraction
291
PHP OOP concepts
● Classes : Blueprints for creating objects, defining their structure and actions

● Objects : Instances of classes, representing real-world entities with properties

(attributes) and behaviors (methods)

292
PHP OOP concepts
● Inheritance : Creating new classes based on existing ones, inheriting

properties and methods

293
PHP OOP concepts
● Polymorphism : the ability of any data to be processed in more than

one form

294
PHP OOP concepts
● Encapsulation : Bundling data (properties) and methods that operate

on that data within one unit (object)

295
PHP OOP concepts
● Abstraction : Focusing on essential features while hiding

implementation details

296
PHP OOP concepts
● Constructor : A special type of function called to create an object

297
PHP OOP - Example

298
MVC
Model–view–controller (MVC) is a software design pattern commonly used

for developing user interfaces that divides the related program logic into

three interconnected elements

299
MVC

300
MVC - user request handling

301
302
Laravel ?

● Laravel is an open-source PHP web framework, designed for the

development of web applications following the MVC architectural

model.

● Laravel aims to facilitate common tasks such as authentication, session

management, and caching.

303
Why Laravel ?

304
Laravel Project Structure

305
Laravel Project Structure
● app : Contains the source code of the application (templates, controllers, etc.).

● bootstrap : Contains the application’s boot file.

● config : Contains the configuration files.

● database : Contains migrations, plants and seeds.

● public : Contains the [Link] input file and the public resources.

306
Laravel Project Structure
● resources : Contains raw views, language files and assets.

● routes : Contains the route definitions for the application.

● storage : Contains the logs, generated files and cache.

● tests : Contains automated tests.

● vendor : Contains the dependencies of Composer.

307
Laravel Routes
- Routes define the application entry points

- They are defined in the files located in the "routes" directory

308
Laravel Controllers
- Controllers contain the logic for processing HTTP requests.

- They are located in the app/Http/Controllers directory.

309
Laravel Controllers
- To create a controller : php artisan make:controller UserController

- Example of a method in a controller :

310
Laravel View
- The views are Blade files located in the resources/views directory.

- They contain the application’s HTML code

311
Laravel Model
- A class interact with the database, and is associated with a database table

- They are located in the app/models directory

312
PHP & Laravel development environment
If you are using windows; the best environment for PHP & laravel development is

Laragon

[Link]
313
Laravel CRUD Application
To build a simple crud in laravel , follow these steps :

[Link]

xample-tutorial-42f0c2d3b13d

314

You might also like