ใน series ต่อไปนี้จะได้พบกับการเขียน web layer เพื่อเป็น client ที่จะมาเรียกใช้ data access layer ตามรูปที่ 1
รูปที่ 1
แต่ในการเขียน real world application นั้น ควรจะเพิ่ม service layer สำหรับการติดต่อกับ database และคอยตรวจจับ database exception เพื่อรองรับการเติบโตของระบบซึ่งจะทำให้ระบบสามารถแยกการทำงานได้ง่ายขึ้น เช่น การเขียน web application แบบ 3-tier อาจจะได้กล่าวต่อไปในอนาคต แต่ series นี้เราจะเขียน web application แบบง่ายๆ 2-tier
เริ่มจากส่วนของ Home Page ตามรูปที่ 2 เป็นหน้าตาของ home page ของเราซึ่งเมนูด้านซ้ายจะแสดงข้อมูลประเภทหนังสือที่ดึงข้อมูลมาจาก database
รูปที่ 2
ส่วนรูปที่ 3 เราแสดง MVC Architecture ของระบบที่เราจะพัฒนาขึ้น จากรูปที่ 3 เป็นตัวอย่างของการดึงข้อมูลมาแสดงบนหน้า home page สามารถอธิบายคร่าวๆได้ว่า MVC Architecture นั้นก็คือ M คือ Model จากรุปที่ 3 จะเป็น Category และ V คือ View จะใช้สำหรับแสดงข้อมูล เช่น home.jsp และ C คือ Controller โดยมี BookController ทำหน้าที่ ซึ่งลักษณะการทำงานจะมีด้วยกัน 6 step ตามรูปที่ 3
รูปที่ 3
ให้ลง Eclipse IDE ก่อนนะครับ ตามลิงค์นี้(การพัฒนาโปรแกรม Java ด้วย Eclipse IDE Windows 64-bit) เราจะได้ทดลองสร้าง web application กัน โดยเราจะใช้ Tomcat 7 เป็นทั้ง HTTP server และ servlet container ดังนั้นเราก็ต้อง download Tomcat 7 กันก่อนเลย ตามลิงค์นี้ และ install Tomcat 7 (7 ขั้นตอนการ install Tomcat 7 บน Windows 7 (64 bit))
จากนั้น เปิด Eclipse IDE ขึ้มาเลยครับแล้วไปที่เมนูและเลือก Window > Preferences จะได้หน้าต่างตามรูปที่ 4 จากนั้นให้เลือกเมนู Java > Installed JREs และให้ตรวจสอบ JRE8 หรือ JDK8 ว่าได้ install แล้วหรือยัง (ถ้ายังให้ทำตามลิงค์นี้ การ Setup Development Environment สำหรับ Java Developer) กรณีที่ไม่พบ JRE8 เหมือนรูปที่ 4 ให้ กดปุ่ม Add และก็ไปเลือกไฟล์ตามรูปที่ 5
รูปที่ 4
เมื่อเลือก path แล้วให้กดปุ่ม Finish ได้เลย
รูปที่ 5
เริ่มสร้าง Java web Project กันเลยให้เลือก เมนู File > New > Project... ตามรูปที่ 6 จะได้หน้าต่างตามรูปที่ 7 ขึ้นมา
รูปที่ 6
จากนั้นให้เลือกโฟลเดอร์ Web > Dynamic Web Project แล้วกดปุ่ม Next >
จะปรากฏหน้าจอขึ้นมาให้ตั้งชื่อ project ว่า bookstore และเลือกตามรูปที่ 7.1
รูปที่ 7
จากรุป 7.1 เมื่อตั้งชื่อ Project name ให้เลือก Target runtime ถ้าไม่พบข้อมูลให้กดปุ่ม New Runtime... และทำตามขั้นตอนตามลิงค์นี้
รูปที่ 7.1
เมื่อได้แล้วให้กดปุ่ม Finish ให้รอตามรูปที่ 8
รูปที่ 8
Eclipse IDE จะปรากฏหน้าจอถามเกี่ยวกับการเลือก view project เป็นรูปแบบ Java EE หรือไม่ให้กดปุ่ม Yes
รูปที่ 9
เราจะได้โครงสร้าง project ตามรูปที่ 10 ครับ
รูปที่ 10
ก่อนจะเริ่มเขียนโปรแกรม เราจะทำการสร้าง virtual web server บน IDE กันก่อนโดยคลิกที่ลิงค์ตรง tap Servers ที่อยู่ด้านล่างตามรูปที่ 11
รูปที่ 11
เมื่อคลิกลิงค์จะปรากฏหน้าต่างตามรูปที่ 12 ให้เลือก Tomcat version ที่เรา install แล้วกดปุ่ม Finish
รูปที่ 12
ตามรูปที่ 13 ให้เราเลือก bookstore และกดปุ่ม Add > แล้วกดปุ่ม Finish
รูปที่ 13
จะปรากฏ server ขึ้นมาใน Tab Servers ให้ทดสอบด้วยการคลิกเมาส์ขวาและเลือกเมนู Start
รูปที่ 14
จากรูปที่ 15 คือผลการ Start
รูปที่ 15
ตอนต่อไปติดตามได้ที่
Java Programming Bookstore Application (Series 4.1): Building Web Applications Using Servlets and JSP
Java Programming Bookstore Application (Series 5): Building a Web Application Using Struts 2
Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC
Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2
Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails
Java Programming Bookstore Application (Series 9): Play with Java and Scala
อ้างอิง
ผู้เขียน: procodeblog
ไม่มีความคิดเห็น:
แสดงความคิดเห็น