Slide 1Introduction to a server-side web programming / scripting
language to create dynamic websites.
Scripting language used in this unit: PHP currently one of the most
widely supported technology by web hosts.
<Pemrograman Web>
Java
C
C++
Objective-C
PHP
Additionally, Adobe Photoshop & or any other image editing
software.
Advise the lecturer if you have any deficiency of these
skills.
<Pemrograman Web>
Resources
You should be prepared with web host, software, and hardware
required.
The software and hardware are provided in campus Remember that
these facilities and resources are very limited. You might want to
install the software in your own computer so that you can practice
and work on the assignments in any time you would like to.
<Pemrograman Web>
Web Host
Technology required: PHP & MySQL.
Equipment / Consumable
You works will be submitted in CD-ROM/DVD-ROM and uploaded to a
server.
<Pemrograman Web>
Script Editor: Adobe Dreamweaver, Netbeans or Notepad
Server: Apache, PHP, MySQL
Image Editor: Adobe Photoshop. Other image editor can be used
<Pemrograman Web>
Textbook / Recommended Ref.
No official textbook. Recommended reference:
Castagnetto, J. et. Al., Professional PHP Programming, Wrox Press,
USA, 2000
<Pemrograman Web>
Online Resources
Links provided during lectures
First 1 - 1.5 hours for lectures
Remaining times for tutorial
Important Note:
Bring the progress of your assignments every time you attend
lectures and tutorials
Submitting you assignments without consult -> your work might
not be suitable for submission.
<Pemrograman Web>
Why PHP?
Required resources
Web hosting (e.g.: siteburg.com)
Headings
<Pemrograman Web>
Statements
Loop (While, For)
Functions
Arrays
File Upload
<Pemrograman Web>
Classes and Object
Polymorphism and Inheritance
Individual
Exam Review
<Pemrograman Web>
Sending and Receiving Emails
1. Denial of Service
2. Exposure confidential data
3. Generate PDF
Individual
Exam Review
<Pemrograman Web>
Case Study
Description : TBA
Type : Individual
Description : TBA
Type : Individual
<Pemrograman Web>
Assignment Rules
While lecturers will try at best to return your work, you should
retain a copy of your works.
All assignments submitted should be accompanied by Cover Sheet
(sampul tugas). Note that this will act as legal paper, plagiarism
or collusion ?.
All assignments should be submitted on the due date given. No
extension given unless you ask the lecturers at least 2 weeks in
advance. Extension won’t be given unless you have a very urgent or
health issues.
<Pemrograman Web>
Assignment Rules (cont’d)
Any assignments submitted after the due date without extension
given, will cost you 10% of the marks each day.
All submission that could not be copied or run (due to virus,
CD-ROM error, etc) will not be marked. You will get penalty of late
submission as mentioned above for any number days of the work
re-submit. Please make sure that your CD-ROM or any other for of
submission are virus free and work perfectly on several
computers.
<Pemrograman Web>
WEB DEVELOPMENT
<Pemrograman Web>
Static Website
Dynamic Website
Client-Side Technologies
Server-Side Technologies
<Pemrograman Web>
</HTML>
</HTML>
Java Applets
Active Server Pages
Provide client with dynamic data
Improved security measures original codes can not be seen from the
browser
<Pemrograman Web>
Why PHP?
Widely supported by both local and international web hosts
provider
<Pemrograman Web>
Viewing HTML Pages
A Browser interpret the HTML codes and display the page
appropriately on the screen
Creating Web page using text editor (ex: Notepad) save and view /
refresh on browser back and forth
<Pemrograman Web>
Original Intent of HTML
To allow the authors to worry about the content only, whilst the
browser will took the job to format the look
To allow the document to be easily readable and accessed from
anywhere in the world
<Pemrograman Web>
Different Browser Different Look
various web browser has its own way of interpreting the look of the
web page.
For example: in headings, the author only decide the level of the
headings, and not how it looks like. One browser might display left
aligned bold text, while other center aligned italics.
That is why, authors should test / check their web pages in
different browsers.
<Pemrograman Web>
Different Browser Different Look
The good news: consolidated and standardized HTML tags. Standard
tags will be supported by most browsers
However browser developers also race to bring new features (not
standardized yet) in new versions of browsers
<Pemrograman Web>
Each elements is defined by an HTML code, called tags
A tag is always enclosed in angle brackets and most tags come in
pairs, with an opening and a closing tag.
Example : <HTML> </HTML>
Some browsers are forgiving (for some errors), but you should not
depend on this to avoid problems
<Pemrograman Web>
HTML Example
<Pemrograman Web>
Browser Interpretation
Browser interprets and displays the tags appropriately
The tags does not shown on the browser, unless there is a problem
(e.g. unrecognized tags, unpaired tags etc)
Some tags have optional or required attributes (a keyword of
several possible values inside the tags)
e.g.: <H1 ALIGN=“CENTER”> </H1>
HTML tags are not case sensitive to the browsers.
<Pemrograman Web>
<html>
<head>
</head>
<body>
<HTML>
Declares that the text that follows defines an HTML Web Page that
can be viewed in a Web Browser. The closing </HTML> tag ends
the page
<Pemrograman Web>
<HEAD>
Defines the header area of a page, which is not displayed within
the page itself in the browser.
The closing </HEAD> tag ends the header area
<Pemrograman Web>
<TITLE>
The text in between this and the closing </TITLE> tag is the
title of the web page and is displayed in the title bar of the
browsers.
This is important tag, used by search engine and indexer to name
the website usually neglected by web authors
In Internet Explorer the title will also be served as the default
page title on favorites
<Pemrograman Web>
<BODY>
The actual content of the web page should be placed inside the pair
of this tag with the closing </BODY> tag.
<Pemrograman Web>
<Pemrograman Web>
Browsers ignored hard returns (new line)
<PRE>
Mono spaced fonts that allows authors to align text precisely
<Pemrograman Web>
the one
The HTML language is constantly evolving
New and improved tags introduced in new browsers versions users
with old browsers would not be able to see
Standards are defined by W3C (World Wide Web Consortium) at the
Massachusetts Institute of Technology
<Pemrograman Web>
Using Paragraphs
Paragraphs are defined with the <P> tags, not by pressing
Enter key on keyboards
Browsers will insert some extra space between paragraphs. So
sometime you would not like to use paragraph tags
<Pemrograman Web>
<BR>
You can use <BR> instead of paragraph if you intended to move
to the next line, without additional space between the lines.
<Pemrograman Web>
Try This
<Pemrograman Web>
HR = Horizontal Rule
Width
Size
A common way to add structure to a Web page.
Maximum of 6 levels: <H1>, <H2>.. <H6>
<Pemrograman Web>
Formatting Text and Pages
<FONT> tag can be used to decide the font face/type, size and
color, ex: <font face=“verdana”, size=“5”, width=“80%”>
Italic: <i>
Bold: <b>
Underlined: <u>
<Pemrograman Web>
Further Learning
HTML 5