Simulasi Proyek Pembuatan Web (TShirtShop 1.0)

SIMULASI PROYEK PEMBUATAN WEB TShirtShop 1.0

http://cristiandarie.ro/php-mysql-ecommerce-2 2011©Zainal Abidin

Simulasi TShirtShop 1.0 June 15, 2011

2

TARGET PRODUK


3

TENAGA AHLI No. Jenis Pekerjaan Tenaga Ahli 1. Desain Template Web Web Template Designer 2. Pemrograman Web Web Programmer

DESKRIPSI PEKERJAAN

No. Tenaga Ahli Tugas Rincian Pekerjaan 1. Web Programmer � Menyiapkan direktori penampung data

dan algoritma � Membuat direktori libs, include, configs,

presentation, images, styles yang berada di bawah direktori utama tshirtshop

� Menyiapkan file penampung algoritma bisnis web

� Membuat file site.conf dan meletakkannya pada direktori tshirtshop /include/configs

� Membuat file config.php dan meletakkannya pada direktori tshirtshop /include

� Membuat file index.php dan meletakkannya pada direktori tshirtshop

� Membuat program web � Mendownload program Smarty dari http://www.smarty.net/files/Smarty-3.0.8.zip

� Mengekstrak Smarty-3.0.8.zip � Copy folder libs ke direktori tshirtshop /libs � Ganti nama folder menjadi smarty, sehingga

menjadi tshirtshop /libs/smarty � Membuat skrip program site.conf � Membuat skrip program config.php � Membuat skrip program index.php

2. Web Template Designer � Mendesain logo tshirtshop � Mendesain logo tshirtshop dan meletakkannya pada direktori tshirtshop /images


4

� Menyiapkan sub-direktori dan file penampung algoritma aplikasi web

� Membuat sub-direktori presentation, yaitu: template dan template_c

� Membuat file application.php dan meletakkannya pada direktori tshirtshop /presentation

� Membuat file store_font.tpl dan meletakkannya pada direktori tshirtshop /presentation/template

� Membuat file tshirtshop.css dan meletakkannya pada direktori tshirtshop /styles

� Membuat program aplikasi web � Membuat skrip program application.php � Membuat desain template web � Mendownload program desain CSS dari

http://developer.yahoo.com/yui/download � Mengekstrak yui-2.9.0.zip � Copy file dari yui-2.9.0 /build/reset/rest-

min.css ke direktori tshirtshop /styles � Copy file dari yui-2.9.0 /build/base/base-

min.css ke direktori tshirtshop /styles � Copy file dari yui-2.9.0 /build/fonts/fonts-

min.css ke direktori tshirtshop /styles � Copy file dari yui-2.9.0 /build/grids/grids-

min.css ke direktori tshirtshop /styles � Membuat skrip program tshirtshop.css � Membuat desain baris dan kolom (cell)

halaman web secara on-line menggunakan aplikasi dari


5

http://developer.yahoo.com/yui/grids/builder � Memodifikasi skrip dari

http://developer.yahoo.com/yui/grids/builder untuk dijadikan skrip program store_font.tpl

SKRIP PROGRAM WEB

No. Skrip Program Keterangan 1. site.conf Menampung variabel untuk judul halaman web 2. config.php Mendefinisikan direktori yang akan digunakan oleh Smarty 3. index.php Mengeksekusi Smarty dan menampilkan template web, yaitu: store_font.tpl

SKRIP DESAIN TEMPLATE WEB

No. Skrip Program Keterangan 1. application.php � Memanggil kelas smarty

� Setting direktori yang akan digunakan oleh Smarty 2. Skrip program dari

http://developer.yahoo.com/yui/grids/builder � Teknologi: HTML4 � Struktur: header, daftar departemen, konten, footer

3. tshirtshop.css Setting kelas dan id CSS yang diperlukan oleh web dari http://developer.yahoo.com/yui/grids/builder

4. store_font.tpl � Teknologi: XHTML1 � Struktur: daftar departemen, konten

No. Skrip program dari http://developer.yahoo.com/yui/grids/builder

store_font.tpl

1. {config_load file="site.conf"} 2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0

6

4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

3. <html> </html>

<html> </html>

4. <head> <title>{#site_title#}</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link type="text/css" rel="stylesheet" href="styles/tshirtshop.css" /> </head>

<head> <title>YUI Base Page</title> <link rel="stylesheet" href="http://yui.yahooapis.com/2.8.0r4/build/reset-fonts-grids/reset-fonts-grids.css" type="text/css"> </head>

5 <body class="yui-skin-sam"> </body>

<body> </body>

6 <div id="doc" class="yui-t2"> </div>

<div id="doc" class="yui-t2"> </div>

7 <div id="hd" role="banner"> <h1>Header</h1> </div>

8 <div id="bd" role="main"> </div>

9 <div id="yui-main"> </div>

<div id="yui-main"> </div>

10 <div class="yui-b"> </div>

<div class="yui-b"> </div>

11 <div class="yui-g"> 

<div id="header" class="yui-g"> <a href="index.php">

7

</div> <img src="images/tshirtshop.png" alt="tshirtshop logo" /> </a> </div>

12 <div class="yui-g">  </div>

<div id="contents" class="yui-g"> Place contents here </div>

13 <div class="yui-b">  </div>

<div class="yui-b"> Place list of departments here </div>

14 <div id="ft" role="contentinfo"> <p>Footer</p> </div>

Simulasi Proyek Pembuatan Web (TShirtShop 1.0)

Documents

Transcript of Simulasi Proyek Pembuatan Web (TShirtShop 1.0)