Making Of PHP Based Web Application

PHP DEVELOPER INTERNS / CLIENT BRIEF
BASICS OF WHAT GOES INTO MAKING OF
PHP, MYSQL BASED WEB APPLICATION

PHP DEVELOPER INTERNS / CLIENT BREIF
BASICS OF WHAT GOES INTO MAKING OF PHP, MYSQL BASED WEB APPLICATION
• HTML, CSS, JAVASCRIPT, JQUERY,
• CLIENT & SERVER SIDE SCRIPTING
• AJAX
• THE TEAM
• CODE EDITORS
• TOOLS - WIREFRAME, IMAGE EDITING, VIDEO EDITING, ANIMATION
• HOSTING
• VERSION MANAGEMENT
• SOFTWARE DEPLOYMENT
• TRADITIONAL DEVELOPMENT
• AGILE METHODOLOGY
• SOFTWARE DOCUMENTATION
• BIBLOGRAPHY
comments & critique welcome | sachinwalvekar@gmail.com | http://www.tropicacluster.com
2
INDEX

I felt necessity of creating this brief slideshow, so as to help PHP
Developer interns and communicating the intricacies of
development with my clients easier. I thought the more deeply
clients understood what really went into translating their ideas to
web applications under the hood, the better it could translate to
!
exchange of design issues,
appreciation of development process intricacies,
resulting delivery time & cost issues.
!
So I quickly put together information that I found on internet &
have tried to make an attempt. Hope this helps other developers
too... Your comments & critique are welcome in terms of
improving & simplifying this slide show.
!
Thanks!!
!
Sachin Walvekar
3

HTML - Hyper Text Markup Language
A markup language is a set of markup tags. In the document above html, title, head, body, h1, p, ul, li are markup tags.

h1 - is a heading tag, p - is a paragraph tag, ul - encloses unordered list, li - list

Elements in web page are enclosed in opening & closing tags.

Example <p>Lorem ipsum prisma magnol nummes </p>
Current
version of
HTML IS 5
More info - http://www.w3schools.com/html/default.asp
4

CSS - Cascading Style Sheet
Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation
of a document written in a markup language.

h1, body, p are tags that can be given properties as given above. In the example above p is
paragraph tag, that has been given background-color "Yellow".
Current
version of
CSS IS 3
More info - http://www.w3schools.com/html/html_css.asp
HTML CSS
(content) (presentation)
simple web page
5

JavaScript
A scripting language developed to enable Web authors to design interactive sites.

Javascript can interact with HTML source code, enabling Web authors to spice up their sites with dynamic content.

Content that changes frequently is called dynamic content. Example displaying seats available for booking in a show.

JavaScript is endorsed by a number of software companies and is an open language that anyone can use without
purchasing a license.
More info - http://www.w3schools.com/js/
HTML CSS
web page
JAVASCRIPT
(behavior)
ECMAScript 6 (released in June 2015) is
the latest ofﬁcial version of JavaScript.
6

jQuery
jQuery is a fast and concise JavaScript Library with a nice motto − Write less, do more. Jquery is also know as JavaScript
framework.

jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods
(something similar to functions in structured language) that you can call with a single line of code.

jQuery library is made up of JAVASCRIPT + HTML + CSS

jQuery simpliﬁes HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.

There are lots of other JavaScript frameworks out there, but jQuery seems to be the most popular, and also the most extendable.
Some popular example angularjs by google, nodejs by nodejs foundation.
More info - http://www.w3schools.com/jquery/default.asp Example - https://jqueryui.com/demos/
HTML CSS
web page
JAVASCRIPT
(behavior)
jQuery
(library)
and
7

Client & Server Side Scripting & Programming
A. The client-side environment used to run scripts is usually a browser. The processing takes place on the clients
computer. The source code is transferred from the web server to the clients computer over the internet and runs directly
in the browser.

B. The server-side environment that runs a scripting language is a web server. A user's request is fulﬁlled by running a
script directly on the web server to generate dynamic HTML pages. This HTML is then sent to the client browser. It is
usually used to provide interactive web sites that interface to databases or other data stores on the server.

• This is diﬀerent from client-side scripting where scripts are run by the viewing web browser, usually in JavaScript.
The primary advantage to server-side scripting is the ability to highly customize the response based on the user's
requirements, access rights, or queries into data stores.
Client
(your laptop or desktop)
Internet
(you connect using your ISP)
Web Server
(Large array of computers, remotely located, connected
to internet, accessible from internet 24/7. Your data is
accessed from here when you type web address.
Database servers are also located here.)
8

Ajax
Ajax (also AJAX; short for asynchronous JavaScript and XML) is a set of web development techniques utilizing many
web technologies used on the client-side to create asynchronous Web applications.

In synchronous programming, each step is performed one after the previous one is ﬁnished executing. In
asynchronous, step 2 will be performed even if step 1 isn't ﬁnished.

AJAX is a technique for creating fast and dynamic web pages.

AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind
the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.

Classic web pages, (which do not use AJAX) must reload the entire page if the content should change.

Examples of applications using AJAX: Google Maps, Gmail, YouTube, and Facebook.

In case you want to go little deeper in understanding - AJAX is based on internet standards, and uses a combination
of:

XMLHttpRequest object (to retrieve data from a web server)

JavaScript/DOM (to display/use the data)

In the demo below, clicking on "make Ajax request" the time updates on page without having to refresh the page.
More info - http://www.w3schools.com/Ajax/ajax_intro.asp
Example - http://click.avoka.com/click-examples/ajax/compare/jquery-ajax-demo.htm
9

PHP
PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open
source general-purpose scripting language that is especially suited for web
development and can be embedded into HTML.

Nice, but what does that mean? An example:
More info - http://php.net/manual/en/intro-whatis.php
What distinguishes PHP from
something like client-side JavaScript
is that the code is executed on the
server, generating HTML which is
then sent to the client. The client
would receive the results of running
that script, but would not know what
the underlying code was.
10

MySQL
MySQL, the most popular Open Source SQL database management system, is developed, distributed, and supported by
Oracle Corporation.

MySQL is a database management system.

A database is a structured collection of data. It may be anything from a simple shopping list to a picture gallery or the vast
amounts of information in a corporate network. To add, access, and process data stored in a computer database, you need
a database management system such as MySQL Server. Since computers are very good at handling large amounts of data,
database management systems play a central role in computing, as standalone utilities, or as parts of other applications.

More info - https://dev.mysql.com/doc/refman/5.7/en/what-is-mysql.html
11

MySQL
MySQL databases are relational.

A relational database stores data in separate tables rather than putting all the data in one big
storeroom. The database structures are organized into physical files optimized for speed. The
logical model, with objects such as databases, tables, views, rows, and columns, offers a flexible
programming environment. You set up rules governing the relationships between different data
fields, such as one-to-one, one-to-many, unique, required or optional, and “pointers” between
different tables. The database enforces these rules, so that with a well-designed database, your
application never sees inconsistent, duplicate, orphan, out-of-date, or missing data.

More info - https://dev.mysql.com/doc/refman/5.7/en/what-is-mysql.html
12

The Team
Website or Web Application development is team work and many
diﬀerent skillsets are required. In small teams sometimes a single
person may need to wear many hats.
Team
Lead
Web
Designer
Web
Developer
Database
Designer
Graphic
Designer
Tester
System Analyst, Project management,
Version administration
Backend /
Server side
development
Test working &
functionality of
all software component.
Performance testing.
Frontend /
Client side
development
Design & optimize
database design
User interface design
User experience
specialist
13

Code editors
What tools do the code developers use?

One of the most popular application used is Adobe Dreamweaver. Some of the other
popular applications are - Coﬀee cup editor, Sublime text editor, PHP edit, Eclipse.
14

Other tools of trade
Besides coding the other skills that are required are creating wireframes
for draft design, image editing. While some other like video editing and
animation may be required depending on project.
15
Video
Editing
Image
Editing
Wireframe
Design

Hosting - What is best plan for hosting
This will depend on your current requirement & future requirement. Hosting
service providers let you upgrade to different plan at any point of time,
when you requirements change. So there is nothing to worry about it.

Understanding three types of web hosting solutions offered –

Shared hosting
If you are a small business with relatively small number of visitors or no
online sales, then shared website hosting is for you. Website hosting
companies that focus on smaller businesses provide shared Website
hosting. They are able to give very competitive prices as they host lots of
Internet sites on a single server. This makes is typically affordable (under
USD 10 per month)

More info - http://www.whoishostingthis.com/resources/web-hosting/
16

!
Virtual Private Server
If you run an online business with hundreds of visitor per day, you might want
to get a web host that provides a Virtual Private Server (VPS), where your
website sits by itself virtual server and won’t have other clients. Here many
sites may share the same physical server, but its functionally equivalent to a
separate computer. The idea behind this is sharing resources eﬃciently.
Studies have revealed that, hosting sites tend use computer resources in a
“bursts”. Meaning hosting sites for a short periods demanding fast-as-
possible response to requests. But after usage long duration’s of inactivity
follows. The resources during this period are used by other web hosts on the
same server. This is all taken care by virtualization software, which create
virtual servers. Each virtual server can run its own operating system and can
be booted separately.

17

Dedicated website hosting
This is the most costliest and is recommended for for those who have a
high traﬃc, such as eCommerce site that’s doing 1000′s of dollars of
business every month.

The other types of hosts which are for specialized use are Cloud
hosting & Grid hosting.
18

Version Management
A component of software configuration management, version control, also known as revision
control or source control, is the management of changes to documents, computer programs,
large web sites, and other collections of information.

Complex Web sites and web applications are developed by teams.
As teams design, develop and deploy software, it is common for multiple versions of the
same software to be deployed in different sites and for the software's developers to be
working simultaneously on updates. Bugs or features of the software are often only present
in certain versions (because of the fixing of some problems and the introduction of others as
the program develops). Therefore, for the purposes of locating and fixing bugs, it is vitally
important to be able to retrieve and run different versions of the software to determine in
which version(s) the problem occurs. It may also be necessary to develop two versions of the
software concurrently (for instance, where one version has bugs fixed, but no new features
(branch), while the other version is where new features are worked on (trunk).

At the simplest level, developers could simply retain multiple copies of the different versions
of the program, and label them appropriately. This simple approach has been used on many
large software projects. While this method can work, it is inefficient as many near-identical
copies of the program have to be maintained. This requires a lot of self-discipline on the part
of developers, and often leads to mistakes. Consequently, systems to automate some or all
of the revision control process have been developed.
More info - http://www.sitepoint.com/version-control-software-2014-what-options/
Check - https://github.com/ https://bitbucket.org/
19

Version Management
Git is the new fast-rising star of version control systems.
Initially developed by Linux kernel creator Linus Torvalds,
Git has recently taken the Web development community by
storm. Git offers a much different type of version control in
that it’s a distributed version control system. With a
distributed version control system, there isn’t one
centralized code base to pull the code from. Different
branches hold different parts of the code.

20

Software Deployment
Once the code has been tested on our staging server, its
ready for deployment to the clients system, which is called
production server. There are many tools & services available
for transfer of the code. One such service is available at -

http://www.deploybot.com

It notiﬁes by email on every deployment also facilitates to
Analyze how each deployment impacts performance and
application stability through third-party integrations.

21

Traditional
Development
http://www.tropicalcluster.com22

Traditional Development
This graphic on previous slide shows the nature of the work performed in each
environment, the responsibilities of actors in each environment, and relative rate of
software builds and deployments.

In narrative form, the software developer writes code in his or her development
environment (1) and checks it into the Subversion source code repository (2). As
other developers report bugs (3) more changes are made (5) and checked in (6).

Remember that the Development and Integration environments can be the same
actual environment, so these two boxes can be collapsed; it is important to note,
though, that in such a case changes are still being checked into Subversion.

When the developers are happy with the behavior of the Integration environment (6),

the Release Master creates a copy or “tag” of the code in Subversion and updates
the Staging environment to this tag (7).
More info - http://dltj.org/article/software-development-practice/
23

Traditional Development
At this point the quality assurance (QA) testers start their review (8). QA testers can
be both internal staff and external reviewers; the Staging area also doubles as a
training environment when the Production release is ready. QA reports go back to
the developer (9) who fixes them (10) and checks the changes into Subversion (11).

After all of the bugs are fixed, the release manager promotes a new version to
staging (12).

This process continues until the QA team declares the staging version is “okay to
release” (13).

The release manager packages up the release version from Subversion (14) and
deploys it on the production servers (15). As time goes on, bug reports and feature
requests are made (16) for which the developer writes code (17) and checks in the
changes to the source code repository (18). (17) and (18) are functionally equivalent
to ”(1)” and ”(2)” above. Repeat until the end user is completely satisfied.
More info - http://dltj.org/article/software-development-practice/
24

What software engineering and development professor tell
students all over the world on the ﬁrst day of their class...
This necessitates following development process or methodology,
that have evolved with experience or learning the hard way...
25

Software Development Life Cycle (SDLC)
There are several common models you can use to streamline the software development process, for which
the development team is responsible for utilizing the methodology most appropriate for their project.

More info - http://www.tutorialspoint.com/sdlc/sdlc_waterfall_model.htm
Waterfall approach was ﬁrst SDLC Model to be used widely in Software Engineering to ensure success of the project.
In "The Waterfall" approach, the whole process of software development is divided into separate phases. In Waterfall
model, typically, the outcome of one phase acts as the input for the next phase sequentially.

The Waterfall Model was ﬁrst Process Model to be introduced. It is also referred to as a linear-sequential life cycle
model. It is very simple to understand and use. In a waterfall model, each phase must be completed before the next
phase can begin and there is no overlapping in the phases.
Waterfall Model
26

Agile Methodology
More info - http://agilemethodology.org/ http://www.tutorialspoint.com/sdlc/sdlc_agile_model.htm
Agile SDLC model is a combination of iterative and incremental process models with focus on process adaptability and customer
satisfaction by rapid delivery of working software product.

Agile Methods break the product into small incremental builds. These builds are provided in iterations. Each iteration typically lasts
from about one to three weeks, called sprints. Every iteration involves cross functional teams working simultaneously on various
areas like planning, requirements analysis, design, coding, unit testing, and acceptance testing.

At the end of the iteration a working product is displayed to the customer and important stakeholders.model, each phase must be
completed before the next phase can begin and there is no overlapping in the phases.

27

Software Documentation
Requirement Documentation - Requirements documentation, also referred to simply as requirements
explains what a software does and shall be able to do. It is prepared in consultation with the client.
Further based on the requirement document, a Software design document is prepared.

A software design description (aka software design document or SDD) is a written description of a
software product, that a software designer writes in order to give a software development team overall
guidance to the architecture of the software project. An SDD usually accompanies an architecture
diagram with pointers to detailed feature specifications of smaller pieces of the design. Practically, the
description is required to coordinate a large team under a single vision, needs to be a stable reference,
and outline all parts of the software and how they will work.

Technical Documentation - Technical documentation is a very important part of software
documentation and it not only describes codes but it also addresses algorithms, interfaces and other
technical aspects of software development and application. Technical documentation is usually created
by the programmers with the aid of auto-generating tools.

Test Documentation - List all the tests that were carried out on different elements of software.

User Documentation - Also known as software manuals, user documentation is intended for end users
and aims to help them use software properly. It is usually arranged in a book-style and typically also
features table of contents, index and of course, the body which can be arranged in different ways,
depending on whom the software is intended for.

!
30

Software Documentation - Traditional and Agile METHODOLOGY
The agile strategy is to defer the creation of all documents as late as possible, creating them just before you need them via a
practice called "document late". For example,

a. system overviews are best written towards the end of the development of a release because you know what you've actually built.

b. Similarly, the majority of user and support documentation is also best written towards the end of the lifecycle.

However, this doesn't mean that all documentation should be left towards the end. You might still want to take notes for these sorts
of documents throughout development so that you don't lose critical information. These notes may be nothing more than point-form
information as there is no need to "polish" documents until just before final delivery of them.

!
By waiting to document information once it has stabilized you reduce both the cost and the risk associated with
documentation. Cost is reduced because you won't waste time documenting information that changes, which in turn
motivates you to update the documentation. Risk is reduced because there is significantly less chance that your existing
documentation will be out of date. If you write documentation containing information which has not yet stabilized then
you are at risk of having to rework the documentation once the information has changed. In other words, you do not want
to invest much time documenting speculative ideas such as the requirements or design early in a project. Instead, wait
until later in the lifecycle when the information has stabilized and when you know what information is actually useful to
you. The implication is that your documentation effort may be a few iterations behind your software development effort.
31

Biblography
http://www.sublimetext.com/

https://bitbucket.org/

https://github.com/

http://php.net/manual/en/intro-whatis.php

http://www.w3schools.com/

http://www.sqa.org.uk/e-learning/ClientSide01CD/page_18.htm

https://nodejs.org/en/

http://click.avoka.com/click-examples/ajax/compare/jquery-
ajax-demo.htm

https://angularjs.org/

http://www.webopedia.com/

https://mockﬂow.com/samples/

http://www.coﬀeecup.com/html-editor/

https://en.wikipedia.org/wiki/Software_design_description

http://www.whoishostingthis.com/resources/web-hosting/

https://dev.mysql.com/doc/refman/5.7/en/what-is-mysql.html

http://dltj.org/article/software-development-practice/

http://www.tutorialspoint.com/sdlc/sdlc_waterfall_model.htm

https://www.siteground.com/wordpress.htm
http://www.agilemodeling.com/essays/
agileDocumentationBestPractices.htm

http://deploybot.com/

http://adobe.com

http://www.sublimetext.com/

http://www.slideshare.net/selatta/what-is-just-enough-
documentation-in-agile
32

Making Of PHP Based Web Application

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Destacado

Destacado (7)

Similar a Making Of PHP Based Web Application

Similar a Making Of PHP Based Web Application (20)

Último

Último (20)

Making Of PHP Based Web Application