จัด style ของ code เราให้ดูสวยงาม กับ SublimeAStyleFormatter

สำหรับใครที่กำลังมองหาเครื่องมือจัด style ของ code เราให้ดูสวยงาม หรือ บางคนอาจจะเรียกว่า code formatter, code beautify

ก็ขอแนะนำตัวนี้เลย เป็น package control ที่อยู่ใน Sublime Text ที่ชื่อว่า SublimeAStyleFormatter สนับสนุน ภาษาและ platform ต่างๆ เช่น C, C++, Cuda-C++, OpenCL, Arduino, C#, and Java โดยมันสามารถ จัดเรียง source code ของเราให้สวยงามตาม style ต่างๆ ซึ่งเราสามารถเข้าไปปรับแต่ง setting ตาม style ที่เราต้องการได้ที่ไฟล์ Setting User

ว่าแล้วมาดูตัวอย่างการใช้งานกันดีกว่า

สมมติเรามี code เขียนมาแบบนี้ แบบไม่ได้จัดเรียงตำแน่งอะไรให้อ่านได้ง่ายเลย อ่านยากสุดๆ

void test(void)
{
    for (int i =0; i < 10;++i)
    {
             buf= call(buf);
buf=buf/4;
if(buf > 200)
{
    buf++;}
else{

    buf--;
}
    }

return buff;
}

เราก็ใช้ SublimeAStyleFormatter โดยกด Ctrl + Alt + F โปรแกรมจะจัดหน้าตาของ code เราให้เป็นแบบนี้ เป็นไงบ้างดีขึ้นเยอะ ไม่ต้องเสียเวลามานั่งจัด code เองเลย

void test(void)
{
    for (int i = 0; i < 10; ++i)
    {
        buf = call(buf);
        buf = buf / 4;
        if (buf > 200)
        {
            buf++;
        }
        else
        {

            buf--;
        }
    }

    return buff;
}

จากตัวอย่างนี้ใช้ค่า setting ตามนี้ ซึ่งเราสามารถเขาไป setting ได้ที่ Setting User ของ SublimeAStyleFormatter

สามารถดูตัวอย่างค่า Setting ได้จาก SublimeAStyleFormatter.sumlime-settings ไฟล์ได้เลย

วิธี Setting Cppcheck ให้ใช้งานกับ Sublime Text หรือ Notepad++

เวลาเราใช้ Cppcheck เพื่อตรวจสอบ Source code ของเรา หากเราเจอ error หรือ warning แล้วต้องการแก้ไขผ่าน Text Editor ที่เราใช้งานอยู่เป็นประจำเช่น Sublime Text หรือ Notepad++

เราสามารถ Setting Cppcheck ได้ตามนี้เลย ก่อนอื่นให้ไปที่ Edit>Preferences
cppcheck-line-1

มาที่ Tab Applications ให้เราทำการ Add โปรแกรมที่เราอยากจะใช้เป็น Text Editor เข้าไป จากตัวอย่างจะ Add Notepad++ และ Sublime Text 3
cppcheck-line-2

โดยค่า Setting ของ Sublime Text ก็จะต้องใส่ Name, Executable path แล้วก็ Parameters โดยให้ใส่ Parameters ว่า (file):(line):0 ซึ่ง file นี้หมายถึงชื่อไฟล์ เช่น test.c และ line ก็คือเลขบรรทัด ส่วน 0 ก็คือ คอลัมน์ที่ 0 คอลัมน์แรกนั้นเอง
cppcheck-line-3

ส่วน Notepad++ ก็ใส่ Parameters ว่า –n(line) (file)
cppcheck-line-4

ลองทดลองใช้โดย Setting ให้ Sublime Text เป็นตัว Default กดเช็ค Code ดูมี Warning ดังภาพ แล้วดับเบิลคลิกดูหน่อย
cppcheck-line-0

โปรแกรมก็จะเปิด Sublime Text ขึ้นมาแล้ววิ่งไปที่บรรทัดที่มีปัญหาได้อย่างถูกต้องแล้ว
cppcheck-line-5

วิธีเปิดดูการแสดงผลของ ไฟล์ Markdown โดย Sublime Text

สำหรับใครที่กำลังหาวิธีเปิดดูการแสดงผลของ ไฟล์ Markdown หรือ ว่าอยากดูว่าหลังจากเขียน Markdown แล้วผลลัพธ์จะออกมาเป็นหน้าตายังไง บางทีดาวโหลดไฟล์ .md มาแล้วก็อยากจะเปิดดู สามารถใช้ Package control ของ Sublime text ที่ชื่อว่า Markdown preview ซึ่งสามารถติดตั้งและใช้งานตามวิธีการต่อไปนี้
ให้เราติดตั้ง Package control ของ Sublime text ก่อนนะ ใครยังไม่ได้ติดตั้งก็สามารถทำตามได้จากบทความนี้ >> วิธีลง Package control ของ Sublime text

เปิด Package control โดยไปที่ Preferences>Pakage Control หรือใช้ key ลัด Ctrl + P
markdownpreview1

เลือก install Package
markdownpreview2

ติดตั้ง package ที่ชื่อว่า Markdown Preview
markdownpreview3

ติดตั้งเรียบร้อย
markdownpreview4

ทดลองใช้งานโดยเปิดไฟล์ markdown ขึ้นมา แล้วเปิด Command Palette โดยกด Ctrl+Shift+P แล้วพิมพ์ markdown เลือก Markdown Preview : Preview in Browser
markdownpreview5

เลือก markdown
markdownpreview6

เราก็จะเห็น ไฟล์ Markdown ไปแสดงผลที่ browser ของเรา
markdownpreview7

จะเห็นได้ว่าเราสามารถแปลงไฟล์ .md markdown เป็นไฟล์ .html ได้ด้วย โดยเลือก Markdown Preview : Preview in Browser : Save to HTML
markdownpreview5

วิธีค้นหาจากทั้งโปรเจค โดยใช้ Sublime

สำหรับใครที่ใช้ Sublime Text สำหรับเขียนโปรแกรมนั้นสามารถค้นหา (Search) จากทั้งโปรเจคซึ่งอาจจะมีไฟล์อยู่หลายไฟล์รวมไปไปถึงมีหลายโฟรเดอร์ในโปรเจคของเราได้อย่างง่ายดาย โดยวิธีการใช้งานมีดังนี้
ก่อนอื่นให้เราเปิด Side bar ของเราขึ้นมาจาก เมนู View > Side Bar > Show Side Bar
search-in-all-files-in-project-1

หลังจากเปิด side bar ก็จะเห็นแถบสีเทาๆขึ้นมาด้านซ้าย
search-in-all-files-in-project-2

ให้เราลากโฟรเดอร์โปรเจคของเรามาใส่ที่ side bar ของ Sublime Text ก็จะขึ้นดังรุป
search-in-all-files-in-project-3

ทีนี้เราก็สามารถกดค้นหาข้อมูลได้โดยการกด short cut key Ctrl+shift+F
search-in-all-files-in-project-4

Sublime Text ก็จะทำการค้นหาและแสดงผลขึ้นมาในแถบหน้าต่างใหม่ดังรูป
search-in-all-files-in-project-5

ถ้าหากเราอยากจะลบโปรเจคออกจาก Sublime Text ก็สามารถทำได้โดยการกดคลิกขวาแล้วเลือก Remove Folder from Project
search-in-all-files-in-project-6

วิธีติดตั้ง package control สำหรับ Sublime Text

สำหรับคนที่ใช้ sublime text ที่เป็น editor ยอดฮิต ใครที่ลงแล้วจะต้องติดตั้งเจ้า package control นี้แน่นอน

สำหรับ package control นี้เป็น package manager ของ Sublime Text ซึ่งเปรียบเสมือน plug-in หรือ add-on ของ Sublime Text ที่รวบรวม package ต่างๆไว้มากกว่า 2,500 package

วิธีติดตั้งก็สามารถติดตั้งได้ 2 วิธีคือ Online และ Offline

1.แบบ Online ต้องต่อเน็ตไว้ด้วยตอนที่ลง
ให้เราไปที่เว็บ https://packagecontrol.io/installation แล้วทำการ copy code ตามเวอร์ชั่น sublime ของเรา
package-control-online-1

แล้วไปที่ sublime ของเราเปิดไปที่ View แล้วก็เลือก Show Console
package-control-online-2

ทำการ paste วาง code ที่เรา copy มาใส่ลงไปในช่อง console แล้วก็กด Enter แล้วก็รอๆแปปนึง ก็เสร็จเรียบร้อยแล้ว
package-control-online-3

2.แบบ Offline ตอนลง ไม่ต้องต่อเน็ต
ปิด sublime ก่อน แล้วก็ให้ไปดาวโหลดไฟล์ Package Control.sublime-package ได้ที่นี้ https://packagecontrol.io/Package%20Control.sublime-package

แล้วทำการ copy ไฟล์ Package Control.sublime-package เอาไปวางไว้ที่ C:\Users\ชื่อUSER-ของคุณ\AppData\Roaming\Sublime Text 3\Installed Packages ก็เป็นอันเสร็จเรียบร้อย
package-control-manual-1

หลังจากลง package control แล้ว ทดลองเปิด sublime ดู ไปที่ Preferences เมนูจะเห็น ว่า มี ให้เลือก Package Control ก็แสดงว่า ได้ติดตั้ง Package Control เรียบร้อยแล้วจ้า
package-control-check