หลังจากจัดการกับหน้าเวปเสร็จแล้ว เรามาดูวิธีการจัดการกับ Controller กันบ้างค่ะ
ระบบจะทำการสร้างไฟล์ AspectJ ขึ้นมาเป็นโค้ดส่วน controller ให้อัตโนมัติ ซึ่งตรงนี้เราจะไปเปลี่ยนแปลงแก้ไขไม่ได้เลย แต่ก็จะมีพวกฟังก์ชันพื้นฐานครบตาม CRUD (Create,Read,Update,Delete) ดังรูป
5. แต่บางครั้งเราก็อาจจะต้องการฟังก์ชันนอกเหนือจากนี้ เช่น ค้นหาข้อมูลแบบแปลกๆ เราก็ต้องเขียน Controller เองค่ะ ซึ่งจะต้องเขียนในไฟล์ Controller.java เท่านั้น
ที่สำคัญ ถ้ามีการติดต่อฐานข้อมูลที่ไม่ตรงตามที่ AspectJ มีให้ เราก็จะต้องเขียนฟังก์ชันที่ดึงข้อมูลจากฐานข้อมูลต่างหากค่ะ ดังตัวอย่าง
ไฟล์ RecordExpenseService จะเป็นโค้ดที่เขียนขึ้นมาเพื่อเก็บชุดคำสั่งสำหรับการติดต่อฐานข้อมูลในแบบที่ไม่มีให้ใน Spring Roo เช่น ค้นหาข้อมูลที่มีความสัมพันธ์กันมากกว่าสองตาราง หรือใช้การเปรียบเทียบต่างๆ เราก็สามารถเขียนชุดคำสั่ง JPA หรือจะใช้ Native SQL ก็ได้
ส่วนไฟล์ RecordeExpensesController เราก็ไปเพิ่มอีก action นึงให้ทำการแสดงรายการซื้อสินค้าที่ราคาแพงๆ ทั้งหมดออกมาค่ะ
6. ส่วนของการล็อกอิน จะต้องกำหนดให้กับไฟล์ applicationContext.xml ว่าให้อ่านข้อมูล username, password จากที่ไหนและยังไง กำหนดได้ดังรูปเลยค่ะ ก็จะเห็นว่าเราระบุชุดคำสั่ง SQL ที่จะใช้ดึงข้อมูลผู้ใช้ออกมา นอกจากนี้ยังกำหนดการเข้ารหัสพาสเวิร์ดได้ด้วยนะคะ
ท้ายที่สุดเห็นมั้ยคะว่า การสร้างเวปให้เป็นของเราเองไม่ได้ยากอย่างที่คิด ถึงรายละเอียดของ Java อาจจะเยอะไปหน่อย แต่ถ้าศึกษาดีๆ จะพบว่าเราก็สามารถเขียนเวปด้วย Java ได้ในเวลารวดเร็วเช่นกันนค่ะ
สำหรับการใช้ Spring Roo เพื่อสร้างเวปง่ายๆ ซีรีย์นี้เป็นการอธิบายการปรับเปลี่ยนโค้ดเมื่อใช้ Spring Roo สร้างเวป โดยที่ไม่ได้มุ่งเน้นให้เข้าใจโค้ดนะคะ ก็อาจจะเห็นว่ามีหลายๆจุดที่ ผู้อ่านคงรู้สึกว่าแล้วจะไปปรับอย่างอื่นให้มากกว่านี้ได้อย่างไร
ถ้าหากมีเวลา จะเขียนอธิบายโครงสร้างของ Spring Roo อย่างละเอียด(กว่านี้) ครั้งหน้า แต่อาจจะไม่มีเวลาอธิบาย Spring Framework และการเขียนเวปด้วย JAVA อย่างครบถ้วนนะคะ ผู้อ่านคงต้องปรับพื้นฐานด้วยการอ่านจากหนังสืออีกทีน่ะค่ะ อย่างไรก็ตาม ขอให้สนุกกับการเขียนเวปด้วยสปริงจิงโจ้นะคะ
แสดงบทความที่มีป้ายกำกับ Spring Roo แสดงบทความทั้งหมด
แสดงบทความที่มีป้ายกำกับ Spring Roo แสดงบทความทั้งหมด
วันอังคารที่ 18 ธันวาคม พ.ศ. 2555
วันจันทร์ที่ 17 ธันวาคม พ.ศ. 2555
ขี่จิงโจ้ รอบที่ 3-- มาแก้ไขโค้ดเพื่อให้ได้เวปอย่างที่คุณต้องการกันเถอะ ตอนที่ 2
ต่อจากตอนที่แล้วนะคะ เราก็สามารถเปลี่ยน theme ของเวปได้แล้ว ทีนี้เรามาเปลี่ยนหน้าตาเวปกันบ้าง
2. การเปลี่ยนข้อมูลแสดงผลหน้าตาของเวป ไฟล์ .jspx ที่ถูกสร้างให้อัตโนมัติ
ถ้าจำกันได้ เจ้า Spring Roo จะสร้างหน้าเวป 4 หน้าให้เราอัตโนมัติ ตามแบบ CRUD ซึ่งก็จะได้ไฟล์ create.jspx , list.jspx, show.jspx และ update.jspx มาสำหรับหนึ่งตารางข้อมูล ทีนี้หากเราต้องการปรับเปลี่ยนหน้าตาเหล่านี้ให้เป็นอย่างที่เราต้องการทำยังไงดี
อันดับแรก จะต้องไปที่ไฟล์ Controller ของข้อมูลชุดนั้นก่อนเลยค่ะ
จะเห็นว่าตรง @RooWebScaffold มีคำสั่งให้ automaticallyMaintainView=true อยู่ ให้เปลี่ยนเป็น =false ซะ ตรงนี้ก็คือคำสั่งที่ให้ Spring Roo ปรับเปลี่ยนหน้าเวปของเราให้อัตโนมัติค่ะ ที่ต้องมาเปลี่ยนเป็น false ก็เพราะว่า ถึงแม้เราไปแก้โค้ดหน้าเวปให้เปลี่ยนไปตามที่เราชอบแล้ว แต่ว่า spring roo ก็จะจัดการปรับหน้าเวปเรากลับมาเป็นเหมือนเดิมอยู่ดีค่ะ เพราะว่ามันจะสร้างหน้าเวปตามไฟล์ .java ที่มีอยู่ตามรูปแบบของมันเสมอ ดังนั้นต้องแก้เป็น false ก่อนที่เราจะเริ่มทำการแก้โค้ด .jspx นะคะ
มาถึงการแก้โค้ด ไฟล์ .jspx จะใช้ Syntax ของ spring form สำหรับฟอร์มที่เก็บข้อมูล (ดูได้ที่นี่ )และใช้ Syntax HTML กับ JSPX กับส่วนอื่นๆที่เหลือ
ยกตัวอย่างเช่น หน้าเวปที่เราได้ ตรง List Menu จะแสดงข้อความยาวๆ (คือทั้ง object) แต่เราอาจจะต้องการให้แสดงแค่ ชื่อ อย่างเดียว ก็สามารถ แก้ไขโดย ตรง <form:select> จะมี <form:options> ซึ่งก็คือตัวเลือกใน List เราก็เพิ่มตัวแปรเข้าไป ให้ itemLabel="name" (เมื่อ name คือชื่อตัวแปรใน .java) แค่นี้ก็ทำให้แสดงเฉพาะชื่อของกลุ่มแล้วค่ะ
<form:options itemValue="id" itemLabel="name" items="${expensecategorys}"/>
3. การที่เราจะเพิ่มไฟล์ .jspx เข้าไปใหม่ (ที่ไม่ใช่ 4 ไฟล์ที่ระบบสร้างให้อัตโนมัติแบบข้างบน) ก็สามารถทำได้เลย แต่จะต้องแก้ไขไฟล์ views.xml ซึ่งเป็นไฟล์ที่ทำหน้าที่ระบุว่ามีไฟล์ .jspx อะไรบ้าง
อย่างในรูปข้างบน จะเห็นว่าถ้าเราต้องการเพิ่มไฟล์ .jspx เข้าไปใหม่อีกไฟล์ ก็จะต้องเพิ่ม <definition> เข้าไปที่ระบุชื่อไฟล์นั้นๆค่ะ
4. การที่เราจะจัดการหน้าเมนู ที่มีไว้ให้อัตโนมัติ เราสามารถเพิ่มเมนูใหม่ๆ ปรับย้ายได้ตามต้องการ แต่ก็จะขออธิบายโครงสร้างมันไว้คร่าวๆเผื่อใครอยากจะแก้ไขไฟล์เดิม menu.jspx นะคะ
จะเห็นว่าไฟล์ menu.jspx นี้เป็น Syntax HTML ธรรมดา จะมีพิเศษก็ตรงที่ตัวแรป id กับค่าตัวแปรต่างๆที่ถูกเอามาใช้ เช่น ${web_mvc_jsp_create_recordexpenses_menu_item_url} นั้นเป็นตัวแปรของข้อความที่จะเอามาแสดงซึ่งถูกสร้างอัตโนมัติโดยระบบ อยู่ในไฟล์ที่ชื่อว่า application.properties ดังรูปค่ะ
จะเห็นว่า ตัวแปรก็เก็บแค่ข้อความที่จะใช้แสดงผลในหน้าเวปค่ะ เพราะฉะนั้น เราสามารถที่จะตั้งชื่อตัวแปรใหม่ก็ได้ หรือเปลี่ยนข้อความ(สีน้ำเงิน) ก็ได้ค่ะ
อีกจุดนึงก็คือ ตัวแปรที่ถูกใช้ในฟอร์ม เช่น <spring:message code=label.recordexpenses> ตัวแปร label.recordexpenses นี้คือตัวแปรที่อยู่ในไฟล์ message.properties ค่ะ
จะเห็นว่า การตั้งชื่อมักจะบอกก่อนว่าข้อความนี้จะถูกใช้ที่บริเวณไหน เช่น button. แล้วก็บอกรายละเอียดชื่อของข้อความ เช่นปุ่มบันทึกก็เป็น button.save เช่นเคยเราสามารถปรับเปลี่ยนข้อความ หรือเพิ่มตัวแปรใหม่ๆได้ค่ะ
ทีนี้ตรงนี้มีประโยชน์ตรงที่ว่า Spring Roo ออกแบบนี้เพื่อให้รองรับเวปที่มีมากกว่า 1 ภาษา ดูได้จากไฟล์ message.properties จะมีต่อท้ายว่า _de / _es คือเปลี่ยนตามภาษาค่ะ เพราะฉะนั้นเราก็แค่ให้หน้าแรกของเวปสามารถกดเลือกภาษาที่จะอ่านได้ ระบบก็จะมาดึงข้อมูลตัวแปรจากไฟล์ภาษาที่เลือกไปแสดงผลค่ะ
เดี๋ยวจะมาต่อ ตอนที่ 3 ให้จบการแก้ไขเวปอย่างง่ายๆบน Spring Roo นะคะ
2. การเปลี่ยนข้อมูลแสดงผลหน้าตาของเวป ไฟล์ .jspx ที่ถูกสร้างให้อัตโนมัติ
ถ้าจำกันได้ เจ้า Spring Roo จะสร้างหน้าเวป 4 หน้าให้เราอัตโนมัติ ตามแบบ CRUD ซึ่งก็จะได้ไฟล์ create.jspx , list.jspx, show.jspx และ update.jspx มาสำหรับหนึ่งตารางข้อมูล ทีนี้หากเราต้องการปรับเปลี่ยนหน้าตาเหล่านี้ให้เป็นอย่างที่เราต้องการทำยังไงดี
อันดับแรก จะต้องไปที่ไฟล์ Controller ของข้อมูลชุดนั้นก่อนเลยค่ะ
จะเห็นว่าตรง @RooWebScaffold มีคำสั่งให้ automaticallyMaintainView=true อยู่ ให้เปลี่ยนเป็น =false ซะ ตรงนี้ก็คือคำสั่งที่ให้ Spring Roo ปรับเปลี่ยนหน้าเวปของเราให้อัตโนมัติค่ะ ที่ต้องมาเปลี่ยนเป็น false ก็เพราะว่า ถึงแม้เราไปแก้โค้ดหน้าเวปให้เปลี่ยนไปตามที่เราชอบแล้ว แต่ว่า spring roo ก็จะจัดการปรับหน้าเวปเรากลับมาเป็นเหมือนเดิมอยู่ดีค่ะ เพราะว่ามันจะสร้างหน้าเวปตามไฟล์ .java ที่มีอยู่ตามรูปแบบของมันเสมอ ดังนั้นต้องแก้เป็น false ก่อนที่เราจะเริ่มทำการแก้โค้ด .jspx นะคะ
มาถึงการแก้โค้ด ไฟล์ .jspx จะใช้ Syntax ของ spring form สำหรับฟอร์มที่เก็บข้อมูล (ดูได้ที่นี่ )และใช้ Syntax HTML กับ JSPX กับส่วนอื่นๆที่เหลือ
ยกตัวอย่างเช่น หน้าเวปที่เราได้ ตรง List Menu จะแสดงข้อความยาวๆ (คือทั้ง object) แต่เราอาจจะต้องการให้แสดงแค่ ชื่อ อย่างเดียว ก็สามารถ แก้ไขโดย ตรง <form:select> จะมี <form:options> ซึ่งก็คือตัวเลือกใน List เราก็เพิ่มตัวแปรเข้าไป ให้ itemLabel="name" (เมื่อ name คือชื่อตัวแปรใน .java) แค่นี้ก็ทำให้แสดงเฉพาะชื่อของกลุ่มแล้วค่ะ
<form:options itemValue="id" itemLabel="name" items="${expensecategorys}"/>
3. การที่เราจะเพิ่มไฟล์ .jspx เข้าไปใหม่ (ที่ไม่ใช่ 4 ไฟล์ที่ระบบสร้างให้อัตโนมัติแบบข้างบน) ก็สามารถทำได้เลย แต่จะต้องแก้ไขไฟล์ views.xml ซึ่งเป็นไฟล์ที่ทำหน้าที่ระบุว่ามีไฟล์ .jspx อะไรบ้าง
อย่างในรูปข้างบน จะเห็นว่าถ้าเราต้องการเพิ่มไฟล์ .jspx เข้าไปใหม่อีกไฟล์ ก็จะต้องเพิ่ม <definition> เข้าไปที่ระบุชื่อไฟล์นั้นๆค่ะ
4. การที่เราจะจัดการหน้าเมนู ที่มีไว้ให้อัตโนมัติ เราสามารถเพิ่มเมนูใหม่ๆ ปรับย้ายได้ตามต้องการ แต่ก็จะขออธิบายโครงสร้างมันไว้คร่าวๆเผื่อใครอยากจะแก้ไขไฟล์เดิม menu.jspx นะคะ
จะเห็นว่าไฟล์ menu.jspx นี้เป็น Syntax HTML ธรรมดา จะมีพิเศษก็ตรงที่ตัวแรป id กับค่าตัวแปรต่างๆที่ถูกเอามาใช้ เช่น ${web_mvc_jsp_create_recordexpenses_menu_item_url} นั้นเป็นตัวแปรของข้อความที่จะเอามาแสดงซึ่งถูกสร้างอัตโนมัติโดยระบบ อยู่ในไฟล์ที่ชื่อว่า application.properties ดังรูปค่ะ
จะเห็นว่า ตัวแปรก็เก็บแค่ข้อความที่จะใช้แสดงผลในหน้าเวปค่ะ เพราะฉะนั้น เราสามารถที่จะตั้งชื่อตัวแปรใหม่ก็ได้ หรือเปลี่ยนข้อความ(สีน้ำเงิน) ก็ได้ค่ะ
อีกจุดนึงก็คือ ตัวแปรที่ถูกใช้ในฟอร์ม เช่น <spring:message code=label.recordexpenses> ตัวแปร label.recordexpenses นี้คือตัวแปรที่อยู่ในไฟล์ message.properties ค่ะ
จะเห็นว่า การตั้งชื่อมักจะบอกก่อนว่าข้อความนี้จะถูกใช้ที่บริเวณไหน เช่น button. แล้วก็บอกรายละเอียดชื่อของข้อความ เช่นปุ่มบันทึกก็เป็น button.save เช่นเคยเราสามารถปรับเปลี่ยนข้อความ หรือเพิ่มตัวแปรใหม่ๆได้ค่ะ
ทีนี้ตรงนี้มีประโยชน์ตรงที่ว่า Spring Roo ออกแบบนี้เพื่อให้รองรับเวปที่มีมากกว่า 1 ภาษา ดูได้จากไฟล์ message.properties จะมีต่อท้ายว่า _de / _es คือเปลี่ยนตามภาษาค่ะ เพราะฉะนั้นเราก็แค่ให้หน้าแรกของเวปสามารถกดเลือกภาษาที่จะอ่านได้ ระบบก็จะมาดึงข้อมูลตัวแปรจากไฟล์ภาษาที่เลือกไปแสดงผลค่ะ
เดี๋ยวจะมาต่อ ตอนที่ 3 ให้จบการแก้ไขเวปอย่างง่ายๆบน Spring Roo นะคะ
ขี่จิงโจ้ รอบที่ 3-- มาแก้ไขโค้ดเพื่อให้ได้เวปอย่างที่คุณต้องการกันเถอะ ตอนที่ 1
ทิ้งค้างกันไว้นานเลยนะคะ จากบทความ Spring Roo ครั้งที่แล้ว คราวนี้คิดว่าจะพยายามหาเวลาว่างเขียนบล็อกให้ได้อาทิตย์ละครั้ง ก็เลยอยากมาต่อเรื่องที่ติดค้างไว้ซักหน่อยค่ะ
จากครั้งที่แล้วได้โชว์ชุดคำสั่ง 14 คำสั่ง ที่ใช้สำหรับสร้างเวปอย่างง่ายๆ บน Spring Framework กันไปแล้ว จุดประสงค์ก็เพื่อต้องการให้เห็นว่า แม้ Java เองก็มี scaffold มารองรับ ทำให้สร้างเวปได้ง่ายขึ้นเหมือนๆกับ dynamic language ภาษาอื่นๆเหมือนกันค่ะ (แต่เอาเข้าจริง Java จะค่อนข้างซับซ้อนกว่านะคะ)
หลังจากที่รัน 14 คำสั่งพื้นฐานเสร็จแล้ว เราก็จะได้เวปที่มีหน้าตาสีเขียวตาม Template ที่เค้าให้มา และก็อาจจะมีอีกหลายๆจุดในเวปที่ยังไม่ตรงกับความต้องการของเราจริงๆใช่มั้ยคะ
เริ่มต้น จะเห็นว่า Spring Roo สร้างโฟลเดอร์และไฟล์ต่างๆให้เราอัตโนมัติตามรูปนี้ค่ะ
ทีนี้เราจะเริ่มมาปรับปรุงแก้ไขกันทีละจุด (อย่างง่ายๆ) เพื่อให้เหมาะกับการสร้างเวปอย่างง่ายนะคะ
1. ถ้าหากต้องการเปลี่ยนหน้าตา template / theme ของเวป เราก็คงต้องการเปลี่ยนไฟล์ CSS ที่ใช้ใช่มั้ยคะ สำหรับไฟล์ที่ทำหน้าที่เกี่ยวกับการแสดงผลหน้าตาของเวปนั้น จะอยู่ในโฟลเดอร์ WEB-INF/layouts ค่ะ
จะเห็นว่าในโฟลเดอร์ layouts มีไฟล์ default.jspx กับไฟล์ layouts.xml อยู่ซึ่งไฟล์ .jspx ก็คือไฟล์ theme ในเวปนั่นเองค่ะ ส่วนไฟล์ .xml จะเป็นไฟล์ที่กำหนดโครงสร้างว่า theme เวปเนี่ยจะมีไฟล์ .jspx อะไรบ้างที่จะเอามาใช้
เริ่มจากดูที่ไฟล์ layouts.xml ก่อนนะคะ ก็จะเห็นว่า โครงสร้างของ theme เวปแบ่งเป็นสองส่วนค่ะ คือ body กับ menu ไฟล์ .xml เนี่ยก็จะระบุว่า ส่วนของ body จะใช้ .jspx อะไร และส่วน menu ใช้ .jspx อะไร ซึ่งเราก็จะสามารถเปลี่ยนไฟล์ .jspx ที่ใช้ตามที่เราออกแบบได้ค่ะ
สำหรับไฟล์ default.jspx ก็จะเป็นรายละเอียดส่วนของ theme ในหน้าเวปทั้งหมด ซึ่งจะสามารถเพิ่มลิงก์ไฟล์ CSS และ Java Script ได้ค่ะ จะเห็นว่า Syntax ที่ใช้นั้นเป็น spring tag ดังนั้น เราจะต้องใช้ <spring:url> เพื่อกำหนดที่อยู่ลิงก์ของไฟล์ CSS / Java Script ก่อนที่จะ เพิ่มเข้าไปในหน้าเวป หากจะเพิ่มหรือเปลี่ยนไฟล์ CSS แก้ตรงคำสั่ง <link rel="stylesheet">
หากจะเพิ่มหรือเปลี่ยนไฟล์ Java Script ก็แก้ตรงคำสั่ง <script >
ส่วน Syntax อื่นๆทั่วไปก็เป็น HTML ธรรมดา ซึ่งสามารถที่จะปรับเปลี่ยนได้ตามใจเราต้องการ
อ่านต่อได้ที่ มาแก้ไขโค้ดเพื่อให้ได้เวปอย่างที่คุณต้องการกันเถอะ ตอนที่ 2
จากครั้งที่แล้วได้โชว์ชุดคำสั่ง 14 คำสั่ง ที่ใช้สำหรับสร้างเวปอย่างง่ายๆ บน Spring Framework กันไปแล้ว จุดประสงค์ก็เพื่อต้องการให้เห็นว่า แม้ Java เองก็มี scaffold มารองรับ ทำให้สร้างเวปได้ง่ายขึ้นเหมือนๆกับ dynamic language ภาษาอื่นๆเหมือนกันค่ะ (แต่เอาเข้าจริง Java จะค่อนข้างซับซ้อนกว่านะคะ)
หลังจากที่รัน 14 คำสั่งพื้นฐานเสร็จแล้ว เราก็จะได้เวปที่มีหน้าตาสีเขียวตาม Template ที่เค้าให้มา และก็อาจจะมีอีกหลายๆจุดในเวปที่ยังไม่ตรงกับความต้องการของเราจริงๆใช่มั้ยคะ
เริ่มต้น จะเห็นว่า Spring Roo สร้างโฟลเดอร์และไฟล์ต่างๆให้เราอัตโนมัติตามรูปนี้ค่ะ
ทีนี้เราจะเริ่มมาปรับปรุงแก้ไขกันทีละจุด (อย่างง่ายๆ) เพื่อให้เหมาะกับการสร้างเวปอย่างง่ายนะคะ
1. ถ้าหากต้องการเปลี่ยนหน้าตา template / theme ของเวป เราก็คงต้องการเปลี่ยนไฟล์ CSS ที่ใช้ใช่มั้ยคะ สำหรับไฟล์ที่ทำหน้าที่เกี่ยวกับการแสดงผลหน้าตาของเวปนั้น จะอยู่ในโฟลเดอร์ WEB-INF/layouts ค่ะ
จะเห็นว่าในโฟลเดอร์ layouts มีไฟล์ default.jspx กับไฟล์ layouts.xml อยู่ซึ่งไฟล์ .jspx ก็คือไฟล์ theme ในเวปนั่นเองค่ะ ส่วนไฟล์ .xml จะเป็นไฟล์ที่กำหนดโครงสร้างว่า theme เวปเนี่ยจะมีไฟล์ .jspx อะไรบ้างที่จะเอามาใช้
เริ่มจากดูที่ไฟล์ layouts.xml ก่อนนะคะ ก็จะเห็นว่า โครงสร้างของ theme เวปแบ่งเป็นสองส่วนค่ะ คือ body กับ menu ไฟล์ .xml เนี่ยก็จะระบุว่า ส่วนของ body จะใช้ .jspx อะไร และส่วน menu ใช้ .jspx อะไร ซึ่งเราก็จะสามารถเปลี่ยนไฟล์ .jspx ที่ใช้ตามที่เราออกแบบได้ค่ะ
สำหรับไฟล์ default.jspx ก็จะเป็นรายละเอียดส่วนของ theme ในหน้าเวปทั้งหมด ซึ่งจะสามารถเพิ่มลิงก์ไฟล์ CSS และ Java Script ได้ค่ะ จะเห็นว่า Syntax ที่ใช้นั้นเป็น spring tag ดังนั้น เราจะต้องใช้ <spring:url> เพื่อกำหนดที่อยู่ลิงก์ของไฟล์ CSS / Java Script ก่อนที่จะ เพิ่มเข้าไปในหน้าเวป หากจะเพิ่มหรือเปลี่ยนไฟล์ CSS แก้ตรงคำสั่ง <link rel="stylesheet">
หากจะเพิ่มหรือเปลี่ยนไฟล์ Java Script ก็แก้ตรงคำสั่ง <script >
ส่วน Syntax อื่นๆทั่วไปก็เป็น HTML ธรรมดา ซึ่งสามารถที่จะปรับเปลี่ยนได้ตามใจเราต้องการ
อ่านต่อได้ที่ มาแก้ไขโค้ดเพื่อให้ได้เวปอย่างที่คุณต้องการกันเถอะ ตอนที่ 2
วันพุธที่ 21 กันยายน พ.ศ. 2554
ขี่จิงโจ้ รอบที่ 2 -- โชว์ขั้นตอนการสร้างเวปอย่างง่าย
ทีนี้เราจะมาดูขั้นตอนการสร้างเวปใน 5 นาทีกันนะคะ กับ 14 command line ที่ให้ไว้เมื่อรอบที่แล้ว
สำหรับรูปที่จะนำมาโชว์เนี่ย จะเป็นรูปจากการพัฒนาบน Spring Source Tool Suite (STS) นะคะ ซึ่งก็คือ eclipse เวอร์ชันสำหรับ Spring นั่นเองค่ะ
สำหรับใครที่ยังไม่มีอุปกรณ์ในการขับขี่เจ้า Roo ก็อย่าลืมไปโหลดมาไว้ในเครื่องนะคะ ก็มี 5 อย่าง คือ
สำหรับรูปที่จะนำมาโชว์เนี่ย จะเป็นรูปจากการพัฒนาบน Spring Source Tool Suite (STS) นะคะ ซึ่งก็คือ eclipse เวอร์ชันสำหรับ Spring นั่นเองค่ะ
สำหรับใครที่ยังไม่มีอุปกรณ์ในการขับขี่เจ้า Roo ก็อย่าลืมไปโหลดมาไว้ในเครื่องนะคะ ก็มี 5 อย่าง คือ
- Java 6 JDK
- Apache Maven
- Spring Roo
- Spring Source Tool Suite (STS)
- Database Management Tool (ในที่นี้ใช้ Microsoft SQL Server 2008 นะคะ)
เริ่มจากการสร้าง Roo project ใน STS
พอสร้างเสร็จก็จะมี Roo shell ขึ้นมาให้เราใช้ command line กันได้แบบนี้
จากรอบที่แล้ว ให้ command line ไว้ 14 คำสั่งใช่มั้ยคะ ซึ่งคำสั่งแรกจะเป็นการสร้างโปรเจคค่ะ ดังนั้น เราก็ตัดออกไปได้เลย ทีนี้เราจะมาจัดการกับ 13 คำสั่งที่เหลือแทนค่ะ
![]() |
| persistence setup เป็นคำสั่่งในการสร้างตัวกำหนดเงื่อนไขการติดต่อฐานข้อมูลนะคะ ในที่นี้เราเลือกติดต่อกับ Microsoft SQL Server ค่ะ ก็จะเห็นว่าเป็น MSSQL |
![]() |
| และเราก็เปิดไฟล์ database.properties มาแก้ไขรายละเอียดในการติดต่อกับฐานข้อมูลกันค่ะ |
![]() |
| นี่คือรูปร่างหน้าตาของคลาสที่สร้างขึ้นมาโดยอัตโนมัติ ด้วยฝีมือเจ้า Roo ค่ะ |
![]() |
| เมื่อเรามีคลาสและตัวแปรไว้ใช้รองรับการเก็บข้อมูลแล้ว เราก็จะมาสร้างหน้าเวปกับส่วนคอนโทรลกันค่ะ ด้วยคำสั่ง controller ซึ่งในที่นี้เราใช้ all เพื่อจะบอกว่าให้สร้างเวปสำหรับทุกคลาสเลยค่ะ |
หลังจากนั้นก็ใช้คำสั่ง perform tests เพื่อสร้างคลาส test และทดลอง build นะคะ ถ้าเรียบร้อยดีแล้วเราก็มาดูผลงานกันได้เลยค่ะ
![]() |
| อันนี้เป็นหน้าแรกของเวปนะคะ |
![]() |
| ทดลองเพิ่มหมวดหมู่รายการที่ซื้อซักหน่อย |
![]() |
| วันนี้กินผัดไทยหมูแดง อร๊อยอร่อย ราคา 30 บาทเอง ต้องบันทึกซักหน่อยแล้วล่ะ |
![]() |
| แสดงรายละเอียดได้ครบถ้วน และถูกต้อง เก่งมากเจ้า Roo |
ถึงตรงนี้ ถ้าดูจากรูปอาจจะสงสัยว่าเอ๊ะ แล้วหน้า login หายไปไหนล่ะ แล้วทำไม category ถึงไม่แสดงแต่ชื่อหมวดหมู่ว่า อาหาร จะโชว์ id กับ version ทำไม
อย่าเพิ่งใจร้อนนะคะ ไว้ครั้งหน้าเราจะมาดูกันว่า การปรับเปลี่ยนจากหน้าเวปที่ได้มาพื้นฐานแบบนี้ จะให้เป็นตามใจฉันอีกที ต้องทำอะไรตรงไหนบ้าง
สำหรับวันนี้ไปนอนก่อนแล้วค่ะ ง่วงมากมาย ฝันดีนะคะ :)
ขี่จิงโจ้ รอบที่ 1 -- โชว์การเขียนเวปใน 5 นาที
กว่าจะอัพบล็อกวันนี้ได้เหนื่อยแฮก ต้อง capture screen เพียบเลย บวกกับความรู้อันน้อยนิดของเรา ทำให้เราต้องไปจัดการเซฟรูปในโปรแกรม Paint ค่ะ (ขอขอบคุณ paint อย่างมากที่ช่วยชีวิตไว้) แต่ว่ารู้สึกว่ามันไม่ค่อยสะดวกเลย ใครมีคำแนะนำบ้างมั้ยคะ (photoshop ไม่มีในเครื่องนะคะ อิๆ)
ตอนนี้พร้อมแล้วค่ะที่จะมาขี่จิงโจ้โชว์ เป็นการยั่วใจกันก่อน ต้องทำการเรียกผู้ชมให้หลงผิด(เอ้ย ม่ายช่าย) และพระเอกของวันนี้ชื่อ Roo1.02 ค่ะ ฮ่าๆๆ เก่าได้ใจมั้ยคะ อันที่จริงตอนนี้ก็น่าจะเป็น 1.1.5 แล้วล่ะค่ะ แต่เราอนุรักษ์ความโบราณเอาไว้ (อันที่จริง ได้ข่าวว่าขี้เกียจโหลดมาใหม่นะเรา)
สำหรับวันนี้จะยังไม่ขออธิบายในรายละเอียดโครงสร้างของเจ้า Roo นะคะ จะขอแค่มาโชว์เดี่ยวอย่างเดียวก่อน เพราะอยากให้เห็นถึงความเร็วก่อนค่ะ ส่วนไอ้เรื่องยากๆ เอาไว้ท้ายๆดีกว่า ฮ่าๆๆ
วันนี้เราจะสร้างเวปสำหรับบันทึกรายจ่ายประจำวันกันค่ะ (เงินทองต้องใส่ใจใช่มั้ยคะ) เอาเป็นระบบง่ายๆก่อนละกันนะคะ อย่างในรูปนี้
ก็จะเห็นว่าเราจะทำการสร้างฐานข้อมูลที่มีตารางเก็บข้อมูลสองส่วน คือ
หมวดหมู่ของรายการที่จ่าย (Expense Category)
กับบันทึกรายจ่ายประจำวัน (Record Expenses)
และเราก็จะต้องมีหน้าเวปที่สามารถเพิ่มบันทึกรายจ่ายประจำวันได้อย่างในรูป
และแน่นอนค่ะ สูตรสำเร็จพื้นฐานของการสร้างเวปแอพพลิเคชั่น ก็คือ จะต้องมี ส่วนของการ เพิ่ม แก้ไข ลบ และเรียกดู ข้อมูล อย่างแน่นอน
ทีนี้เราก็จะมาดูกันว่า Roo จะทำทั้งหมดนี้ให้เราได้อย่างไร
อย่างที่บอกว่าวันนี้จะมาโชว์อย่างเดียวนะคะ ดังนั้น เราจะโชว์การสร้างเวปจากโจทย์ข้างบนอย่างง่ายๆภายใน 14 คำสั่งนี้กันค่ะ
ตอนนี้พร้อมแล้วค่ะที่จะมาขี่จิงโจ้โชว์ เป็นการยั่วใจกันก่อน ต้องทำการเรียกผู้ชมให้หลงผิด(เอ้ย ม่ายช่าย) และพระเอกของวันนี้ชื่อ Roo1.02 ค่ะ ฮ่าๆๆ เก่าได้ใจมั้ยคะ อันที่จริงตอนนี้ก็น่าจะเป็น 1.1.5 แล้วล่ะค่ะ แต่เราอนุรักษ์ความโบราณเอาไว้ (อันที่จริง ได้ข่าวว่าขี้เกียจโหลดมาใหม่นะเรา)
สำหรับวันนี้จะยังไม่ขออธิบายในรายละเอียดโครงสร้างของเจ้า Roo นะคะ จะขอแค่มาโชว์เดี่ยวอย่างเดียวก่อน เพราะอยากให้เห็นถึงความเร็วก่อนค่ะ ส่วนไอ้เรื่องยากๆ เอาไว้ท้ายๆดีกว่า ฮ่าๆๆ
วันนี้เราจะสร้างเวปสำหรับบันทึกรายจ่ายประจำวันกันค่ะ (เงินทองต้องใส่ใจใช่มั้ยคะ) เอาเป็นระบบง่ายๆก่อนละกันนะคะ อย่างในรูปนี้
ก็จะเห็นว่าเราจะทำการสร้างฐานข้อมูลที่มีตารางเก็บข้อมูลสองส่วน คือ
หมวดหมู่ของรายการที่จ่าย (Expense Category)
กับบันทึกรายจ่ายประจำวัน (Record Expenses)
และเราก็จะต้องมีหน้าเวปที่สามารถเพิ่มบันทึกรายจ่ายประจำวันได้อย่างในรูป
และแน่นอนค่ะ สูตรสำเร็จพื้นฐานของการสร้างเวปแอพพลิเคชั่น ก็คือ จะต้องมี ส่วนของการ เพิ่ม แก้ไข ลบ และเรียกดู ข้อมูล อย่างแน่นอน
ทีนี้เราก็จะมาดูกันว่า Roo จะทำทั้งหมดนี้ให้เราได้อย่างไร
อย่างที่บอกว่าวันนี้จะมาโชว์อย่างเดียวนะคะ ดังนั้น เราจะโชว์การสร้างเวปจากโจทย์ข้างบนอย่างง่ายๆภายใน 14 คำสั่งนี้กันค่ะ
project --topLevelPackage antshare.tutorial.expenses
persistence setup --provider HIBERNATE --database MSSQL
entity --class ~.domain.ExpenseCategory --testAutomatically
field string --fieldName name --notNull --sizeMin 2 --sizeMax 255
entity --class ~.domain.RecordExpenses --testAutomatically
field date --fieldName recordDate --notNull --type java.util.Date
field reference --fieldName category --type ~.domain.ExpenseCategory
field string --fieldName name --notNull --sizeMin 2 --sizeMax 255
field number --fieldName number --notNull --type java.lang.Integer
field number --fieldName price --notNull --type java.lang.Float
field number --fieldName total --notNull --type java.lang.Float --transient
controller all --package ~.web
security setup
perform tests
ใช้เวลาในการรันคำสั่งทั้งหมดนี้ไม่เกิน 5 นาที เราก็จะได้เวปสำหรับบันทึกรายจ่ายในชีวิตประจำวันอย่างง่ายๆแล้วล่ะค่ะ
สำหรับรายละเอียดรูปภาพในการทำแต่ละขั้นตอน เดี๋ยวอธิบายใน โชว์รอบที่ 2 นะคะ รูปเยอะมากๆค่ะ ^^
วันเสาร์ที่ 17 กันยายน พ.ศ. 2554
Spring Roo ผู้ช่วยให้การเขียนเวปบน Java เป็นเรื่องง่าย
หลังจากที่ได้ปลุกปล้ำถลำลึกกับการทดลองของเล่นน้องใหม่ ในตระกูลจาวามาได้ปีกว่าๆ เราก็คิดว่า เอาหละ มันถึงเวลาแล้ว ที่ควรจะบันทึกเรื่องราวดราม่าอันเข้มข้น ของ Spring Roo ออกสู่สายตาประชาชนชาวไทยเสียที (อิๆ อันนี้ก็เวอร์)
และเราก็อยากจะขอแก้ตัวไว้ล่วงหน้าก่อนเลยนะคะว่า เราไม่ได้เป็นนายหน้า หรือมีส่วนเกี่ยวข้องใดๆทั้งสิ้นกับค่ายจิงโจ้ ที่จะมาอวย และเชียร์ให้ใครต่อใครเชื่อว่า จิงโจ้ดีอย่างโน้นดีอย่างนี้
เราแค่อยากจะนำเสนอและแบ่งปันความรู้ที่เรามี และคิดว่าอาจจะเป็นประโยชน์กับคนอื่นๆบ้างเท่านั้นเองค่ะ ซึ่งก็แน่นอนว่า เราไม่คิดที่จะปกปิดข้อเสียของจิงโจ้ที่เราพบเจอหรอกนะคะ เรารับรองว่าจะเปิดไพ่แบไต๋ให้รู้จักจิงโจ้ในหลายๆแง่มุมกันแน่นอนค่ะ แต่ว่าคงจะค่อยๆเขียนกันไปนำเสนอกันไปทีละเรื่องนะคะ ตามแต่เวลาและโอกาสจะเอื้ออำนวย บวกกับความขยันด้วยค่า (อันนี้สำคัญมาก อิๆ)
เอาหละ เราขอโปรยคำโฆษณาอันสวยหรูไว้แค่นี้ก่อนนะคะ แล้วครั้งหน้า เราจะมาให้ข้อมูลเพิ่มเติมว่า เจ้า Roo นี้กระโดดได้เร็ว และขี่ได้ง่ายสมคำชมหรือเปล่าค่ะ บ๊ายบาย
เรื่องของเรื่อง ก็คือว่า เราอยากแบ่งปันและแลกเปลี่ยนความรู้มากกว่าน่ะค่ะ เพราะว่าเราเองก็ไม่ได้เชี่ยวชาญอะไรนัก แต่ก็รู้สึกว่า เจ้า Roo นี่มันก็ดีใช้ได้ ก็เลยคิดว่าจะเริ่มเขียนบทความเกี่ยวกับสิ่งที่ตัวเองรู้มาจากเจ้า Roo เนี่ยแหละค่ะ ที่สำคัญมันก็ได้กลายเป็น document ภาษาไทยชั้นดีสำหรับตัวเราเองด้วย
สำหรับท่านใดที่อ่านบทความเกี่ยวกับเจ้า Roo แล้วรู้สึกว่ามีตรงไหนที่ผิดพลาด หรือควรแก้ไข หรืออยากแบ่งปันความรู้กัน หรือมีข้อแนะนำดีๆ เรายินดีรับฟังนะคะ เพราะอย่างที่กล่าวไว้ตั้งแต่แรกว่า ตัวเราเองก็เป็นแค่มือใหม่หัดขี่เจ้า Roo ค่ะ
เห็นเราเรียกเจ้า Roo คงจะสงสัยว่าทำไมมันขี่ได้ใช่มั้ยคะ ก่อนอื่นอยากจะเกริ่นนิดๆ พอเป็นน้ำจิ้มก่อนว่าเจ้า Roo เนี่ยมันเป็นใคร
จริงๆแล้ว ทีมนักพัฒนาเค้าตั้งชื่อเต็มๆให้มันว่า Spring Roo ค่ะ และคำว่า Roo เนี่ยก็มาจาก Kangaroo ที่แปลว่า จิงโจ้ นั่นแหละค่ะ ทีนี้ก็เดาได้เลยใช่มั้ยคะว่า เจ้า Roo เนี่ยเกิดที่ไหน แต่นแตนแต๊น... แน่นอนค่ะว่า ประเทศไทยนี่เอง เอ้ย..ไม่ช่ายยยย (มันจะตลกไปแล้วหล่ะ)
ทีนี้ความสามารถของมันเป็นอย่างไร ชื่อมันคงไม่สามารถบอกอะไรได้ใช่มั้ยคะ เจ้า Roo เนี่ย ถูกพัฒนาขึ้นมา เพื่อช่วยให้การเวปด้วยภาษาจาวา บน Spring Framework เป็นเรื่องง่ายขึ้น และไม่ใช่แค่เพียงเท่านั้น เมื่อคุณใช้ Roo วันนี้ คุณจะพัฒนาเวปบน Spring Framework ได้เร็วขึ้นกว่าเดิมอีกหลายเท่าตัวเลยทีเดียว
ประโยคคุ้นๆเหมือนโฆษณาพวก direct sale มั้ยคะ อิๆ แต่ว่า...เราไม่ได้พูดเกินจริงเลยค่ะ เจ้า Roo เนี่ยช่วยให้เขียนเวปด้วยจาวาได้เร็วขึ้นจริง ถ้าหากใครเคยพัฒนา Ruby on Rails ที่ว่าเร็ว และแรง หรือจะเป็น Python on Django ที่ทำให้คุณติดใจกันมาแล้ว วันนี้ Spring Roo จะเข้ามาอยู่ในอ้อมอกอ้อมใจของคุณได้ไม่ยากเลยค่ะ (ถ้าไม่เกลียดจาวามาก่อนนะคะ)
แต่ว่า...ถ้าใครที่อาจจะรู้สึก เอ๊ะ!! อยู่ในใจ เราก็อยากจะบอกว่า ที่เขียนมาไม่ได้จะบอกว่าใครดีกว่าใครนะคะ Ruby, Python, Spring etc. ต่างก็มีข้อดีข้อเสียของตัวเองทั้งนั้น ไม่อยากเปรียบเทียบให้ขัดใจกันหรอกค่ะ แต่ที่ต้องการสื่อจริงๆก็เพียงว่า ความซับซ้อนในการเขียนเวปด้วยจาวาทั้งปวง เจ้า Roo มันช่วยปกปิดไว้ ทำให้เราเขียนเวปได้เร็วขึ้นเท่านั้นเองค่ะ
แต่ว่า...ถ้าใครที่อาจจะรู้สึก เอ๊ะ!! อยู่ในใจ เราก็อยากจะบอกว่า ที่เขียนมาไม่ได้จะบอกว่าใครดีกว่าใครนะคะ Ruby, Python, Spring etc. ต่างก็มีข้อดีข้อเสียของตัวเองทั้งนั้น ไม่อยากเปรียบเทียบให้ขัดใจกันหรอกค่ะ แต่ที่ต้องการสื่อจริงๆก็เพียงว่า ความซับซ้อนในการเขียนเวปด้วยจาวาทั้งปวง เจ้า Roo มันช่วยปกปิดไว้ ทำให้เราเขียนเวปได้เร็วขึ้นเท่านั้นเองค่ะ
และเราก็อยากจะขอแก้ตัวไว้ล่วงหน้าก่อนเลยนะคะว่า เราไม่ได้เป็นนายหน้า หรือมีส่วนเกี่ยวข้องใดๆทั้งสิ้นกับค่ายจิงโจ้ ที่จะมาอวย และเชียร์ให้ใครต่อใครเชื่อว่า จิงโจ้ดีอย่างโน้นดีอย่างนี้
เราแค่อยากจะนำเสนอและแบ่งปันความรู้ที่เรามี และคิดว่าอาจจะเป็นประโยชน์กับคนอื่นๆบ้างเท่านั้นเองค่ะ ซึ่งก็แน่นอนว่า เราไม่คิดที่จะปกปิดข้อเสียของจิงโจ้ที่เราพบเจอหรอกนะคะ เรารับรองว่าจะเปิดไพ่แบไต๋ให้รู้จักจิงโจ้ในหลายๆแง่มุมกันแน่นอนค่ะ แต่ว่าคงจะค่อยๆเขียนกันไปนำเสนอกันไปทีละเรื่องนะคะ ตามแต่เวลาและโอกาสจะเอื้ออำนวย บวกกับความขยันด้วยค่า (อันนี้สำคัญมาก อิๆ)
เอาหละ เราขอโปรยคำโฆษณาอันสวยหรูไว้แค่นี้ก่อนนะคะ แล้วครั้งหน้า เราจะมาให้ข้อมูลเพิ่มเติมว่า เจ้า Roo นี้กระโดดได้เร็ว และขี่ได้ง่ายสมคำชมหรือเปล่าค่ะ บ๊ายบาย
สมัครสมาชิก:
บทความ (Atom)
-
วันนี้เหม็นกลิ่นน้ำส้มสายชูควันไม้มาก คือว่าที่ห้องเนี่ยจะมี "มด" มาเที่ยวหาตลอด ไม่ว่าจะย้ายไปอยู่ที่ไหนก็ตาม รักกันมาก เอาแป้งฝุ...
-
ที่มาภาพ http://en.wikipedia.org/wiki/Spirited_Away Spirited Away เรื่องนี้ถ้าแปลตามตัวก็คือเรื่องจิตวิญญาณที่หายไป แต่ว่าชื่อในภาษาญี่ป...
-
สำหรับใครที่เพิ่งเข้ามาหน้านี้ แนะนำว่าให้อ่าน ที่นี่ ก่อนนะคะ เอาล่ะที่นี้เราจะมาคุยกันต่อเรื่องว่า ทำอย่างไรเราถึงจะนำเสนอรูปแบบข้อมูลให้...































