Anda di halaman 1dari 19

WebE - Design

Nama Kelompok :
1. Agung Oktavian
(A11.2014.08532)
2. Akhmad Duta I. M. (A11.2014.08543)
3. Widia Adhe Okpianto(A11.2014.08428)

Design
Desain dimulai dengan model analisis, model
pengalaman pengguna, dan dokumen arsitektur
perangkat lunak sebagai input utama
Aktivitas utama dari desain adalah untuk memperbaiki
model analisis sedemikian rupa sehingga dapat
diimplementasikan dengan komponen yang mematuhi
aturan arsitektur
Meskipun terdengar sederhana, dapat menjadi fase yang
paling kompleks proyek pembangunan, terutama ketika
kemajuan yang signifikan dalam teknologi perangkat lunak
yang terjadi begitu cepat
September 2008

IF3037

Ekstensi Web Application pada UML


Memungkinkan kita untuk mewakili halaman Web dan elemen
arsitektur lainnya yang penting dalam model "normal yang
berdampingan dengan kelas model.
Ekstensi pada UML dinyatakan dalam istilah stereotypes, tagged
values, and constraints
Mekanisme ini memungkinkan kita untuk memperluas notasi dari UML,
yang memungkinkan kita untuk membuat jenis baru dari pembangunan
block yang bisa kita gunakan dalam model.

September 2008

IF3037

WAE to UML (2)


Stereotype, perpanjangan kosakata bahasa, memungkinkan kita untuk
melampirkan makna semantik yang baru untuk elemen model.
Dapat diterapkan untuk hampir setiap model elemen dan biasanya
direpresentasikan sebagai string antara sepasang Guillements : .
Namun, mereka juga dapat diberikan oleh ikon baru.
Tagged value, ekstensi ke properti dari model elemen adalah dari properti
baru yang dapat dikaitkan dengan elemen model
Sebagian besar elemen model memiliki sifat yang terkait dengan mereka
Kelas misalnya, memiliki nama, visibilitas, ketekunan, dan atribut lainnya
yang terkait dengan mereka
Nilai ditandai, diberikan pada diagram sebagai string tertutup oleh
brackets (kurung)
Constraint/Kendala, perpanjangan semantik bahasa, menentukan kondisi di
mana model dapat dianggap terbentuk dengan baik.
Sebuah aturan yang mendefinisikan bagaimana model dapat disatukan
Diberikan sebagai string antara sepasang braces: { }

WAE - Logical View


Logical View (Pandangan logis) dari model UML sebagian besar
terdiri dari class, relasi, dan kolaborasi mereka
Beberapa class stereotyped mendefinisikan lebih dari satu ikon
Untuk alasan praktis, ikon dekorasi lebih mudah dikelola untuk
alat bantu pemodelan seperti Rose
WAE mendefinisikan 3 class inti stereotypes and berbagai
hubungan (asosiasi) stereotypes:
Server page
Client page
HTML form

September 2008

IF3037

Server Page (Halaman Server)


Merupakan halaman web dinamis yang berisi konten dirakit di server
setiap kali diminta
Biasanya, berisi script yang dijalankan oleh server yang berinteraksi
dengan sumber daya server-side :

databases,
business logic components,
external systems,
and so on.

Operasi objek mewakili fungsi dalam script


Atribut objek mewakili variabel yang terlihat dalam lingkup halaman ini,
dapat diakses oleh semua fungsi di halaman.
Constraints/Kendala:
Halaman server hanya dapat memiliki hubungan normal dengan benda-benda di
server
September 2008

IF3037

Server Page (Halaman Server)

Gambar
Tangan

September 2008

IF3037

Client Page (Halaman Klien)


client page misalnya adalah HTML-halaman Web yang dibentuk dengan
dengan perpaduan data, penyajian, dan juga logika
yang disediakan oleh client browser dan mungkin berisi scripts yang
ditafsirkan oleh browser
Fungsi peta(map) pada Client page dapat berfungsi dalam tags pada halaman
Atribut peta Client page untuk variabel yang dideklarasikan dalam tags script
halaman yang dapat diakses oleh fungsi apa saja pada halaman, atau
halaman scoped
Client pages dapat berasosiasi dengan client atau server halaman lain
Tagged values:
TitleTag, judul halaman yang ditampilkan oleh browser
BaseTag, basisURL pada dereference URL yang saling berhubung
BodyTag, kumpulan atribut untuk tag <body>, yang menetapkan latar belakang
dan standar atribut teks
September 2008

IF3037

Client Page (Halaman Klien)

Gambar
Tangan

September 2008

IF3037

Form pada HTML


class stereotyped sebagai form adalah sekumpulan dari field
input yang merupakan bagian dari halaman klien..
class ini memetakan langsung pada tag HTML <form>.
atributnya mewakili field input HTML : input boxes, text areas, radio
buttons, check boxes, and hidden fields.

form tidak memiliki operasi, karena mereka tidak dapat


dienkapsulasi dalam sebuah form.
Setiap operasi yang berinteraksi terkait dengan form akan menjadi milik
halaman yang berisi form.

Tagged values:
GET atau POST: metode yang digunakan untuk mengirimkan data ke URL
dengan action.
September 2008

IF3037

10

HTML Form (2)

Gambar
Tangan

September 2008

IF3037

11

Hubungan dasar antara WAE elemen


stereotyped

September 2008

IF3037

12

Association Stereotype
<< link>>
Adalah abtraksi dari elemen HTML anchor, ketika atribut herf
didefinisikan

<<build>>
Hubungan arah antara halaman server dan halaman klien

<<submit>>
hubungan directional antaraHTML form dan halaman server

<<redirect>>
menunjukan perintah untuk klien untuk meminta sumber daya
lain
September 2008

IF3037

13

Association Stereotypes (2)


<<forward>>
mewakili delegasi memprosespermintaan klien untuk sumber
daya ke halaman server-side yang lain

<<object>>
hubungan penahanan diambil dari halaman klien untuk kelas
logis lain, biasanya yang merupakan applet, ActiveX control,
atau komponen embeddable lainnya

<<include>>
menunjukkan bahwa halaman yang termasuk akan diproses,
jika dinamis, dan bahwa isinya atau oleh-produk yang
digunakan oleh orang tua
September 2008

IF3037

14

Association Stereotypes

September 2008

IF3037

15

Beberapa Form di Client Page

September 2008

IF3037

16

client page sederhana link


associations

September 2008

IF3037

17

Stereotyped link associations berasal


dari client pages

September 2008

IF3037

18

The link
associations
menunjuk ke
screen
elemen ketika
layar yang
terkotak

September 2008

IF3037

19

Beri Nilai