Pengantar Teknologi Web 2

excitingwonderlakeInternet and Web Development

Dec 13, 2013 (3 years and 10 months ago)

101 views

Pengantar Teknologi Web 2

Web Architectures & Technologies


Antonius Rachmat C

WWW


Software


Kumpulan service Internet, yaitu web
-
web yang
berada di layer aplikasi


Ditemukan oleh Tim Berners
-
Lee dkk di CERN


Didesain untuk membantu para ilmuwan di
CERN untuk memperoleh informasi dari
dokumen
-
dokumen di Internet


Tujuannya: membuat software (browser) untuk
menampilkan informasi tersebut


Idenya: hyperlink

WWW


The world wide web consortium (W3C) definition of the
web: "
The World Wide Web is the universe of network
-
accessible information, an embodiment of human
knowledge"


Provides information access in ways not previously
possible


Hyperlinked (Hypertext)


Graphical user interface


Pictorial and non
-
text information


Information that changes rapidly


Immediate access


Anyone can author a web site


Multi
-
user access to the same information (try that with a book)


Easily searchable information

WWW Components


Structural Components


Clients/browsers


to dominant implementations


Servers


run on sophisticated hardware


Caches


many interesting implementations


Internet


the global infrastructure which facilitates data
transfer


Semantic Components


Hyper Text Transfer Protocol (HTTP)


Hyper Text Markup Language (HTML)


eXtensible Markup Language (XML)


Uniform Resource Identifiers (URIs)

Web Server survey (netcraft)

Growth of World Wide Web

A brief history of the web

Dynamic content

Server
-
side scripting

Static content

cgi
-
bin, php, asp.net, asp

Database
-
backed

content

Componentized/

enterprise applications

Web application

frameworks

EAI

Better script/database integration

Web Architecture


Layering Aspect


“Separation of concerns”


How many concurrent users are you serving?


Shared needs among multiple applications? (e.g.,
security)


Data Aspect


What kind(s) of data are you delivering?


Structured vs non structured


On
-
demand vs. real
-
time


What are the bandwidth requirements?


Size & nature of data


Again, audience concerns

Tiers…?


A “tier” can be hardware, software, or
logical
.
The last is the most sensible
option from an architectural viewpoint
.


Therefore:


A non
-
application
-
specific client (such as a
web browser) is not a tier


A database with no overlying data access
layer is not really considered a tier either


N
-
tier
web

architectures

Client

Presentation

Business Logic

Data Access

Data

HTML rendering

Templates, HTML generation

scripts, XML and XSLT

Application
-
specific components

and application logic

Domain
-
specific and

database
-
independent layer,

typically object
-
oriented

Data storage, typically

an (SQL) RDBMS

How to build a 2
-
tier web app…

Browser

MySQL

Your code to generate HTML,

process forms, generate SQL

queries on database (1 or 2 tiers)

Any old browser

(you don’t care)

Apache

PHP

Application

Open
-
source: free, fast,

and dependable

Linux, Solaris, etc

LAMP: Linux, Apache,
MySQL, PHP.
US$10+/month from
http://www.he.net

…the easy way…

How to build a 3
-
tier web app…

Browser

Database

Your object
-
oriented
php / asp.net code,
structured into three
tiers

Any current browser

Apache

Custom C++

module

Open
-
source: free, fast,

and dependable

Linux, Solaris, etc

Typically database choice
will be decided by factors
other than just suitability
for web use.

Presentation

Application Logic

Data Access

…the traditional way…?

Physical architecture

Application server

Compute server #1

Compute server #N

Secure customer cluster #1

Gateway

Firewall

Browsers

Administrative

terminals

ssh

https

Secure customer cluster #N

Firewall:

Port 443 (https) from anywhere

Port 23 (ssh) from admin domain only

Conceptual architecture

Encryption &

Tunneling

Browser

ActiveX

Thin Client

Decryption &

Routing

TC srv

App Mgt

UNIX apps

App srv

HTTPS Tunneling

MySQL

the three roles


the
Model

contains data that represents
the problem



the
Controller

responds to user actions
by telling the Model how to change



the
View

displays the current state of the
Model to the user


how do we design it?


the Model is a class that
represents

the
actual problem being solved


it has private fields, and provides accessor
(getter and setter) methods


the Model should always be a
separate class


if using a GUI


the
listeners

collectively are the Controller


the
displayed components

are the View


the Controller and View are thus
a little bit

inter
dependent

Combining Controller and
View


Sometimes the Controller and View are
combined, especially in small programs


Combining the Controller and View is
appropriate if they are very interdependent


The Model should
always

be independent


Never

mix Model code with GUI code!


why?


ANSWER: you may be required to change the View


if you keep View and Model separate, changing the View
will be relatively simple

MVC

Contoh

MVC Separation


Separating the presentation from the model


Presentasi dan model memiliki fokus yang berbeda:


presentasi ke tampilan, model ke data.


Perbedaan ketergantungan:


presentasi bergantung pada model tapi tidak sebaliknya.


Sehingga dapat mengembangkan multiple presentation
dengan model yang sama


Separating the controller from the view


Contoh: .NET Web application


File: *.aspx dan *.aspx.vb


Contoh: PHP Zend Framework, Code Igniter

Kelebihan & Kekurangan Aplikasi
Web

Teknologi Aplikasi Web

Bagaimana web bekerja?

Web application

Planning A Web site


Purpose


Purpose and Goal


Target Audience


New Web Technologies


Web site comparison


Content


Value
-
added contents


Text


Images


Color Palette


Multimedia

NEXT