หันมาหัด Vim (plugin) กันเถอะ [Basic]

เราเข้าใจความรู้สึกนั้นเป็นอย่างดี แต่เราอยากบอกคุณว่าคุณ

การใช้งานจริงๆ มีอยู่ไม่กี่ key ครับ และถ้าคุณเข้าใจมันจะสนุกมาก

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

และเนื่องจากเราจะโฟกัสกันแค่ “ vim plugin ” ที่มีอยู่ใน text editor และ ide ต่างๆ เราจึงไม่ได้ลงถึงความสามารถของ vim ทั้งหมด มันจะดูโหดร้ายและทารุณเกินไป

อะไรที่ดูโหดๆ vim plugin ที่อยู่บน IDE อื่นๆ เลยทำไม่ได้ถ้าเอา Original Vim มาเทียบ มันเลยดีสำหรับเราเพราะมีแค่ตัวหลักๆให้ใช้เท่านั้น

เช่น การพิมพ์ viw มันจะสอดคล้องกับคำว่า Visual Inside Word มันคือ ลากคลุมคำนั้นเอง

เป็นแค่น้ำจิ้มครับ มาเริ่มรู้จักโลกของ vim กันดีกว่า

Concept หนึ่ง: ไม่ต้องแตะเมาส์

การใช้งาน vim ที่เราชอบคือเราแทบไม่ต้องแตะเมาส์เพื่อคลิ๊กนู้นนี่เพื่อเลื่อน cursor และคุมหน้าจอเลยครับ vim ออกแบบมาเพื่อให้ใช้ทุกอย่าง keyboard แทน โลกสวยด้วยมือเราจริงๆ

เช่น เปลี่ยน tab, split window, ปิด/เปิด file , save file , …

Concept สอง: “เร็ว”

ครั้งแรกที่ลองจับ vim ก็เล่นมันมาตลอดเลยเพราะมันเร็วนี่แหละ

Concept สาม: Freestyle

ถ้าใครไม่พอใจ key ที่ทาง Vim เตรียมมาให้เราสามารถเซ็ตเองให้เป็นแบบฉบับของเราได้ powerful เอามากๆ เรื่องวิธีการ config เดี๋ยวไว้พูดบล็อกหน้าเนาะเพราะมีประเด็น :)

ซึ่งการจะทำอย่างนั้นได้ โลกของ Vim จึงมี 3 mode

1. Normal mode คือ โหมดเคลื่อนย้าย cursor บนหน้าจอ และพิมพ์คำสั่งต่างๆ เช่น w เอาcursor กระโดดข้ามคำได้อย่างง่ายดาย

2. Insert Mode คือ โหมดพิมพ์ข้อความลงบนไฟล์ และยังพิมพ์คำสั่งต่างๆได้อีกด้วย เช่น

<Ctrl-R> + ” 

เพื่อเอาข้อความที่เคย copy ไว้มาวางไว้นั้นเองเหมือน เรากด ctrl+v นั่นแหละครับ

กด i เพื่อเปลี่ยนเป็น Insert Mode

3. Visual Mode คือ โหมดไว้ลากคลุมข้อความเป็น block ลากคลุมมบรรทัด ลากคลุมข้อความก้ได้แล้วแค่ความต้องการ และยังพิมพ์คำสั่งได้ด้วย เช่น <ลากคุม> + y เพื่อ copy ข้อความ

กด v เพื่อเปลี่ยนเป็น Visual Mode

• w เลื่อน cursor ไปตาม “คำ” (jump by start of Words)
• W เลื่อน cursor ไปตาม “คำ” โดยดูจาก white space (jump by Words)
• b เลื่อน cursor ไปตาม “ท้ายคำ” (jump Backward by words )
• B เลื่อน cursor ไปตาม “ท้ายคำ” โดยดูจาก white (space jump Backward by words)
• 0 เลื่อน cursor ไปต้นบรรทัด (zero start of line)
• ^ เลื่อน cursor ไป “ต้นคำ” ของบรรทัด (first character of line)
• $ เลื่อน cursor ไปท้ายบรรทัด (end of line)
• % เลื่อนcursor เพื่อหาขอบเขตของ block [ ] { }
• : + [number] เพื่อเลื่อน cursor ไปบรรทัดที่เราต้องการ หรือ พิมพ์ [number]g ได้ผลที่เหมือนกันแล้วแต่ชอบครับอันนี้ (go To command) เช่น 5g เลื่อน cursor ไปบรรทัดที่ 5 มันจะมีประโยชน์ตอนคนอื่นบอกให้ดู code บรรทัดที่x ก็กดไปได้เลยสะดวกมาก
• gg เลื่อน cursor ไปบรรทัดแรกสุดของไฟล์
• G เลื่อน cursor ไปบรรทัดท้ายสุดของไฟล์

มันดูเยอะๆนะ แต่บาง key มันมี trick ในการใช้ครับ อย่างเช่น w W e E b B มันดูจำยากเราจะมี key ตัวนึงใช้แทนได้คือ f กับ F เดี๋ยวมีบอกต่อๆไปแต่ตอนนี้เอา basic ก่อนเนาะ

สรุป key ที่ใช้ตามนี้

[Movement]
1. wW 
2. bB 
3. 0 ^ 
4. &
5. % 
6. :[number] 
7. gg G

2. Insert/Append text

• i เปลี่ยนเป็น insert mode ที่ “หน้า” char ที่เราเอา cursor วาง ( start insert mode at cursor)
• I เลื่อน cursor ไป “ต้นคำ” ของบรรทัดแล้วเปลี่ยนเป็น insert mode (Insert at the beginning of line) [ใช้บ่อย]
• a เปลี่ยนเป็น insert mode ที่ “หลัง” char ที่เราเอา cursor วาง (append after the cursor)
• A เลื่อน cursor ไปท้ายบรรทัดแล้วเปลี่ยนเป็น insert mode (Append at the end of line) [ใช้บ่อย]
• o ชึ้นบรรทัดใหม่แล้วเปลี่ยนเป็น insert mode (open (append) blank line below current line)
• O ชึ้นบรรทัดใหม่บน cursor แล้วเปลี่ยนเป็น insert mode (Open blank line above current line) [ใช้บ่อย]
• Esc ออกจาก insert mode

จะสังเกตเห็นว่าอย่างเช่น I กับ ^ คล้ายๆกันเราจึงเลือกที่จะใช้ I + <esc> แทนการใช้ ^ ก็ได้จะได้ไม่ต้องจำเยอะ ซึ่งมีหลายกรณีใน Vim ที่สามารถใช้ key แทนกันได้เพื่อลดการจำครับ อันนี้ก็แล้วแต่คนนะ :)

สรุป key ที่ใช้ตามนี้

[Movement] 
1. wW 
2. bB 
x. 0 ^ ใช้ I + <esc> แทน
3. &
4. % 
5. :[number] 
6. gg G

[Insert/Append text]
7. i I
8. a A
9. o O

3. Marking text (visual mode)

• v เริ่ม visual mode
• V เริ่ม visual mode พร้อมคลุมทั้งบรรทัด
• Ctrl+v เริ่ม visual mode พร้อมคลุมเป็น block [ใช้บ่อย]
• Esc exit visual mode
• v[ลากคลุม]y — yank (copy) สิ่งที่ลากคลุม
• v[ลากคลุม]d — delete สิ่งที่ลากคลุม
• v[ลากคลุม]c — change สิ่งที่ลากคลุม

สรุป key ที่ใช้ตามนี้

[Movement] 
 1. wW 
 2. bB 
 x. 0 ^ ใช้ I + <esc> แทน
 3. &
 4. % 
 5. :[number] 
 6. gg G

[Insert/Append text]
 7. i I
 8. a A
 9. o O

[Visual mode]
10. vV <ctrl+v>
11. v[ลากคลุม] + y/d/c

4. Editing

• r<ตัวอักษร> ทับ 1 ตัวอักษรที่เราต้องการ (replace)
• J เอาข้อความทั้งหมดของบรรทัดล่างขึ้นมาต่อ (join line) [ใช้บ่อย]
• cc เปลี่ยข้อความทั้งบรรทัด (change (replace) an entire line)
• s = substitute 1 ตัวอักษร
• S เหมือน cc
• <ctrl-r> — redo [ใช้บ่อย]
• u — undo [ใช้บ่อย]
• ~ เปลี่ยนตัวอักษรจาก upper เป็น lower หรือ lower เป็น upper case [ใช้บ่อย]

สรุป key ที่ใช้ตามนี้

[Movement] 
 1. wW 
 2. bB 
 x. 0 ^ ใช้ I + <esc> แทน
 3. &
 4. % 
 5. :[number] 
 6. gg G

[Insert/Append text]
 7. i I
 8. a A
 9. o O

[Visual mode]
10. vV <ctrl+v>
11. v[ลากคลุม] + y/d/c

[Editing]
12. r<ตัวอักษร>
13. J
14. cc หรือ S
15. <ctrl-r> กับ u
16. ~

5. Cut and Paste

• yy — yank (copy) บรรทัด [ใช้บ่อย]
• y$ — yank ถึงตัวอักษรตัดสุดท้าย
• p — put (paste) สิ่งที่เรา yank “หลัง” cursor [ใช้บ่อย]
• P = Put (paste) สิ่งที่เรา yank “ก่อน” cursor [ใช้บ่อย]
• <Ctrl-r>+” put สิ่งที่เรา yank ใน insert mode
• dd — delete (cut) ทั้งบรรทัด [ใช้บ่อย]
• x — delete (cut) หนึ่งตัวอักษร [ใช้บ่อย]

สรุป key ที่ใช้ตามนี้

[Movement] 
 1. wW 
 2. bB 
 x. 0 ^ ใช้ I + <esc> แทน
 3. &
 4. % 
 5. :[number] 
 6. gg G

[Insert/Append text]
 7. i I
 8. a A
 9. o O

[Visual mode]
10. vV <ctrl+v>
11. v[ลากคลุม] + y/d/c

[Editing]
12. r<ตัวอักษร>
13. J
14. cc หรือ S
15. <ctrl-r> กับ u
16. ~

[Cut and Paste]
17. yy
18. p P
19. dd  
xx. <ctr+r> + " ใช้ p P ใน normal mode แทน
20. x

6. Scroll

• Ctrl + y เลื่อนหน้าต่างขึ้น 1 บรรทัด
• Ctrl+ e เลื่อนหน้าต่างลง 1 บรรทัด
• Ctrl + u เลื่อนหน้าต่างขึ้น ครึ่งหน้า (up)
• Ctrl + d เลื่อนหน้าต่างลง ครึ่งหน้า (down)
• Ctrl + f เลื่อนหน้าต่างขึ้นทั้งหน้า (forward)
• Ctrl + b เลื่อนหน้าต่างขึ้นทั้งครึ่งหน้า (backward)

สรุป key ที่ใช้ตามนี้

[Movement] 
 1. wW 
 2. bB 
 x. 0 ^ ใช้ I + <esc> แทน
 3. &
 4. % 
 5. :[number] 
 6. gg G

[Insert/Append text]
 7. i I
 8. a A
 9. o O

[Visual mode]
10. vV <ctrl+v>
11. v[ลากคลุม] + y/d/c

[Editing]
12. r<ตัวอักษร>
13. J
14. cc หรือ S
15. <ctrl-r> กับ u
16. ~

[Cut and Paste]
17. yy
18. p P
19. dd  
xx. <ctr+r> + " ใช้ p P ใน normal mode แทน
20. x

[Scroll] 
21. <ctrl + y/e>
22. <ctrl + u/d>
23. <ctrl + f/b>

7. File

• :w — write (save) ไฟล์ [ใช้บ่อย]
• :wq — write (save) ไฟล์พร้อม quit
• :q — quit ถ้ามีการแก้ไฟล์จะไม่สามารถ quit ได้ [ใช้บ่อย]
• :q! — quit โดยไม่มีการ save ใดๆ
• /<คำที่ต้องการหา> — ค้นหาคำในไฟล์ (กด n เพื่อค้นหาซ้ำ กด N เพื่อค้นหาย้อนกลับ) [ใช้บ่อย]