本指導教學教您如何設計一個像報紙分類廣告欄一樣的動態網站。
這個網站是一個完整的 J2EE Web 應用程式,需要用到 JavaServer Faces (JSF) 元件和「服務資料物件 (SDO)」。
這個應用程式採用 JSF 技術來建立動態網頁,可連結至儲存分類廣告資料的資料庫。
只要將 JSF 元件拖曳至頁面上,就可建立 JSF Web 應用程式,也就是所謂的 CRUD 應用程式,
因為可以建立、讀取、更新及刪除資料庫的記錄。
網站使用者可利用這些功能來管理資料庫中的分類廣告。
完成本指導教學之後,網站使用者不僅可以檢視銷售項目,還可以新增項目、變更項目的詳細資料(例如價格或說明)或搜尋特定類型的項目。
雖然這個指導教學網站的設計很簡單,但涉及的原理和技術亦適用於更大和更複雜的網站。
學習目標
這個指導教學分成兩個單元,每個都有它自己的目標。
您可以選擇完成這兩個單元或其中任何一個單元。
在每個單元內,您都必須完成各個練習,網站才能夠正常運作。
單元 1:建立含資料連線的網頁
本單元教您如何設定資料庫連線及在網頁上顯示資料庫中的資訊。
在這個單元中,您將執行下列動作:
- 將網頁連接到資料庫。
- 建立可顯示、建立、編輯及刪除資料庫記錄的頁面。
- 將一個頁面的資料傳到另一頁面
單元 2:新增進階特性
本單元教您以更強大的方式來使用資料庫的資料。在這個單元中,您將執行下列動作:
- 在網頁中格式化資料庫記錄
- 新增元件以允許從網頁上將檔案上載到資料庫
- 自動在頁面之間導覽
- 自動執行一些資料庫管理作業
當您準備好時,請開始進行「單元 1:建立含資料連線的網頁」。
所需時間
總計:3 小時 30 分鐘
單元 1:2 小時
單元 2:1 小時 30 分鐘
技能等級
中級
讀者
Web 應用程式開發人員、Web 使用者介面設計師
系統需求
完成本指導教學必須先安裝和配置執行時期伺服器。本指導教學已在下列伺服器上測試過:
- IBM® WebSphere® Application
Server 6.0、6.1 和 7.0 版
必備條件
如果要完成這個指導教學,您應該熟悉下列各項:
- 基本的 Web 設計概念,例如網站、網頁、瀏覽器及伺服器。
- 如何建立簡單的靜態網頁。
- 網頁的元素,例如表格、超鏈結、表單及圖形。
- 資料庫術語,例如表格、記錄、直欄及欄位。
如果您瞭解下列各項,也會有幫助:
- 如何使用工作台的視景和視圖。
- 如何編輯網頁的 HTML 程式碼。
預期結果
Web 應用程式完成之後,首頁的外觀如下圖所示。
透過網站範本新增至網頁的網站導覽,連結至頁面來讓您建立新的廣告或檢視所有廣告。
下表中顯示的列動作可前往更新頁面,讓您變更特定廣告的相關資訊。