0% found this document useful (0 votes)
74 views33 pages

Industrial Training (Cse 4389) : Submitted by

The document summarizes the key modules covered in an industrial training course on professional web application development. It outlines three modules: 1) Computer Fundamentals covering basic computer components, operating systems, and Microsoft Office applications. 2) Web Development covering HTML5, Bootstrap, and JavaScript for frontend development. 3) PHP for backend development. The document provides an overview of concepts taught in each programming language and technology.

Uploaded by

Half
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
0% found this document useful (0 votes)
74 views33 pages

Industrial Training (Cse 4389) : Submitted by

The document summarizes the key modules covered in an industrial training course on professional web application development. It outlines three modules: 1) Computer Fundamentals covering basic computer components, operating systems, and Microsoft Office applications. 2) Web Development covering HTML5, Bootstrap, and JavaScript for frontend development. 3) PHP for backend development. The document provides an overview of concepts taught in each programming language and technology.

Uploaded by

Half
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/ 33

INDUSTRIAL TRAINING (CSE 4389)

Submitted By:

MD OMAR FARUK
ID: 21190101035
DATE OF SUBMISSION: 02 OCTOBER 2021
APPROVAL

The Industrial Training Report on “Professional Web Application Development” submitted by


MD. OMAR FARUK, ID: 21190101035 to the Department of Computer Science & Engineering has
been accepted as satisfactory for the Course CSE 4389 titled Filed work (Industrial Training).

Board of Examiners:

1. Muhammed Samsuddoha Alam


(Supervisor)

2. Md. Ruhul Amin (Examiner)

__________________________
Md. Raihan-ul-Masood
Associate Professor & Head
Department of Computer Science & Engineering
Northern University Bangladesh

1|Page
Table of Contents
Introduction .................................................................................................................................................................5
Course details ...........................................................................................................................................................5
Course modules ........................................................................................................................................................5
Module 1 Computer Fundamentals ...........................................................................................................................6
Introduction .............................................................................................................................................................6
Input Components of a computer...........................................................................................................................6
Operating system .....................................................................................................................................................6
Parts of operating system ........................................................................................................................................6
File.............................................................................................................................................................................6
Word processing ......................................................................................................................................................6
MS WORD ...........................................................................................................................................................6
MS EXCEL ..........................................................................................................................................................7
MS POWERPOINT ............................................................................................................................................7
Module 2 .......................................................................................................................................................................8
HTML 5 ....................................................................................................................................................................8
What is html? .......................................................................................................................................................8
A simple html document example: .....................................................................................................................8
HTML Element ....................................................................................................................................................9
Web Browsers ......................................................................................................................................................9
HTML page structure .........................................................................................................................................9
HTML History .....................................................................................................................................................9
Bootstrap ................................................................................................................................................................ 11
Introduction ....................................................................................................................................................... 11
What is responsive web design? ....................................................................................................................... 11
Bootstrap 5 example .......................................................................................................................................... 11
Bootstrap Versions ............................................................................................................................................ 11
Advantages of Bootstrap ................................................................................................................................... 12
Where to get bootstrap ...................................................................................................................................... 12
Bootstrap CDN ................................................................................................................................................... 12
Bootstrap CDN Ling and scripts ...................................................................................................................... 12
Using bootstrap CDN ........................................................................................................................................ 13
Javascript ............................................................................................................................................................... 14
Introduction ....................................................................................................................................................... 14
Example of javascript ........................................................................................................................................ 14
JavaScript Example: code in JS file – .............................................................................................................. 15
JavaScript example: Between the head tag of the html .................................................................................. 15

2|Page
How to change content of HTML using JavaScript? ...................................................................................... 16
Comments In JavaScript: ................................................................................................................................. 16
Advantages of JavaScript comments: .............................................................................................................. 16
Javascript Variable: .......................................................................................................................................... 17
JavaScript Form Validation: ............................................................................................................................ 17
JavaScript Retype Password Validation Example: ........................................................................................ 18
JavaScript Functions: ........................................................................................................................................ 18
Advantage of JavaScript function .................................................................................................................... 19
JabaScript Function Syntax .............................................................................................................................. 19
JavaScript Control Statements: ....................................................................................................................... 19
If-else: ................................................................................................................................................................. 19
Javascript Switch:.............................................................................................................................................. 20
Module 3 ..................................................................................................................................................................... 21
PHP ......................................................................................................................................................................... 21
Introduction ....................................................................................................................................................... 21
History of php .................................................................................................................................................... 21
Features of php .................................................................................................................................................. 21
PHP code example ............................................................................................................................................. 22
Installing PHP .................................................................................................................................................... 22
Mysql ...................................................................................................................................................................... 23
Introduction ....................................................................................................................................................... 23
Usages: ................................................................................................................................................................ 23
Features: ............................................................................................................................................................. 23
PHP/MYSQL: Web application development ................................................................................................. 23
Why php? ........................................................................................................................................................... 24
Using PHP with a database system .................................................................................................................. 24
Module 4 ..................................................................................................................................................................... 25
Jquery ..................................................................................................................................................................... 25
Introduction ....................................................................................................................................................... 25
Why jQuery? ...................................................................................................................................................... 25
Adding jQuery to Web Pages ........................................................................................................................... 25
Downloading jQuery ......................................................................................................................................... 25
jQuery CDN ....................................................................................................................................................... 26
jQuery Syntax .................................................................................................................................................... 26
Module 5 ..................................................................................................................................................................... 27
Wordpress .............................................................................................................................................................. 27
Introduction ....................................................................................................................................................... 27
Themes ................................................................................................................................................................ 27
Plugins: ............................................................................................................................................................... 27

3|Page
Module 6 ..................................................................................................................................................................... 29
Laravel .................................................................................................................................................................... 29
Introduction ....................................................................................................................................................... 29
History of Laravel .............................................................................................................................................. 29
Features of Laravel ............................................................................................................................................ 30
Laravel Installation ........................................................................................................................................... 30
Composer............................................................................................................................................................ 31
Setup Laravel using Installer ............................................................................................................................ 31
Creating a project .............................................................................................................................................. 31
Conclusion .................................................................................................................................................................. 32

4|Page
Introduction
I have completed Professional Web Application Development course under the IT scholarship
programme of Islamic Development Bank – Bangladesh Islamic Solidarity Educational Wakf
(IsDB-BISEW).

Course details
Course name: Professional Web Application Development.
Training center name: US Software Limited.
Training center address: 69/B Monowara Plaza (2nd floor), Panthapath, Dhaka-1205.
Training center contract no: 01746176258, 01636096161
Training period: November 2020 to August 2021

Course modules
Module Description Course Duraction
(In Hours)
Module – 01 Computer Fundamentals 60
Module – 02 HTML5, Bootstrap, Javascript 100
Module – 03 Database Driven Web Application using PHP, MySQL 140
Module – 04 JQuery 40
Module – 05 Wordpress & Theme 40
Module – 06 Laravel 80
Total 460

5|Page
Module 1 Computer Fundamentals

Introduction
A computer is an electronic device, operating under the control of instructions stored in its own
memory that can accept data(input), process the data according to specified rules, produce
information(output), and store the information for future use.

There are three types of components on a computer system and they are:
1. Central processing unit

Input Components of a computer


device

3. Output device
4. Computer memory

Operating system
An operating system (OS) is an interface between hardware and user.

Parts of operating system

Shell: It is the outer part of an operating system and it is responsible for interacting with the
operating system

Kernel: It is responsible for managing and controlling the computer resource such as the
processor, main memory, storage device, input device, output device and communication device

File
A file is an object on a computer that stores data, information, settings or commands used with
a computer program.

Word processing

MS WORD
Ms-Word is an advanced word processing program, developed by Microsoft Corporation USA. It
is a family member of Ms-Office group. With the help of this program we can create any type of
documents report, thesis, designing & news paper etc.
It also save the document for future use with revision facility.

6|Page
MS EXCEL
Ms- Excel is one of the DBMS Software. It manipulates and manages the database in very well
manner. It provides the sophisticated tool for calculating, projecting and analyzing numeric data
& presenting the result in professional quality documents & chart.

Excel, for that matter any spreadsheet essentially comprises of row & column. Inter section of
row & column is called cell.

Work Book: - A work book is the main document of excel. By default a work-book has three
work-sheet, we can add more work-sheets.

Work sheet:-A work-sheet is the working document of excel. It has an electronic sheet where
calculation & operation are performed. The worksheet has 256 column & 65536 rows.

MS POWERPOINT
Ms-Power point is the presentation package. This application software is developed by
Microsoft Corporation. It is used to make slideshow, design, & formatting, set animation, sound
in particular slide.
This is mostly use in display project overview, display program on monitor or projector.

7|Page
Module 2
HTML 5
What is html?
➢ HTML stands for Hyper Text Markup Language
➢ HTML is the standard markup language for creating Web pages
➢ HTML describes the structure of a Web page
➢ HTML consists of a series of elements
➢ HTML elements tell the browser how to display the content
➢ HTML elements label pieces of content such as "this is a heading", "this is a paragraph",
"this is a link",etc.

A simple html document example:

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>


<p>My first paragraph.</p>

</body>
</html>

Here,
➢ The <!DOCTYPE html> declaration defines that this document is an HTML5 document
➢ The <html> element is the root element of an HTML page
➢ The <head> element contains meta information about the HTML page
➢ The <title> element specifies a title for the HTML page (which is shown in the browser's
title bar or in the page's tab)
➢ The <body> element defines the document's body, and is a container for all the visible
contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
➢ The <h1> element defines a large heading
➢ The <p> element defines a paragraph

8|Page
HTML Element

An HTML element is defined by a start tag, some content, and an end tag:

<tagname>Content goes here...</tagname>

The HTML element is everything from the start tag to the end tag:

<h1>My First Heading</h1>


<p>My first paragraph.</p>

Start Tag Element Document End tag


<h1> My First Heading </h1>
<p> My first paragraph </p>
<br> none </br>

Web Browsers

The purpose of a web browser (Chrome, Edge, Firefox, Safari) is to read HTML documents and
display them correctly.

A browser does not display the HTML tags, but uses them to determine how to display the
document:

HTML page structure

HTML History
Since the early days of the World Wide Web, there have been many versions of HTML:

9|Page
➢ 1989 Tim Berners-Lee invented www
➢ 1991 Tim Berners-Lee invented HTML
➢ 1993 Dave Raggett drafted HTML+
➢ 1995 HTML Working Group defined HTML 2.0
➢ 1997 W3C Recommendation: HTML 3.2
➢ 1999 W3C Recommendation: HTML 4.01
➢ 2000 W3C Recommendation: XHTML 1.0
➢ 2008 WHATWG HTML5 First Public Draft
➢ 2012 WHATWG HTML5 Living Standard
➢ 2014 W3C Recommendation: HTML5
➢ 2016 W3C Candidate Recommendation: HTML 5.1
➢ 2017 W3C Recommendation: HTML5.1 2nd Edition
➢ 2017 W3C Recommendation: HTML5.2

10 | P a g e
Bootstrap

Introduction
• Bootstrap is a free front-end framework for faster and easier web development
• Bootstrap includes HTML and CSS based design templates for typography, forms,
buttons, tables, navigation, modals, image carousels and many other, as well as optional
JavaScript plugins
• Bootstrap also gives you the ability to easily create responsive designs

What is responsive web design?

Responsive web design is about creating web sites which automatically adjust themselves to
look good on all devices, from small phones to large desktops.

Bootstrap 5 example

<div class="container-fluid p-5 bg-primary text-white text-center">


<h1>My First Bootstrap Page</h1>
<p>Resize this responsive page to see the effect!</p>
</div>

<div class="container mt-5">


<div class="row">
<div class="col-sm-4">
<h3>Column 1</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
<div class="col-sm-4">
<h3>Column 2</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
<div class="col-sm-4">
<h3>Column 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
</div>
</div>
</div>

Bootstrap Versions

Bootstrap 5 (released 2021) is the newest version of Bootstrap (released 2013); with new
components, faster stylesheet and more responsiveness.

11 | P a g e
Bootstrap 5 supports the latest, stable releases of all major browsers and platforms. However,
Internet Explorer 11 and down is not supported.

The main differences between Bootstrap 5 and Bootstrap 3 & 4, is that Bootstrap 5 has
switched to vanilla JavaScript instead of jQuery.

Advantages of Bootstrap
➢ Easy to use: Anybody with just basic knowledge of HTML and CSS can start using
Bootstrap
➢ Responsive features: Bootstrap's responsive CSS adjusts to phones, tablets, and
desktops
➢ Mobile-first approach: In Bootstrap, mobile-first styles are part of the core framework
➢ Browser compatibility: Bootstrap 5 is compatible with all modern browsers (Chrome,
Firefox, Edge, Safari, and Opera). Note that if you need support for IE11 and down, you
must use either BS4 or BS3

Where to get bootstrap


There are two ways to start using Bootstrap 5 on web site.
➢ Include Bootstrap 5 from a CDN
➢ Download Bootstrap 5 from getbootstrap.com

Bootstrap CDN

CDN stands for Content Delivery Network or Content Distribution Network. It helps us to
improve the rendering time and website performance.

Bootstrap CDN is a free content delivery network that helps us to quickly load Bootstrap CSS,
Javascript, and jQuery libraries on our projects to make projects responsive, mobile friendly,
and attractive.

Bootstrap CDN Ling and scripts

CSS link
<link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstra
p.min.css"/>

Javascript
<script src = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script
>

Jquery Library
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

12 | P a g e
Using bootstrap CDN
The below example shows that how we can use Bootstrap CDN on our code.
1. <!DOCTYPE html>
2. <html lang = "en">
3. <head>
4. <title>This is a Bootstrap CDN example</title>
5.
6. <meta name = "viewport" content = "width = device-width, initial-scale=1">
7. <link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/
bootstrap.min.css">
8. </head>
9. <body>
10. <div class = "container">
11. <h1 align = "center"> Welcome to JavaTpoint</h1>
12. <p>Write your text here..</p>
13. </div>
14.
15. <script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></scri
pt>
16. <script src = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js">
</script>
17. </body>
18. </html>

13 | P a g e
Javascript

Introduction
JavaScript is an object-based scripting language that is lightweight and cross-platform.
JavaScript is not compiled but translated. The JavaScript Translator (embedded in browser) is
responsible to translate the JavaScript code.

It is mainly used for:

➢ Client-side validation

➢ Dynamic drop-down menus.

➢ Displaying data and time.

➢ Displaying popup windows and dialog boxes (like alert dialog box, confirm dialog box
and prompt dialog box).

➢ Displaying clocks etc.

Example of javascript

<h2>Welcome to JavaScript</h2>

<script>

document.write("Hello JavaScript by JavaScript");

</script>

Here, <script> tag is used to initialize the script and document.write() is a function used to
write.

Like CSS, JavaScript also can be can be placed in:

1. Between the body tag of html

2. In js file (external javaScript)

3. Between the head tag of html

14 | P a g e
JavaScript Example: code in JS file –
➢ message.js file
1. function msg()
2. {
3. alert(“Hellow world”);
4. }
➢ index.html
1. <head>
2. <script type=”text/javascript” src=”message.js></script>
3. </head>
4. <body>
5. <p>Welcome to the java
6. </form>
7. <input type=”button” value=”click” onclick=”msg()”/>
8. <form>
9. </body>
We can create external Javascript file and embed in it many html page.
It provides code re usability because single Javascript file can be used in several html pages. An
external JavaScript file must be saved by .js extension. It is recommended to embed all
JavaScript files into a single file. It increases the speed of the webpage.

JavaScript example: Between the head tag of the html


In the example given below, we are having a function msg() which is called. To create a
function, we use function name with keyword function. For function call, we need to have an
event.

Example-
1. <head>
2. <script type=”text/javascript”>
3. function msg()
4. {
5. alert(“Hellow world”);
6. }
7. </script>
8. </head>
9. <body>
10. <p>Welcome to JavaScript</p>
11. <form>
12. <input type=”button” value=”click” onclick=”msg()”/>
13. </form>
14. </body>

15 | P a g e
How to change content of HTML using JavaScript?

One of many JavaScript HTML method is getElementById().

This example uses the method to "find" an HTML element (with id="demo") and changes the
element content (innerHTML.) to "Hello JavaScript":

1. <html>

2. <head>
3. <script>
4. function myFunction()
5. {
6. document.getElementById("demo").innerHTML = “paragraph changed.”;
7. }
8. </script>
9. </head>
10. <body>
11. <h1>My Web Page</h1>
12. <p id="demo>A Paragraph</p>
13. <button type="button" onclick="myFunction()">Try it</button>
14. </body>
15. </html>

Comments In JavaScript:
The JavaScript comments are meaningful way to deliver message. It is used to add information
about the code, warnings or suggestions so that end user can easily interpret code. The
JavaScript comment is ignored by the JavaScript engine i.e. embedded in the browser.

Advantages of JavaScript comments:


There are mainly two advantages of JavaScript comments,

➢ To make code easy to understand: It can be used to elaborate the code so that end user
can easily understand the code.

➢ To avoid the unnecessary code: It can also be used to avoid the code being executed.
Sometimes, we add the code to perform some action. But after sometime, there may be
need to disable the code. In such case, it is better to use comments.

Example-
1. <script type=”text/javascript>
2. function msg()

16 | P a g e
3. {
4. alert(“hellow java”>; /*this is a comment*/
5. }
6. </script>

Javascript Variable:

A JavaScript variable is simply a name of storage location. There are two types of variables in
JavaScrips: local variable and global variable. There are some rules while declaring a JavaScript
variable (also known as identifiers).

➢ Name must start with a letter (a to z or A to 2), underscore(Lor dollar $) sign.


➢ After first letter we can use digits (0 to 9), for example valse 1.

JavaScript variables are case sensitive, for example x und X are different variables.

JavaScript Form Validation:

It is important to validate the form submitted by the user because it can have inappropriate
values. So validation is must The JavaScript provides you the facility the validate the forth on
the client side so processing will be fast than server side validation. So, most of the web
developers prefer JavaScript form validation.

Through JavaScript, we can validate name, password, email, date, mobile number etc fields.

Example-

1. <script>
2. function validateform()
3. {
4. var name=document.myform.name.value;
5. var password=document.myform.password.value;
6. if(name==null || name==””)
7. {
8. alert(“name can’t be blank”);
9. return false;
10. }
11. else if(password.length<6)
12. {
13. alert(“Password must be at least 6 characters long.”);
14. return false;
15. }
16. }

17 | P a g e
17. </script>
18. <body>
19. <form name=”myform” method=”post” action=”abc.jsp” onsubmit=”return
validateform()”>
20. Name:<input type=”text” name=”name”></br>
21. Password:<input type=”password” name=”password”></br>
22. <input type=”submit value=”register”>
23. </form>
24. </body>

In this example, we are going to validate the name and password. The name can't be empty and
password can't be less than 6 characters long Here, we are validating the form on form submit.
The user will not be forwarded to the next page until given values are correct.

JavaScript Retype Password Validation Example:

1. <script type="text/javascript">
2. function matchpass()
3. {
4. var firstpassword=document.fl.password.value;
5. var secondpassword=document.fl.password2.value;
6. if(firstpassword=secondpassword)
7. {
8. return true;
9. }
10. else
11. {
12. alert("password must be same!");
13. return false;
14. }
15. }
16. </script>
17. <form name="f1" action="register.jsp" onsubmit="retum matchpass()">
18. Password:<input type="password" name="password" /><br/>
19. Re-enter Password:<input type="password" name="password2"/><br/>
20. <input type="submit">
21. </form>

JavaScript Functions:
JavaScript functions are used to perform operations. We can call Javascript function many times
to reuse the code.

18 | P a g e
Advantage of JavaScript function

There are mainly two advantages of JavaScript functions.


➢ Code reusability
➢ Less coding

JabaScript Function Syntax

The syntax of declaring function is given below:


1. function functionName([arg1, arg2, …argN])
2. {
3. //code to be executed
4. }
JavaScript Functions can have 0 or more arguments.

Example-
1. <script>
2. function msg()
3. {
4. alert(“hellow! this is message”);
5. }
6. </script>
7. <input type=”button” onclick=”msg()” value=”call function”/>

Output of the above example:


hellow! this is a message

JavaScript Control Statements:

If-else:
It Evaluates the content wheather condition is true or false. The syntax of JavaScript if-else
statement is given below:

1. if(expression)
2. {
3. //Content to be evaluated if condition is true
4. }
5. else
6. {
7. //content to be evaluated if condition is false
8. }

Example-

19 | P a g e
1. <script>
2. var a=20
3. if(a%2 == 0)
4. {
5. document.write(“a is even number”);
6. }
7. else
8. {
9. document.write(“a is odd number”);
10. }
11. </script>

Javascript Switch:

The JavaScript switch statement is used to execute one code from multiple expressions. It is just
like else if statement that we have learned in previous page. But it is convenient than t
if..else..if because it can be used with numbers, characters etc.The signature of JavaScript
switch statement is given below.

1. switch(expression)
2. {
3. case valuel:
4. code to be executed;
5. break;
6. case value2:
7. code to be executed;
8. break;
9. default: code to be executed if above values are not matched;
10. }

20 | P a g e
Module 3
PHP
Introduction

PHP is a open source, interpreted and object-oriented scripting language i.e. executed at server
side. It is used to develop web applications (an application i.e. executed at server side and
generates dynamic page).

➢ PHP stands for HyperText Preprocessor.


➢ PHP is a server side scripting language.
➢ PHP is an interpreted language, i.e. there is no need for compilation.
➢ PHP is an object-oriented language.
➢ PHP is an open-source scripting language. > PHP is simple and easy to learn language.

History of php
PHP (PHP: Hypertext Preprocessor) was created by Rasmus Lerdorf in 1994. It was initially
developed for HTTP usage logging and server-side form generation iUnix.

PHP 2 (1995) transformed the language into a Server-side embedded scripting language. Added
database support, file uploads, variables, arrays, recursive functions, conditionals, iteration,
regular expressions, etc.

PHP 3 (1998) added support for ODBC data sources, multiple platform support, email protocols
(SNMP.IMAP), and new parser written by Zeev Suraski and Andi Gutmans PHP 4 (2000) became
an independent component of the web server for added efficiency. The parser was renamed
the Zend Engine. Many security feature were added. PHP 5 (2004) adds Zend Engine II with
object oriented programming, robust XML support using the libxml2 library. SOAP extension for
interoperability with Web Services, SQLite has been bundled with PHP

Features of php

There are given many features of PHP.

➢ Performance: Script written in PHP executes much faster then those scripts written in
other languages such as JSP & ASP.
➢ Open Source Software: PHP source code is free available on the web, you can developed
all the version of PHP according to your requirement without paying any cost.
➢ Platform Independent: PHP are available for WINDOWS, MAC, LINUX & UNIX operating
system. A PHP application developed in one OS can be easily executed in other OS also.
➢ Compatibility: PHP is compatible with almost all local servers used today like Apache, IIS
etc.
➢ Embedded: PHP code can be easily embedded within HTML tags and script.

21 | P a g e
PHP code example
Note: =write HTML tags + PHP code and save this file with .php extension.

File: hellow.php
1. <html>
2. <body>
3. <?php
4. echo “<h2>hellow by PHP</h2>”;
5. ?>
6. </body>
7. </html>

Installing PHP
To install PHP, use to install AMP (Apache, MySQL, PHP) software stack. It is available for all
operating systems. There are many AMP options available in the market that are given below:

➢ WAMP for Windows


➢ LAMP for Linux
➢ MAMP for Mac(Macintosh)
➢ SAMP for Solaris
➢ FAMP for FreeBSD
➢ XAMPP (Cross, Apache, MySQL, PHP, Perl) for Cross Platform.

22 | P a g e
Mysql

Introduction
MySQL (My S-Q-L, or "My sequel") is a relational database management system (RDBMS) which
has more than 6 million installations. MySQL stands for "My Structured Query Language". The
program runs as a server providing multi-user access to a number of databases.

Usages:
MySQL is used in web applications and acts as the database component of the LAMP software
stack. Its popularity for use with web applications is closely tied to the popularity of PHP, which
is often combined with MySQL Several high-traffic web sites (including Flickr, Facebook.
Wikipedia, Google (though not for searches), Nokia, Auctionmarts and YouTube) use MySQL for
data storage and logging of user data.

Features:
➢ A broad subset of ANSI SQL 99, as well as extensions
➢ Cross-platform support
➢ Stored procedures
➢ Triggers
➢ Cursors
➢ Strict mode
➢ Updatable Views
➢ Query caching
➢ Sub-SELECTs (i.e. nested SELECTs)
➢ Replication with one master per slave, many slaves per master, no automatic support
for multiple masters per slave.

PHP/MYSQL: Web application development

PHP and MySQL are two leading open-source scripting and database technologies for web
designers today. They run on both linux and windows servers so your web host most likely
supports it. With the advent of PHS, PHP language has evolved to be an object oriented
programming language enabling more robust and standards based web applications.
Community websites leverages both PHP and MYSQL to build rich database driven dynamic and
inter websites and website applications. Our services include PHP and MySQL web
development, open source shopping carts, PHP, MySQL offshore development and PHP
programming services. We have a team of experienced coders dedicated to work on any
php/mysql project and have it delivered on time, per your specifications. PHP (or PHP Hypertext
Preprocessor) is a server-side scripting language that is used to create dynamic web pages that
can interact with databases. It is a widely-used open source language that is specifically used
for web application development and can be embedded within HTML.

23 | P a g e
Why php?
The distinguishing feature of PHP is that the scripting code is executed on the server, which
generates HTML that is sent back to the client. The client receives the result of executing the
script without knowing the underlying code. Developers can configure the web server to
process all the HTML files (containing the PHP script).

Using PHP with a database system


PHP, as a scripting language, is popular among web developers because of its ability to interact
with database systems including Oracle and MySQL.This article discusses the use of PHP
scripting

language with the MySQL database. Any website can require a variety of data or information to
display and to retrieve them from the database. This can include display of a simple list to the
running of the website based on data stored in the database.

Listed below are some examples where PHP and MySQL. can be used together:
➢ Digital Ad banners, where the PHP script can be used to retrieve a digital banner from
the database, which then selects a nindom banner from its table records and sends it
back to the calling script. The PHP script can also maintain a count of banner views and
clicks from the website.

➢ Internet forums or digital boards, which use PHP and MySQL to store and retrieve user
messages.

➢ Website designing, where the design of an entire website can be changed using a couple
of PHP scripts, instead of changing and uploading each web page. The PHP script can
access the MySQL database to retrieve all information about the web page.

24 | P a g e
Module 4
Jquery

Introduction
jQuery is a lightweight, "write less, do more", JavaScript library.

The purpose of jQuery is to make it much easier to use JavaScript on your website.

jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish,
and wraps them into methods that you can call with a single line of code.

jQuery also simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM
manipulation.

The jQuery library contains the following features:

➢ HTML/DOM manipulation
➢ CSS manipulation
➢ HTML event methods
➢ Effects and animations
➢ AJAX
➢ Utilities

Why jQuery?
There are lots of other JavaScript libraries out there, but jQuery is probably the most popular,
and also the most extendable.
Many of the biggest companies on the Web use jQuery, such as:
➢ Google
➢ Microsoft
➢ IBM
➢ Netflix

Adding jQuery to Web Pages


There are several ways to start using jQuery on your web site:
➢ By downloading the jQuery library from jQuery.com
➢ By Including jQuery from a CDN, like Google

Downloading jQuery
There are two versions of jQuery available for downloading:

➢ Production version - this is for your live website because it has been minified and
compressed
➢ Development version - this is for testing and development (uncompressed and readable

25 | P a g e
code)

Both versions can be downloaded from jQuery.com.

The jQuery library is a single JavaScript file, and you reference it with the HTML <script> tag
(notice that the <script> tag should be inside the <head> section):

1. <head>
2. <script src=”jquery-3.5.1.min.js”></script>
3. </head>
jQuery CDN
If you don't want to download and host jQuery yourself, you can include it from a CDN (Content
Delivery Network).
Google is an example of someone who host jQuery:
1. <head>
2. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
3. </head>

jQuery Syntax
The jQuery syntax is tailor-made for selecting HTML elements and performing some action on
the element(s).

Basic syntax is: $(selector).action()


➢ A $ sign to define/access jQuery
➢ A (selector) to "query (or find)" HTML elements
➢ A jQuery action() to be performed on the element(s)

Examples:
$(this).hide() - hides the current element.
$("p").hide() - hides all <p> elements.
$(".test").hide() - hides all elements with class="test".
$("#test").hide() - hides the element with id="test".

26 | P a g e
Module 5
Wordpress
Introduction
WordPress is a free and open-source content management system (CMS) written in PHP and
paired with a MySQL or MariaDB database. Features include a plugin architecture and a
template system, referred to within WordPress as Themes. Wordpress was originally created as
a blog-publishing system but has evolved to support other web content types including more
traditional mailing lists and forums, media galleries, membership sites, learning management
systems (LMS) and online stores. WordPress is used by 41.4% of the top 10 million websites as
of May 2021, WordPress is one of the most popular content management system solutions in
use. WordPress has also been used for other application domains, such as pervasive display
systems (PDS).

WordPress was released on May 27, 2003, by its founders, American developer Matt
Mullenweg[1] and English developer Mike Little, as a fork of b2/cafelog. The software is
released under the GPLv2 (or later) license.

To function, WordPress has to be installed on a web server, either part of an Internet hosting
service like WordPress.com or a computer running the software package WordPress.org in
order to serve as a network host in its own right. A local computer may be used for single-user
testing and learning purposes.

Themes

WordPress users may install and switch among different themes. Themes allow users to change
the look and functionality of a WordPress website without altering the core code or site
content. Every WordPress website requires at least one theme to be present and every theme
should be designed using WordPress standards with structured PHP, valid HTML (HyperText
Markup Language), and Cascading Style Sheets (CSS). Themes may be directly installed using
the WordPress "Appearance" administration tool in the dashboard, or theme folders may be
copied directly into the themes directory, for example, via FTP. The PHP, HTML and CSS found
in themes can be directly modified to alter theme behavior, or a theme can be a "child" theme
that inherits settings from another theme and selectively overrides features. WordPress themes
are generally classified into two categories: free and premium. Many free themes are listed in
the WordPress theme directory (also known as the repository), and premium themes are
available for purchase from marketplaces and individual WordPress developers. WordPress
users may also create and develop their own custom themes. The free theme Underscores
created by the WordPress developers has become a popular basis for new themes.

Plugins:

WordPress' plugin architecture allows users to extend the features and functionality of a
website or blog. As of May 2021, WordPress.org has 58,463 plugins available, each of which

27 | P a g e
offers custom functions and features enabling users to tailor their sites to their specific needs.
However, this does not include the premium plugins that are available (approximately 1,500+),
which may not be listed in the WordPress.org repository. These customisations range from
search engine optimization (SEO), to client portals used to display private information to
logged-in users, to content management systems, to content displaying features, such as the
addition of widgets and navigation bars. Not all available plugins are always abreast with the
upgrades, and as a result, they may not function properly or may not function at all. Most
plugins are available through WordPress themselves, either via downloading them and
installing the files manually via FTP or through the WordPress dashboard. However, many third
parties offer plugins through their own websites, many of which are paid packages.

Web developers who wish to develop plugins need to learn WordPress' hook system which
consists of over 2,000 hooks (as of Version 5.7 in 2021) divided into two categories: action
hooks and filter hooks.

Plugins also represent a development strategy that can transform WordPress into all sorts of
software systems and applications, limited only by the imagination and creativity of the
programmers. These are implemented using custom plugins to create non-website systems,
such as headless WordPress applications and Software as a Service (SaaS) products.

Plugins also could be used by hackers targeting the site that use WordPress, as hackers could
exploit bugs on WordPress plugins themselves instead of exploiting the bugs on WordPress
itself.

28 | P a g e
Module 6
Laravel

Introduction
Laravel is a free, open-source PHP web framework, created by Taylor Otwell and intended for
the development of web applications following the model–view–controller (MVC) architectural
pattern and based on Symfony. Some of the features of Laravel are a modular packaging system
with a dedicated dependency manager, different ways for accessing relational databases,
utilities that aid in application deployment and maintenance, and its orientation toward
syntactic sugar.

History of Laravel

Taylor Otwell created Laravel as an attempt to provide a more advanced alternative to the
CodeIgniter framework, which did not provide certain features such as built-in support for user
authentication and authorization. Laravel's first beta release was made available on June 9,
2011, followed by the Laravel 1 release later in the same month. Laravel 1 included built-in
support for authentication, localisation, models, views, sessions, routing and other
mechanisms, but lacked support for controllers that prevented it from being a true MVC
framework.

Laravel 2 was released in September 2011, bringing various improvements from the author and
community. Major new features included the support for controllers, which made Laravel 2 a
fully MVC-compliant framework, built-in support for the inversion of control (IoC) principle, and
a templating system called Blade. As a downside, support for third-party packages was removed
in Laravel 2.

Laravel 3 was released in February 2012 with a set of new features including the cmd
command-line interface (CLI) named Artisan, built-in support for more database management
systems, database migrations as a form of version control for database layouts, support for
handling events, and a packaging system called Bundles. An increase of Laravel's userbase and
popularity lined up with the release of Laravel 3.

Laravel 4, codenamed Illuminate, was released in May 2013. It was made as a complete rewrite
of the Laravel framework, migrating its layout into a set of separate packages distributed
through Composer, which serves as an application-level package manager. Such a layout
improved the extensibility of Laravel 4, which was paired with its official regular release
schedule spanning six months between minor point releases. Other new features in the Laravel
4 release include database seeding for the initial population of databases, support for message
queues, built-in support for sending different types of email, and support for delayed deletion
of database records called soft deletion.

Laravel 5 was released in February 2015 as a result of internal changes that ended up in

29 | P a g e
renumbering the then-future Laravel 4.3 release. New features in the Laravel 5 release include
support for scheduling periodically executed tasks through a package called Scheduler, an
abstraction layer called Flysystem that allows remote storage to be used in the same way as
local file systems, improved handling of package assets through Elixir, and simplified externally
handled authentication through the optional Socialite package. Laravel 5 also introduced a new
internal directory tree structure for developed applications.

Laravel 5.1, released in June 2015, was the first release of Laravel to receive long-term support
(LTS). New LTS versions were planned for one every two years.

Laravel 5.3 was released on August 23, 2016. The new features in 5.3 are focused on improving
developer speed by adding additional out of the box improvements for common tasks.

Laravel 5.4 was released on January 24, 2017, with many new features like Laravel Dusk, Laravel
Mix, Blade Components and Slots, Markdown Emails, Automatic Facades, Route Improvements,
Higher Order Messaging for Collections, and many others.

Laravel 6 was released on September 3, 2019, shift blueprint code generation, introducing
semantic versioning, compatibility with Laravel Vapor, improved authorization responses,
improved job middleware, lazy collections, and sub-query improvements. The frontend
scaffolding was removed from the main package and moved into the laravel/ui package.

Laravel 7 was released on March 3, 2020, with new features like Laravel Sanctum, Custom
Eloquent Casts, Blade Component Tags, Fluent String Operations and Route Model Binding
Improvements.

The latest Laravel version is version 8, which was released on September 8, 2020, with new
features like Laravel Jetstream, model factory classes, migration squashing, Tailwind CSS for
pagination views and other usability improvements.

Features of Laravel
➢ Routing controllers.
➢ Configuration management.
➢ Testability.
➢ Authentication and authorization of users.
➢ Modularity.
➢ ORM (Object Relational Mapper) features.
➢ Provides a template engine.
➢ Building schemas.
➢ E-mailing facilities.

Laravel Installation
Laravel framework needs few requirements for getting installed on your system. A virtual

30 | P a g e
machine has fulfilled each of these system requirements, Laravel's Homestead, hence it is a
must to implement Homestead as the Laravel development environment for your local system.

To install Laravel the following requirements must be fulfilled:

➢ PHP having version 7.0 or upper version


➢ An OpenSSL extension for PHP
➢ A PDO extension for PHP
➢ Mbstring extension for PHP
➢ Tokenizer extension for PHP
➢ XML extension for PHP

Composer
Laravel implements a composer for managing dependencies within it. Hence, before the use of
Laravel, it needs to check whether you have a composer setup on your system or not.

Composer can be installed by visiting https://getcomposer.org/download

It needs to be kept in mind to put the Composer's system-wide vendor in the bin directory
within your $PATH; as a result, your system can locate the executable of laravel. Depending on
which operating system you are using, this directory will exist. Still, for PCs having OS like MAC
and Linux, it will be:

macOS: $HOME/ .composer/vendor/bin


Linux OS: $HOME/.config/composer/vendor/bin

Setup Laravel using Installer


First of all, we have to download the Installer of Laravel with the help of Composer, like this:
➢ composer global require “laravel/installer”

When the installation is done, a new command of Laravel will start a new fresh installation in
that directory we provide:
➢ Laravel new directory name

Creating a project
The next thing we have to do is make a new folder in some specific path within the system for
keeping our Laravel projects. Move to that location where the directory is created. For installing
the Laravel, the following command we have to type:
➢ composer create-project Laravel/Laravel --prefer -dist

The command mentioned above will make Laravel installed on that specific directory. Type the
next command:
➢ php artisan serve

31 | P a g e
This above code will start the Laravel service. A black screen will appear showing the message:
Laravel Development server started on http://localhost:8080.
Copy and paste: http://localhost:8080 in the browser, and see the Laravel home screen
appears in your browser.

Conclusion
This was 460 Hours professional web application development course.
I have learned html, css, javascript, jquery, php, bootstrap, mysql, Laravel, wordpress
customization, wordpress theme development , wordpress plugin development from this
course.

32 | P a g e

You might also like