วันจันทร์ที่ 3 ตุลาคม พ.ศ. 2554

Beginner's Mind Ruby on Rails

Just started learning Ruby on Rails a few days ago and would like to share what I would like to do with RoR and what I get from this framework and how I feel about it via this blog. Will keep posting my progress and thought soon :)

วันอาทิตย์ที่ 17 กรกฎาคม พ.ศ. 2554

วีดีโอสอนการเขียนโปรแกรมภาษา Java

สวัสดีครับ เนื่องจากติดงานและอ่านหนังสือ เลยทำให้ไม่มีเวลามาเขียนบล๊อกเป็นเวลาหลายเดือน กลับมาคราวนี้ ผมกำลังทดลองทำวีดีโอสอนการเขียนโปรแกรมภาษา Java อยู่ครับ ก็เลยอยากจะมาแบ่งปันกันผ่านทางบล๊อกนี้ ก็ยังอยู่ในช่วงทดลองการสอนในแบบต่างๆ อยู่ ถ้ามีคำติชม ก็ทิ้งไว้ที่ YouTube หรือ ที่บล๊อกนี้ก็ได้นะครับ

http://www.youtube.com/user/thaiprogch

สำหรับผู้ที่สนใจจะลองวีดีโอการสอนดู โปรแกรมที่ผมใช้ในการทำวีดีโอการสอนก็มีดังนี้ครับ


  • CamStudio - เป็นโปรแกรมสำหรับบันทึกหน้าจอคอมพิวเตอร์ของเราระหว่างใช้งานให้อยู่ในรูปของวีดีโอ AVI หรือ SWF ไฟล์ เป็นโปรแกรมแจกฟรีนะครับ การใช้งานโปรแกรมเดี๋ยวถ้าผมว่างจะมาแนะนำการใช้งานให้ฟังนะครับ


  • MS Paint - เป็นโปรแกรมที่แถมมากับวินโดว์อยู่แล้ว ผมใช้แทนกระดานดำเวลาที่เขียนอธิบายเนื้อหาที่เราสอน ถ้ามีเมาส์ที่เป็นปากกาอย่างที่ผมใช้ก็จะสะดวกมากขึ้น เหมือนกับเขียนกระดานดำจริงๆ เลย


ก็ลองไปดาว์โหลดมาใช้งานดูนะครับ CamStudio ดีมากๆ :)

วันศุกร์ที่ 10 กันยายน พ.ศ. 2553

พัฒนาเกมส์เอ็นจิ้นด้วย HTML5 + JavaScript ตอนที่ 3 ทดสอบคลาส JsgeObject

ใน บทความที่ 2 เราได้เขียนคลาส JsgeObject กันไปแล้ว ในบทความนี้เราจะมาต่อกันในเรื่องการเทสคลาสที่เราเขียนขึ้นมา การพัฒนาซอฟต์แวร์ในปัจจุบันมีการคิดค้นเทคนิค วิธีการและเครื่องมือมากมาย ที่ช่วยให้เราทดสอบโค้ดที่เราเขียนได้เป็นระบบมีแบบแผนมากขึ้น ซึ่งในบทความนี้เราจะมาดูเทคนิคและเครื่องมือเหล่านี้กัน

หลายปีที่ผ่านมานักพัฒนาซอฟต์แวร์เป็นจำนวนมากได้นำวิธีการพัฒนาซอฟต์แวร์ที่เรียกว่า Test-Driven Development (TDD) มาใช้กันอย่างแพร่หลาย โดยหลักการของ TDD ก็คือ เป็นการพัฒนาซอฟต์แวร์ที่ใช้ การทดสอบโปรแกรมแบบอัตโนมัติ (Automated Unit Test) เป็นตัวขับเคลื่อน ผลักดันกระบวนการพัฒนาซอฟต์แวร์ เป็นการพัฒนาซอฟต์แวร์โดยการเขียนโค้ดที่ใช้ทดสอบการทำงานของตัวโปรแกรม (Unit Test) ก่อนที่จะเขียนโค้ดการทำงานของโปรแกรมจริงๆ ซึ่งมี 3 ขั้นตอนดังนี้
  1. Red - เขียนโค้ดที่ใช้ทดสอบการทำงานของโปรแกรมก่อนที่จะเขียนโค้ดการทำงานของโปรแกรม และให้การทดสอบทุกอันได้ผลลัพธ์ไม่ผ่านการทดสอบ
  2. Green - เขียนโค้ดการทำงานของโปรแกรมในผ่านการทดสอบ โดยเขียนโค้ดเท่าที่จำเป็นเพื่อให้ผ่านการทดสอบเท่านั้น
  3. Refactor - ปรับปรุงโค้ดที่เราเขียนในขั้นตอนที่ 2 ให้ดีขึ้น เช่น ลดโค้ดที่ซ้ำซ้อน หรือ ลดจำนวนโค้ดที่เขียนขึ้นแต่ทำงานได้เท่าเดิม เป็นต้น หลังจากที่ปรับปรุงโค้ดแล้ว ก็ให้ทำการทดสอบทุกครั้ง เพื่อให้แน่ใจว่าโค้ดที่ปรับปรุงไม่กระทบการทำงานของโปรแกรมและยังทำงานได้ตามปกติ
จากขั้นตอนข้างต้นเราจะมาเริ่มเขียนโค้ดทดสอบคลาส JsgeObject กัน ถึงแม้นว่าเราจะข้ามขั้นตอนแรกไปเนื่องจากเราเขียนโค้ดของคลาส JsgeObject ไว้ก่อนแล้ว ก็ให้ทำเป็นเหมือนว่าเรายังไม่ได้เขียนโค้ดมาก่อน เวลาที่เราคิดว่าจะทดสอบอะไรบ้างนั้น ความคิดของเราจะได้ไม่โดนจำกัดด้วยโค้ดที่เราเขียนขึ้นไว้ก่อนหน้านี้แล้ว

การพัฒนาซอฟต์แวร์แบบ TDD มีข้อดีก็คือ ทำให้เราได้โค้ดที่สามารถทดสอบได้ โค้ดที่เขียนขึ้นค่อนข้างตรงกับมุมมองของผู้ใช้งาน เนื่องจากเราต้องเขียนการทดสอบก่อนว่าจะใช้งานโค้ดส่วนนั้นอย่างไร และการทดสอบที่เราเขียนขึ้นอ้างอิงจากการใช้งานของผู้ใช้เป็นหลัก และสุดท้ายเวลาที่เราปรับปรุงโค้ด เราสามารถที่จะทำการทดสอบได้อย่างรวดเร็วว่าโค้ดยังทำงานถูกต้องหรือไม่ ด้วยการทดสอบแบบอัตโนมัติช่วยลดเวลาในการทำงาน

เรามาเริ่มต้นเขียนการทดสอบโค้ดกัน โดยเราจะใช้วิธีที่ง่ายที่สุดก่อน ก็คือใช้ if-statement ในการทดสอบดังตัวอย่างข้างล่าง และหลังจากนั้นเราจะแสดงการใช้ Unit Test Library ที่ชื่อ QUnit แทนที่จะใช้ if-statment ในการทดสอบโค้ด

var jsgeObj = new JsgeObject(10, 20);
jsgeObj.setData("hero");

if(jsgeObj.getX() != 10) {
document.write("the x pos must be 10");
}
if(jsgeObj.getY() != 20) {
document.write("the y pos must be 20");
}
if(jsgeObj.getData() != "hero") {
document.write("the data must be hero");
}

จากโค้ดเราจะเริ่มต้นด้วยการสร้างอ๊อปเจ็กของ JsgeObject โดยให้ตำแหน่ง X และ Y อยู่ที่ 10 และ 20 ตามลำดับ และก็กำหนดให้ data เป็นคำว่า hero โดยการเรียก jsgeObj.setData("hero") หลังจากนั้นเราก็ตรวจสอบว่าตำแหน่ง X Y และ data ที่เรากำหนดไว้นั้นถูกต้องหรือไม่ โดยการใช้ if-statement ทดสอบค่าที่ได้จาก getX() getY() และ getData() ตามลำดับ ถ้าค่าที่ได้ไม่ตรงกับที่เรากำหนดไว้ก่อนหน้านี้ เราก็จะพิมพ์ข้อผิดพลาดออกทางหน้าจอโดยเรียก document.write(...)

การเขียนโค้ดทดสอบจะทำให้เราแน่ใจได้ว่าโปรแกรมทำงานได้อย่างถูกต้องและช่วยลดเวลาที่เราต้องทดสอบโค้ดอีกครั้งหนึ่ง ถ้าเราทำการแก้ไขปรับปรุงโค้ดในอนาคต เพียงแค่รันโค้ดที่ใช้ในการทดสอบอีกครั้งว่าผ่านการทดสอบหรือไม่

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

วันอังคารที่ 27 กรกฎาคม พ.ศ. 2553

พัฒนาเกมส์เอ็นจิ้นด้วย HTML5 + JavaScript ตอนที่ 2 คลาส JsgeObject

จากบทความแรกเราได้พูดถึงเครื่องมือและชื่อของเกมส์เอ็นจิ้นที่เราจะเขียนแล้ว ในบทความนี้เราจะมาเริ่มเขียนคลาสแรกกัน คือ คลาส JsgeObject ในภาษา JavaScript เราเขียนคลาส ได้ดังนี้

/**
Create a new JsgeObject
@class represent a object in a game. It is a base class of all classes in Jsge.
@constructor
@param {Number} x the x position of the object.
@param {Number} y the y position of the object.
*/
function JsgeObject(x, y) {
this.x = x;
this.y = y;
this.data = null;
}

การประกาศชื่อและโครงสร้างของคลาสในภาษา JavaScript เราทำได้โดยให้ชื่อฟังก์ชัน (Function) เป็นชื่อเดียวกับคลาสที่เราต้องการสร้างและเราสามารถที่จะกำหนดคุณสมบัติ (Property) ของคลาสได้ โดยเีรียกคำสั่ง this.x = x; ดังตัวอย่างข้างต้น เป็นต้น

จากตัวอย่างโค้ดข้างต้น เราจะเห็นว่าในส่วนคอมเมนต์ (Comment) มีคำอธิบายคลาสอยู่พร้อมกับแท๊ก (Tag) พิเศษ อย่างเช่น @param หรือ @returns สำหรับใช้ทำเอกสารประกอบการใช้งานจากโค้ดที่เราเขียน รายละเอียดเกี่ยวกับแต่ละแท๊กจะอธิบายไว้ในบทความถัดไป

หลังจากที่เราได้ประกาศชื่อและโครงสร้างของคลาสแล้ว ถัดมาเราก็จะมากำหนดการดำเนินการ (Method) ต่างๆของคลาสดังนี้

/**
Get the reference to the user data attached to this object.
@returns {Object} the reference to the user data
*/
JsgeObject.prototype.getData = function() {
return this.data;
};

/**
Get the x position of this object.
@returns {Number} the x position
*/
JsgeObject.prototype.getX = function() {
return this.x;
};

/**
Get the y position of this object.
@returns {Number} the y position
*/
JsgeObject.prototype.getY = function() {
return this.y;
};

/**
Set the data associate to this object.
@param {Object} the data.
*/
JsgeObject.prototype.setData = function(data) {
this.data = data;
};

/**
Move the object to new x and y positions.
@param {Number} x the x position of the object.
@param {Number} y the y position of the object.
*/
JsgeObject.prototype.move = function(x, y) {
this.x = x;
this.y = y;
};

การกำหนด Method ของคลาส เราจะใช้ <ชื่อคลาส>.prototype.<ชื่อ Method> = function() {...} ใน Method เราสามารถอ้างถึง Property ของคลาสได้โดยเรียกคำสั่ง this.<ชื่อ Properties> จากโค้ดตัวอย่ีางข้างต้นเราจะเห็นว่า Method getX() คืนค่าจาก this.x

เราจะเห็นว่าแต่ละ Method มีคอมเมนต์อธิบายการทำงานและพารามิเตอร์ (Parameter) ที่ต้องส่งผ่าน Method ว่ามีอะไรบ้าง Method ของคลาส JsgeObject ทำงานไม่ซับซ้อนแค่คืนค่า Property และกำหนดตำแหน่ง x และ y เท่านั้น

หลังจากที่เราได้โค้ดของคลาส JsgeObject แล้ว เราก็จะมาทดสอบการทำงานโค้ดที่เราเขียนกัน เราเรียกการทดสอบย่อยๆนี้ว่า Unit Test วิธีที่ง่ายที่สุดในการทดสอบก็คือ เขียนโปรแกรมขึ้นมาใหม่อีกตัวเพื่อทดสอบโค้ดของเรา ซึ่งโปรแกรมนี้จะทดสอบแต่ละกรณีการใช้งานที่เป็นไปได้ของโค้ด การทดสอบแต่ละกรณีเราเรียกว่า Test Case เพื่อง่ายต่อการทดสอบ เราจะเริ่มด้วย Test Case เดียวก่อน โดยจะทดสอบ Method ทั้งหมดของคลาส JsgeObject

การทดสอบเราอาจจะเขียนโค้ดโดยใช้ if-statement ตรวจสอบค่าที่ได้หลังจากเรียกแต่ละ Method หรือ ที่นิยมปฎิบัติกันก็คือ ใช้ Library สำหรับทำ Unit Test

ในบทความนี้เราก็ได้เรียนรู้วิธีเขียนคลาสใน JavaScript แล้ว ในบทความถัดไปเราจะมาต่อในเรื่องการทดสอบคลาสที่เราเขียนกัน

วันจันทร์ที่ 26 กรกฎาคม พ.ศ. 2553

มาฝึกหัดเขียนโปรแกรมกัน พัฒนาเกมส์เอ็นจิ้นด้วย HTML5 + JavaScript

การฝึกเขียนโปรแกรมนั้น นอกจากจะช่วยเพิ่มทักษะการเขียนโปรแกรมให้กับเราแล้ว ก็อาจจะช่วยให้เราได้ไลบรารี่ (Library) ใหม่ๆ มาเก็บไว้ใช้งานอีกด้วย ถ้าเราคิดโปรเจ็คที่ใช้ในการฝึกเขียนโปรแกรมที่สามารถนำไปประยุกต์กับงานของเราได้

เมื่อไม่กี่อาทิตย์ที่ผ่านมาได้มีโอกาสไปเยี่ยมชมเว็บ www.html5rocks.com มา ก็ทำให้เกิดแรงบันดาลใจว่าเราน่าจะฝึกเขียนโปรแกรมโดยใช้ Feature ใหม่ๆของ HTML5 + JavaScript ดู และน่าจะเป็นโปรแกรมที่เรานำมาใช้ประโยชน์ต่อไปในอนาคตได้ นึกไปนึกมาอยู่หลายวัน ก็เลยคิดออกว่าจะทำอะไรดี มาจบลงที่ เกมส์เอ็นจิ้นเอพีไอ (Game Engine API)

Game Engine API (Application Programming Interface) เป็นโปรแกรมที่รวบรวมชุดคำสั่ง การทำงานที่ใช้ในการพัฒนาเกมส์เข้าไว้ด้วยกัน โดยที่เราสามารถนำไปใช้พัฒนาเกมส์ง่ายๆได้ ตัว API อาจจะประกอบไปด้วยชุดคำสั่งที่เกี่ยวข้องกับการเคลื่อนที่ของตัวละครในเกมส์ การสร้างฉากของเกมส์ หรือ การสั่งให้ตัวละครในเกมส์มีการโต้ตอบกัน เป็นต้น

ที่ผมเลือกทำ Game Engine API ก็เพราะว่า การฝึกเขียนโปรแกรมที่เกี่ยวกับเกมส์นั้นใช้เทคนิคการเขียนโปรแกรมที่ค่อนข้างหลากหลาย ตั้งแต่การคำนวนทางคณิตศาสตร์ การแสดงผลทางกราฟฟิก (Graphic) หรือ การทำงานที่เกี่ยวกับอีเวนท์ (Event) ต่างๆ ในเว็บบราวเซอร์ (Web Browser) เป็นต้น คิดว่าน่าจะช่วยในการฝึกเขียนโปรแกรมได้ดี นอกจากนี้ เราไม่จำเป็นต้องลงโปรแกรมอะไรมากมีแค่ notepad และ เว็บบราวเซอร์ ที่ใช้งาน HTML5 ได้ อย่างเช่น Google Chrome เป็นต้น ก็สามารถที่จะเขียนโปรแกรมได้แล้ว

ผมให้ชื่อโปรเจ็คนี้ว่า Jsge ซึ่งย่อมาจาก JavaScript Game Engine ก่อนที่จะเริ่มเขียนโปรแกรม เรามาดูกันก่อนว่าต้องมีเครื่องมืออะไรบ้างที่ใช้ทำงาน ดังนี้
  • เว็บบราวเซอร์ที่ใช้งาน HTML5 ได้
  • Text Editor อย่างเช่น notepad ใช้สำหรับเขียนโค้ด
นอกจากเว็บบราวเซอร์และ Text Editor ผมจะใช้โปรแกรมต่อไปนี้ด้วย ซึ่งเป็นส่วนประกอบในการพัฒนาโปแกรมเท่านั้น จะไม่มีก็ได้ แต่ผมจะอธิบายไว้ในขั้นตอนการเขียนโปรแกรมด้วย เผื่อมีคนสนใจนำไปใช้งานต่อไป
  • QUnit เป็น JavaScript library สำหรับใช้ทำ Unit Test สามารถดาว์โหลดได้ที่นี่ http://github.com/jquery/qunit (คลิกที่ปุ่ม Download Source)
  • JsDoc Toolkit เป็น JavaScript library สำหรับใช้ทำเอกสารอธิบายการใช้งาน Jsge สามารถดาว์โหลดได้ที่นี่ http://code.google.com/p/jsdoc-toolkit/downloads/list เลือกลิงค์ที่เป็น jsdoc-toolkit-2.4.0.zip
  • Git เป็น Version Control System ที่ใช้จัดเก็บซอส์โค้ดของ Jsge สามารถดาว์โหลดได้ที่นี่ http://code.google.com/p/msysgit/downloads/list เลือกลิงค์ที่เป็น PortalGit1.7.1
โปรแกรมข้างต้นเราสามารถที่จะก๊อปปี้ไฟล์หรือแตก zip ไฟล์มาใช้งานได้เลย วิธีการใช้งานแต่ละโปรแกรมจะอธิบายในหัวข้อต่อๆไป เมื่อมีการใช้งาน

ก่อนที่เราจะเริ่มเขียน API เรามาวางโครงสร้างของโปรแกรมคราวๆก่อนว่าน่าจะมีอะไรบ้าง เราจะเริ่มจากความต้องการ (Requirement) ง่ายๆก่อน ค่อยๆเพิ่มไปเรื่อยๆจนได้การทำงานทั้งหมดที่เราต้องการ เราจะใช้วิธีการพัฒนาซอฟต์แวร์ที่เรียกว่า Short Iterations ก็คือ ใช้ระยะเวลาสั้นๆประมาณ 1 - 2 อาทิตย์ในการพัฒนาแต่ละส่วนแล้วเผยแพร่โปรแกรมที่เราเขียนออกไปให้ผู้อื่นใช้งาน เพื่อรับข้อเสนอแนะเพื่อนำกลับมาปรับปรุงแก้ไขโปรแกรมของเราต่อไป

ดังนั้นเราจะมาเริ่มจากส่วนที่ง่ายที่สุดก่อนก็คือ เราจะทำ API สำหรับสร้างวัตถุที่อยู่ในเกมส์ขึ้นมา เราขอเรียกมัน JsgeObject เป็นคลาสที่ใช้แทนวัตถุที่อยู่ในเกมส์ ซึ่งมีคุณสมบัติ (Property) และ การดำเนินการ (Method) ดังนี้

Properties
  • x เป็น ตำแหน่งตามแนวนอนของวัตถุ
  • y เป็น ตำแหน่งตามแนวตั้งของวัตถุ
  • data ใช้เก็บข้อมูลเกี่ยวข้องของวัตถุ เช่น ถ้าวัตถุเป็นบ้าน data อาจจะใช้เก็บชื่อเจ้าของบ้านหรือราคาบ้าน เป็นต้น
Methods
  • getX() ใช้ดึงค่า x ของวัตถุ
  • getY() ใช้ดึงค่า y ของวัตถุ
  • getData() ใช้ดึงค่า data ของวัตถุ
เมื่อเราได้องค์ประกอบคราวๆของคลาสแล้ว เราก็จะมาเริ่มเขียนโค้ดกัน ซึ่งเราจะมาต่อตรงนี้กันในบทความหน้านะครับ :D

วันเสาร์ที่ 24 กรกฎาคม พ.ศ. 2553

เขียนขั้นตอนการทำงานของโปรแกรมใน Comment ก่อนเขียนโค้ด ช่วยให้เขียนโค้ดง่ายขึ้น

เวลาที่เราเขียนโค้ดของโปรแกรมบ่อยครั้งที่เรามักจะคิดการทำงานและตรรกะของโปรแกรมในขณะที่เขียนโค้ดเลย ถ้าเราเขียนโค้ดสั้นๆไม่ซับซ้อนมาก อย่างเช่น คำนวนเปอร์เซ็นของจำนวนสินค้าหรือตรวจสอบว่าสองตัวแปรมีค่าเหมือนกันหรือไม่ วิธีการเขียนโค้ดแบบนี้อาจจะทำได้ไม่ลำบากนัก แต่ถ้าโค้ดที่เราเขียนมีความซับซ้อนและขั้นตอนในการทำงานมาก วิธีการแบบนี้อาจจะค่อยจะไม่มีประสิทธิภาพเท่าไร

จากประสบการณ์ของผมโค้ดที่ออกมาใช้งานได้ แต่บ่อยครั้งที่อ่านยากและลำดับของการทำงานและตรรกะออกมาไม่เป็นระเบียบนัก ทำให้เวลาที่กลับมาอ่านโค้ดเพื่อทำการแก้ไขใช้เวลาพอสมควร บ่อยครั้งเข้าผมก็คิดว่ามีวิธีไหนบางที่จะช่วยให้การเขียนโปรแกรมทำได้ดีขึ้น อาจจะไม่ต้องถึงขนาดดีเลิส ก็ขอให้ใช้เวลาในการอ่านน้อยลงก็ยังดี

หลังจากจบและทำงานได้อยู่ประมาณหลายเดือน ก็มีอยู่วันหนึ่งต้องทำโปรแกรมตามเอกสารที่ลูกค้าเขียนมาให้ว่ามีเงื่อนไขอะไรบ้างในเวลาที่จัดเก็บข้อมูล เนื่องจากว่าไม่ต้องการย้อนกลับไปมาระหว่างเอกสารและหน้าจอเขียนโค้ด ผมก็เลยก๊อปปี้เงื่อนไขที่ลูกค้าเขียนไว้ในเอกสารมาวางเป็น Comment ในโปรแกรม แล้วก็เริ่มเขียนโปรแกรมตาม Comment นั้น

ผมเขียนโค้ดแทรกไประหว่างบรรทัดของ Comment จนกระทั้งจบส่วนการทำงานของโปรแกรม ก็พบว่าผมเขียนโปรแกรมได้เร็วขึ้นและรู้สึกว่าโ้ค้ดที่เขียนอ่านง่านขึ้น พอได้แนวทางที่ว่านี้ผมเลยใช้วิธีเดียวกันกับส่วนอื่นของโปรแกรมทั้งหมด และงานอื่นๆถัดมา

ทำไมเขียน Comment ก่อนเขียนโค้ดถึงช่วยให้เราเขียนโค้ดดีขึ้น ก็เพราะว่าเราได้มีการจัดลำดับความคิดก่อนที่จะลงมือเขียนโค้ด มากกว่านั้นการคิดออกมาเป็นภาษาที่เราใช้สื่อสารกันระหว่างบุคคล ก็จะทำให้โค้ดที่ออกมาอ่านง่ายขึ้น เราเขียนโค้ดโดยอิงจาก Comment ที่เราเขียนอธิบายการทำงานไว้ วิธีการเขียนโค้ดแบบนี้ใช้ได้ดีมากๆ ลองนำไปใช้กันดูนะครับ น่าจะช่วยให้ทำงานได้เร็วและโค้ดอ่านง่ายขึ้น

วันอาทิตย์ที่ 18 กรกฎาคม พ.ศ. 2553

Keyboard Shortcuts สิ่งสำคัญที่เรามักจะลืม

Vi เป็น Text Editor ตัวแรกที่ผมใช้เขียนโปรแกรม เหตุผลที่ผมใช้ Vi ก็เพราะว่าตอนที่เรียนอยู่ในมหาวิทยาลัยปีแรกๆ อาจารย์อนุญาติให้เขียนโปรแกรมบนระบบปฎิบัติการ Linux เท่านั้น ซึ่ง Linux ที่ใช้ตอนนั้นก็เป็นเวอร์ชั่นที่มหาวิทยาลัยทำขึ้นเอง เป็นแบบ Console Mode

การใช้ Vi ผ่าน Console Mode จะต้องใช้คีย์บอร์ดในการสั่งงานทั้งหมด ไม่ว่าจะเป็นการเพิ่ม ลบ ตัวอักษร การค้นหา หรือ ไปยังบรรทัดที่ต้องการ ตอนเริ่มใช้งานใหม่ๆ อาจจะยากเพราะว่าจะต้องจำปุ่มที่ใช้สั่งงานในคีย์บอร์ด แต่เมื่อใช้งานไปสักระยะหนึ่งผมก็พบว่ามันสะดวกมาก ไม่ต้องยกมือจากคีย์บอร์ดก็สามารถที่จะเขียนโปรแกรมได้อย่างรวดเร็ว

หลังจากที่ย้ายมาเขียนโปรแกรมบน MS Windows มากขึ้น ก็ทำให้ติดการใช้เมาส์มากกว่าการสั่งงานทางคีย์บอร์ดไปโดยปริยาย แต่อันที่จริงแล้วถ้าเราลองใช้ ปุ่มลัด (Keyboard shortcuts) ในการสั่งงานดูก็จะพบว่ามันสะดวกและทำงานได้รวดเร็วกว่าการใช้เมาส์ ทำไมถึงเป็นเช่นนั้นละ ลองมาดูเหตุผลกัน

การใช้เมาส์เลื่อนไปยังเมนูต่างๆ นั้นกินเวลาระดับหนึ่งเมื่อเทียบกับการใช้ปุ่มลัด อีกทั้งทำให้เราต้องย้ายมือไปมาระหว่างคีย์บอร์ดและเมาส์ เราอาจจะมองว่ามันเป็นเวลาเพียงเล็กน้อยมาก แต่ถ้าเราลองนับจำนวนครั้งในแต่ละวันที่เราย้ายไปมาระหว่างคีย์บอร์ดและเมาส์ ก็จะพบว่ามันใช้เวลาพอสมควรเลยละ

ดังนั้นถ้าเราใช้งานคำสั่งใดบ่อยๆ เราก็ควรจะจำปุ่มลัดไว้หรือสร้างปุ่มลัดสำหรับคำสั่งนั้น Text Editor เกือบทุกตัวในปัจจุบันมีปุ่มลัดและสามารถที่จะสร้างปุ่มลัดได้ วันนี้ผมเอาปุ่มลัดที่ใช้กันบ่อยๆใน Eclipse มาแนะนำกัน
  • Ctrl + O ใช้เปิดกล่องค้นหา Member ของคลาสที่อยู่ในไฟล์ที่เรากำลังทำงานอยู่
  • Ctrl + Shift + T ใช้เปิดกล่องค้นหา Type ที่เราสนใจ
  • Ctrl + M ใช้ย่อขยายหน้าต่างที่กำลังทำงานอยู่
  • Ctrl + Space ใช้เปิดกล่องตัวช่วยเดาชื่อตัวแปร คลาส หรือ เมดทอด ขณะที่เราพิมพ์อยู่
  • Ctrl + Shift + F ใช้จัดซอร์สโค้ดให้อยู่ในรูปแบบที่เป็นมาตราฐาน
  • Ctrl + D ใช้ลบบรรทัดปัจจุบันที่เราทำงานอยู่
  • Ctrl + Left ใช้เลื่อนเคอเซอร์ไปทางด้านซ้ายที่ละหนึ่งคำ
  • Ctrl + Right ใช้เลื่อนเคอเซอร์ไปทางด้านขวาที่ละหนึ่งคำ