Basic JavaWeb ตอนที่ 3 Structure

ในตอนที่ 3 นี้ เรามาทำความเข้าใจคราว ๆ เกี่ยวกับโครงสร้างของระบบกันก่อนนะคะ ในโปรเจ็กต์ของเราจะใช้ภาษาต่าง ๆ ในการพัฒนาร่วมกันดังนี้…

basic_javaweb_3_1

ภาพที่ 1 ภาษาที่ใช้ในการพัฒนาเว็บ

ส่วนของ View
HTML : ใช้ในการแสดงผลข้อมูลทางเว็บไซต์
CSS : ใช้ตกแต่งหน้าเว็บของเราให้สวยงาม
JavaSrcipt : ใช้ในการโต้ตอบกับผู้ใช้งาน เช่น
เวลาเรากดปุ่มลบจะมีกล่องโต้ตอบขึ้นมาให้ยืนยันการลบ
เวลาเรากดปุ่มเพิ่มจะมีกล่องโต้ตอบแสดงผลบอกเราว่าเพิ่มข้อมูลเรียบร้อยแล้วในกรณีที่เพิ่มสำเร็จ
ป้ายโฆษณาที่หมุนแสดงผลไปเรื่อย ๆ ตามเวลาที่เรากำหนดเป็น ต้น

JSP (EL,JSTL) : ภาษานี้คือภาษาหลักที่เราจะได้เรียนรู้ มันทำหน้าที่รับค่าต่าง ๆ ที่ Controller ส่งมาให้แล้วนำไปแสดงผล

ส่วนของ Controller

Servlet : ใช้ในการควบคุมเส้นทางการทำงานระหว่าง View กับ Mode

ส่วนของ Model

Java : หมายถึงภาษาจาวา (Java) ที่เราร่ำเรียนกันมาเป็นพื้นฐานนี้แหละค่ะ เราจะได้เห็นความสามารถของมันก็คราวนี้แหละ ในโปรเจ็กต์นี้เราแยกส่วนของ DAO (Data Access Object) ออกมาจาก Model ซึ่ง Model นั้นเราใช้ให้มันเป็น Object ตัวแทนของข้อมูลที่ถูกดึงขึ้นมา ส่วน DAO เราจะเก็บเมธอด (Method) ที่เกี่ยวกับการใช้คำสั่งในการเพิ่ม ลบ แก้ไขข้อมูลเอาไว้ในนี้ ซึ่งเราจะได้พบกับอีกหนึ่งภาษาคือ SQL

SQL : เป็นภาษาที่เราใช้ในการพูดคุยกับฐานข้อมูล เช่นบอกว่า
ช่วยไปดึงข้อมูลเหล่านี้ขึ้นมาจากตารางนี้ให้ด้วยนะ
ช่วยไปแก้ไขข้อมูลในตารางนี้ให้หน่อยสิ
ช่วยลบข้อมูลนี้ออกจากตารางนี้ให้หน่อยนะ เป็นต้น

สุดท้ายภาษา XML เราจะใช้มันในการกำหนดค่าต่าง ๆ ค่ะ

โหววว…กว่าจะสร้างเว็บได้ต้องเรียนรู้มากมายหลายภาษาขนาดนี้เลยเหรอ ? ไม่ต้องตกใจค่ะ เพราะความจริงเราใช้หลายภาษามากกว่านี้ ^_^ แต่เราไม่จำเป็นต้องรู้รายละเอียดทั้งหมดของแต่ละภาษานะคะ แค่รู้ในส่วนที่ต้องใช้จริง ๆ ก็พอ หรือในบริษัทใหญ่ ๆ เค้าก็ไม่ได้ให้นักพัฒนาโปรแกรมทำทุก ๆ ส่วนด้วยคนเพียงคนเดียว คนที่เก่งด้านกราฟิกเค้าก็จะทำในส่วนของ View ไป คนที่เก่งด้านฐานข้อมูลเค้าก็จะทำในส่วนของ Model นี่คือประโยชน์บางส่วนของการพัฒนาระบบในรูปแบบ MVC ค่ะ

ในบทความนี้เจอคำศัพท์แปลก ๆ ที่ไม่เข้าใจความหมายบ้างไหมคะ ? บางคนอาจจะยังไม่รู้ด้วยซ้ำว่า Object คืออะไร ? ยังไม่ต้องกังวลค่ะ อีกไม่นานเราจะได้รูปความหมายของมันเองในตอนต่อ ๆ ไป

เครื่องมือที่ใช้ในการพัฒนาเราเลือกใช้ NetBeans เชื่อมต่อกับฐานข้อมูล MySQL และโปรแกรมที่ช่วยในการจัดการฐานข้อมูล MySQL คือ HeidiSQL ที่เลือกตัวนี้เพราะหน้าตามันสวยดีค่ะ อยากจะย้ำอีกสักครั้งว่าไม่ต้องยึดติดกับเครื่องมือที่ใช้นะคะ เราควรเปิดกว้างที่จะลองใช้เครื่องมือใหม่ ๆ หรือบางองค์กรเค้าใช้เครื่องมือที่แตกต่างจากเครื่องมือที่เราถนัดก็ต้องศึกษาเพิ่มเติมค่ะ ซึ่งมันก็ไม่ใช่เรื่องยากเลยเปรียบกับเราขับรถนี้แหละค่ะ ปกติเราขับยี่ห้อ Toyota วันหนึ่งจะเปลี่ยนไปขับของ Honda หรือ BMW บ้างก็ขับได้อยู่แล้วจริงไหมคะ ? ^_^

สรุปรายละเอียดเบี้องต้น

Project Name : Basic_JavaWeb

Database Name : basic_javaweb

Table Name : book

ต่อไปเป็นภาคที่ 2 เรื่องของ Model (ส่วนติดต่อกับข้อมูล) ดีใจไหมคะจะได้ลงมือเขียนโค้ดกันแล้ว ^_^ เราจะเริ่มต้นกันด้วยเรื่อง “การเชื่อมต่อฐานข้อมูล” ค่ะ


>>> เรียนรู้ MVC ด้วย โปรเจ็กต์ Basic JavaWeb

ภาคที่ 1 ภาพรวมของระบบ (Overview)

Basic JavaWeb ตอนที่ 1 Introduction
Basic JavaWeb ตอนที่ 2 Overview
Basic JavaWeb ตอนที่ 3 Structure

ภาคที่ 2 Model (ส่วนติดต่อกับข้อมูล)
Basic JavaWeb ตอนที่ 4 Connection Datebase
Basic JavaWeb ตอนที่ 5 Create Model
Basic JavaWeb ตอนที่ 6 Create DAO
Basic JavaWeb ตอนที่ 7 Method getAll()
Basic JavaWeb ตอนที่ 8 Method isInsert()
Basic JavaWeb ตอนที่ 9 Method isUpdate()
Basic JavaWeb ตอนที่ 10 Method isDelete()
Basic JavaWeb ตอนที่ 11 Method getById()
Basic JavaWeb ตอนที่ 12 Method getByKeyword()

ภาคที่ 3 Controller และView (ส่วนของการควบคุมการทำงานและการแสดงผล)

ออกแบบ Template
– HTML
– CSS
– JavaScript
– JSP (EL, JSTL)

เชื่อมต่อ Controller และ View

เชื่อมต่อ Model -> Controller -> View

สรุป


ธมนวรรณ มณีจันทร์

ธมนวรรณ มณีจันทร์

|:- เราเชื่อมั่นว่าการเสียสละและการแบ่งปันจะทำให้โลกใบนี้สวยงามมากขึ้น ทุกๆ จุดเริ่มต้นของการเรียนรู้ นำไปสู่การเรียนรู้ถัดไป เว็บไซต์แห่งนี้ขอเป็นส่วนหนึ่งของการแบ่งปันความรู้ที่ไม่มีที่สิ้นสุด มาร่วมกันผลักดันโลกของเราให้หมุนไปพร้อมกับพลังแห่งความรักด้วยกันนะคะ :) >>> |:- About Me! -:|