รีวิว Atom โปรแกรมแก้ไขข้อความแห่งอนาคต

by neizod
12 May 2014 - 04:38

Atom เป็นโปรแกรมแก้ไขข้อความสุดล้ำจาก GitHub หลังจากเปิดซอร์ซ และได้นักพัฒนาจาก webupd8team สร้างไฟล์ไบนารีบน Ubuntu ไว้ให้ ผมก็ได้ฤกษ์ทดลองใช้งานและจะขอเขียนรีวิวสั้นๆ เกี่ยวกับว่าที่ผู้ท้าชิงตำแหน่งสุดยอดโปรแกรมแก้ไขข้อความจากแชมป์เก่าอย่าง vi และ Emacs ตัวนี้ครับ

หน้าตาโปรแกรมในเสี้ยววินาทีแรกที่เห็น หลายคนคงนึกไปถึง Sublime Text อย่างแน่นอน ซึ่งก็อาจนับได้ว่าเป็นแรงบันดาลใจอย่างแรงกล้าเลยทีเดียว เพราะเมื่อลองกดปุ่ม ctrl+shift+p ก็จะมีเมนูอัจฉริยะแบบพิมพ์ค้นหา (ตัวโปรแกรมเรียกความสามารถนี้ว่า Command Palette) โผล่ขึ้นมาเช่นเดียวกันอย่างกับแกะเลยครับ (ฮาาา)

ภาพ 1 หน้าตาโปรแกรมพร้อมข้อความต้อนรับเมื่อเปิดครั้งแรก

อย่างไรก็ตาม ผมพบว่าด้วยความที่ Atom เติบโตมาภายใต้ร่มเงาของ GitHub ทำให้มันได้รับความสามารถเฉพาะตัวอันโดดเด่น 2 อย่างติดมาด้วย นั่นคือ

1) ความสามารถในการทำพรีวิว Markdown แบบสดๆ ซึ่ง Markdown ตัวนี้เป็นแบบที่ถูกปรับแต่งเพิ่มความสามารถโดย GitHub เองอีก (มีชื่อเรียกว่า GitHub Flavored Markdown) มันถูกเคลมว่าเหมาะสำหรับการทำเอกสารประกอบโปรแกรมอย่างยิ่งยวด ด้วยความสามารถที่เพิ่มขึ้นมาอย่างการทำตาราง และการเน้นสีโค้ดของโปรแกรม

ภาพ 2 การทำพรีวิว Markdown แบบสดๆ

2) มีการเน้นบรรทัดที่ถูกแก้ไขจากการจดจำ (commit) ใน Git ครั้งก่อนอย่างชัดเจน ที่ด้านหน้าของแต่ละบรรทัดจะมีสีเขียว (มีข้อความเพิ่มเติม) สีแดง (ลบข้อความทิ้ง) หรือสีน้ำตาล (แก้ไขข้อความบางส่วน) กำกับไว้ และบอกชื่อกิ่งก้าน (branch) กำกับไว้ที่มุมล่างขวา พร้อมทั้งสรุปว่ามีการแก้ไขไปแล้วกี่บรรทัด

ภาพ 3 บรรทัดที่ถูกแก้ไขจากการจดจำที่ถูกเน้นสีด้านหน้าบรรทัด

ถึงกระนั้น ตัว Atom เพียวๆ ก็ยังขาดความสามารถไปหลายอย่าง เช่น การแสดงแผนที่ย่อ (minimap) แบบเดียวกับ Sublime Text ซึ่งแก้ไขได้ง่ายๆ เพียงแค่ติดตั้งแพ็คเกจเพิ่มเติมลงไป โดยสามารถทำผ่านคอมมานด์ไลน์ได้ดังนี้

$ apm install minimap

เรียบร้อยก็ปิดแล้วเปิด Atom ใหม่ เพื่อให้แพ็คเกจที่เพิ่งติดตั้งถูกโหลดขึ้นมามาใช้งาน

ส่วนใครที่กลัวหน้าต่างดำๆ พร้อมการพิมพ์คำสั่งยั้วเยี้ย ก็สามารถลงแพ็คเกจได้ผ่านตัวโปรแกรมโดยเปิด Settings เข้าไปที่ Packages (หรือกด ctrl+shift+p setting package) แล้วค้นหาแพ็คเกจมาลงเพิ่มได้ตามใจชอบ วิธีนี้เมื่อลงเสร็จแล้ว แพ็คเกจจะถูกโหลดขึ้นมาใช้งานทันที ไม่จำเป็นต้องปิดโปรแกรมแล้วเริ่มใหม่ด้วยครับ

ภาพ 4 ติดตั้งแพ็คเกจผ่านตัวโปรแกรมเลยก็ได้

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

ภาพ 5 หน้าต่างแสดงรายละเอียดแพ็คเกจ Vim Mode

ด้านธีมนั้นมี 2 แบบหลักๆ คือ UI (สีสันหน้าต่างโดยรวม) กับ syntax (สีโค้ดโปรแกรม) ซึ่งถ้าหากว่าธีมที่มีให้ยังน้อยไป ก็สามารถลงธีมเพิ่มเติมได้ (เป็นแพ็คเกจอีกเช่นกัน)

ภาพ 6 หน้าต่างเลือกธีมและติดตั้งเพิ่มเติม

หรือถ้าหากสีสันที่มีให้เลือกยังไม่ถูกใจอีก ก็สามารถแก้ไขสีธีมได้เอง โดยอาจเริ่มจากหาจากธีมที่ต้องการแก้ผ่านช่อง Filter packages ด้านซ้ายมือ แล้วเลือก Open in Atom หลังจากนั้นก็ลงมือแก้ไขไฟล์ LESS (เป็น CSS แบบพัฒนาความสามารถให้ตั้งตัวแปร/สร้างคลาสได้) ตัวอย่างนี้ผมอาศัยความช่วยเหลือจากแพ็คเกจ Color Picker ในการเลือกสีอีกทีหนึ่ง

ภาพ 7 แก้ไขสีธีมผ่าน Color Picker

Merge Conflicts เป็นอีกแพ็คเกจอีกหนึ่งที่น่าสนใจ มันทำหน้าที่เพียงแค่เน้นส่วนที่ Git ควบรวมกิ่งก้าน (merge branch) แล้วเกิดข้อขัดแย้ง (conflict) ให้เด่นขึ้นมาเพื่อการเปรียบเทียบที่ง่ายขึ้น พร้อมทั้งตัวเลือกว่าจะแก้ไขข้อขัดแย้งนี้ไปในทางไหน และเตือนว่ายังเหลือข้อขัดแย้งใดที่ยังไม่ได้แก้ไขอีกบ้างในไฟล์อื่น

ภาพ 8 ดูข้อขัดแย้งจากการควบรวมกิ่งก้านด้วย Merge Conflicts

ทั้งนี้ หากแพ็คเกจที่มีให้เลือกยังไม่เจ๋งพอ ธีมที่มีอยู่ก็สีงั้นๆ อยากจะพัฒนาของใหม่มาใช้เองแต่ต้น ก็สร้างแพ็คเกจ/ธีมเปล่าๆ ได้ผ่านคำสั่ง

$ apm init --package my-command
$ apm init --theme my-style

ภาษาที่ใช้สำหรับพัฒนาแพ็คเกจคือ CoffeeScript ครับ

สุดท้ายนี้อย่าลืมว่า Atom เป็นโปรแกรมที่รันบน Node.js แล้วแสดงผลผ่าน Chrome อีกที ดังนั้นหากเกิดข้อผิดพลาดขึ้น ก็อย่าได้ตกใจไปถ้าจะมีหน้าต่าง Inspect Element ที่แสนจะคุ้นเคยโผล่มาเช่นนี้

ภาพ 9 หน้าต่าง Inspect Element ภายในโปรแกรม Atom

เนื่องจากโปรแกรมยังไม่เสร็จดี (และจากสไตล์โปรแกรมยุคนี้ที่ชอบพัฒนาต่อเติมกันไปเรื่อยๆ ไม่มีวันเสร็จ) เจอแบบนี้แล้วก็อย่าลืมกดไปที่แท็บ Console แล้วจดข้อความแจ้งข้อผิดพลาดไปบอกนักพัฒนาที่หน้าแจ้งบั๊กของโครงการด้วยนะครับ

ปล. ใน build ที่ผมรีวิวนี้ ภาษาไทยบน Atom ยังใช้งานไม่ได้ครับ

Blognone Jobs Premium