บทความ IT เจ๋งๆ
8 เคล็ดลับเจ๋ง ๆ การใช้ GitHub ที่ช่วยให้คุณทำงานมีประสิทธิภาพยิ่งขึ้น
02-ก.ย.-22
คัมภีร์เทพ IT
มี Developers จำนวนมาก ที่ใช้เวลาสำรวจ Projects และเรียนรู้สิ่งต่าง ๆ ที่มีประโยชน์มากมายจาก GitHub และมันก็มี Features เจ๋ง ๆ มากมายที่ช่วยให้คุณทำงานได้ดีขึ้น บทความนี้จึงมาแนะนำ 8 เคล็ดลับเจ๋ง ๆ การใช้ GitHub ที่ช่วยให้คุณทำงานมีประสิทธิภาพยิ่งขึ้น
1. ใช้ปุ่ม “t” เพื่อค้นหา Files อย่างรวดเร็ว
นี่เป็น Feature เจ๋ง ๆ ที่มีคนรู้จักไม่มากนัก เมื่อคุณต้องการดู Content ของ File คุณสามารถกดปุ่ม "T" แล้วก็ป้อนชื่อ File จากนั้นคุณก็สามารถไปยัง File ที่คุณต้องการได้โดยตรง
ขั้นตอน
- เปิด https://github.com/lodash/lodash (หรือ Project ใด ๆ ที่ต้องการบน GitHub)
- กดปุ่ม “T”
- ป้อน add.test.js (หรือชื่อ File ใด ๆ ที่คุณต้องการจะค้นหา)
- คลิกเพื่อไปดู Content ของ File
2. 3 วิธี ในการดู Code ด้วย Online “VSCode” Editor
แม้ว่าการใช้ปุ่ม "T" จะช่วยให้เราสามารถค้นหา Files ได้อย่างรวดเร็ว แต่มันก็อาจจะเป็นวิธีที่ไม่มีประสิทธิภาพนักหากคุณต้องการดู Code ทั้งหมดของ Project
และนี่ก็คือ 3 วิธี ที่ใช้ในการดู Code แบบ Online เช่นเดียวกันกับใน VSCode Editor ของคุณ หวังว่าคุณจะชอบอย่างน้อย 1 ใน 3 วิธีนี้
วิธีที่ 1: ใช้ “.” Shortcut Key
คุณสามารถกดปุ่ม "." เพื่อเพลิดเพลินไปกับการใช้งาน Online VSCode Editor
ขั้นตอน
- เปิด https://github.com/vuejs/vue (หรือ Project ใด ๆ ที่ต้องการบน GitHub)
- กดปุ่ม "."
- จากนั้นคุณจะถูก Redirect ไปที่ https://github.dev/vuejs/vue
- ใช้งานได้ทันที
วิธีที่ 2: ใช้ “github1s.com”
เมื่อคุณเห็น Project ที่ชื่นชอบบน GitHub คุณจะต้องเปลี่ยนจาก “github” เป็น “github1s” เพื่อให้ได้ผลลัพธ์เช่นเดียวกับวิธีแรก
ขั้นตอน
- เปิด https://github.com/vuejs/vue (หรือ Project ใด ๆ ที่ต้องการบน GitHub)
- แก้ไขจาก https://github.com/vuejs/vue เป็น https://github1s.com/vuejs/vue
- ใช้งานได้ทันที
วิธีที่ 3: ใช้ “gitpod.com/#xxx”
วิธีที่ 3 เป็นวิธีที่น่าทึ่งมาก คุณสามารถ Run Node.js Code ทาง Online ได้โดยตรง ซึ่งสามารถใช้งานได้ง่ายมาก เพียงคุณแค่ต้องเพิ่ม gitpod.com/# เข้าไปก่อน GitHub Link
ขั้นตอน
- เปิด https://github.com/qianlongo/fe-handwriting (หรือ Project ใด ๆ ที่ต้องการบน GitHub)
- เพิ่ม gitpod.com/# เข้าไปก่อน https://github.com/qianlongo/fe-handwriting
- ใช้งานได้ทันที
3. การ Link ไปยังบรรทัดของ Code ที่ต้องการ
บางครั้งคุณต้องการที่จะ Link ไปยังบรรทัดของ Code ที่ต้องการ ดังที่แสดงในภาพด้านล่างนี้
แล้วคุณจะทำอย่างไรเพื่อไปยังบรรทัดของ Code ที่ต้องการ?
ขั้นตอน
- เปิด https://github.com/qianlongo/fe-handwriting/blob/master/17.quick-sort.js (หรือ Project ใด ๆ ที่ต้องการบน GitHub)
- คลิกที่ หมายเลขบรรทัดที่คุณต้องการ ทางด้านซ้าย
- จากนั้นทำการ Copy Link (https://github.com/qianlongo/fe-handwriting/blob/master/17.quick-sort.js#L8)
เชื่อว่า คุณคงสังเกตเห็นว่ามี "L8" อยู่ตรงด้านหลัง Link ของเรา ซึ่งแน่นอนว่าคุณสามารถ Link ไปยัง Code ที่ต้องการได้ด้วยการเพิ่ม "L" + หมายเลขบรรทัด เข้าไปใน Link
4. การ Link ไปยัง Code หลาย ๆ บรรทัด
เนื่องจากตอนนี้เราสามารถ Link ไปยังบรรทัดของ Code ที่ต้องการ(เพียงบรรทัดเดียว) ได้แล้ว แต่คำถามคือ เราจะสามารถ Link ไปยัง Code หลาย ๆ บรรทัด ได้หรือไม่? ซึ่งคำตอบคือ สามารถทำได้
ขั้นตอน
- เปิด https://github.com/qianlongo/fe-handwriting/blob/master/17.quick-sort.js (หรือ Project ใด ๆ ที่ต้องการบน GitHub)
- กดปุ่ม "shift" ค้างไว้ แล้วคลิกที่หมายเลขบรรทัดของ Code ที่ต้องการ ทางด้านซ้าย
- จากนั้นทำการ Copy Link (https://github.com/qianlongo/fe-handwriting/blob/master/17.quick-sort.js#L8-L24)
5. ไปยัง Functions ที่ถูก Define
เราจะสามารถ Link ไปยังจุดที่ Functions ที่ถูก Define อย่างรวดเร็ว ได้อย่างไร?
คำตอบคือ ขอแนะนำให้คุณใช้ Chrome Plugin ที่มีชื่อว่า sourcegraph
หลังจากติดตั้ง Plugin แล้ว, จะมีปุ่มปรากฏขึ้น เมื่อวางเมาส์ไว้ในตำแหน่งที่ Function ถูกใช้งาน จากนั้นให้คุณคลิกที่ปุ่มเพื่อ Link ไปยังตำแหน่งที่มันถูก Define ไว้
ดูตัวอย่างในรูปแบบ gif ได้จากด้านล่าง
6. ดู List ของ Shortcut Keys
ใน GitHub ได้มีการจัดเตรียม Shortcut Keys ไว้ให้มากมาย เพื่อที่จะช่วยให้เราสามารถอ่าน Code ได้ แต่การที่จะจดจำมันทั้งหมดไม่ใช่เรื่องง่าย ๆ แต่โชคดีที่คุณสามารถใช้ “Shift” + “?” เพื่อแสดง List ของ Shortcuts
ที่มา: https://javascript.plainenglish.io/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
|
|
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
|
|
บทความล่าสุด