GitHub Gist คืออะไร + การใช้งาน Gist บนเว็บไซต์

การใช้งาน Gist・GitHub เพื่อใช้ในการเขียนโค้ดตัวอย่างหรือข้อมูลต่างๆ และแบ่งปันให้กับผู้ใช้งานคนอื่น ไม่ใช่เรื่องยากอีกต่อไป ในบล็อกนี้ได้มีการเขียนอธิบายรายละเอียดเกี่ยวกับการใช้งานไว้แล้ว

Tinnakorn Maneewong

2021.08.13

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

Gist คืออะไร

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

การใช้งาน Gist

ก่อนเริ่มการใช้งาน ต้องมี Account GitHub ก่อน ถ้าใครยังไม่มีสามารถเข้าไปสมัครได้ที่ github.com

ข้อมูลที่ควรรู้ก่อนเริ่มต้นการใช้งาน Gist

ก่อนอื่นให้เข้าไปที่ลิงก์ gist.github.com G-1 ><

จากรูป จะมีตัวเลือกให้ตั้งค่าดังนี้

Gist descriptionเขียนคำอธิบาย
Filename including extension...ให้ตั้งชื่อและนามสกุลไฟล์ เช่นtest_file.jsเป็นต้น
Indent modeโหมดย่อหน้า
- Spaces ในระหว่างที่ย่อหน้าไปแล้วเวลาลบจะลบตาม Spaces ปกติ
- Tabs ในระหว่างที่ย่อหน้าไปแล้วเวลาลบจะลบตาม Indent size ที่เลือกไว้
Indent sizeขนาดย่อหน้า
- 2
- 4
- 8
Line wrap modeโหมดตัดเส้น
- No wrap ในขณะที่เขียนโค้ดเกิน textarea width ไปแล้วจะไม่ขึ้นบรรทัดใหม่
- Soft wrap ในขณะที่เขียนโค้ดเกิน textarea width ไปแล้วจะขึ้นบรรทัดใหม่
Add fileการเพิ่มโค้ดหรือข้อมูลที่ต้องการเข้าไปใหม่
Create secret gistสำหรับคนที่ได้รับ URL จากเราเท่านั้นสามารถเข้าถึงได้
Create public gistสำหรับทุกคนที่ค้นหาเจอแบบสาธารณะสามารถเข้าถึงได้

การสร้าง Gist

โดยส่วนตัวแล้วผมจะตั้งค่าแค่ในส่วนของFilenameและIndent sizeซึ่งเพื่อนๆ สามารถตั้งค่าตามนี้ได้เลย G-2 ><

ในกรณีที่ต้องการเพิ่มไฟล์ให้กดที่ปุ่มAdd fileแล้วจะมี textarea ใหม่ขึ้นมาให้เพิ่มข้อมูล แต่ถ้าต้องการลบ textarea สามารถกดปุ่มไอคอนถังขยะเพื่อลบได้เลย G-3 ><

หลังจากตั้งค่าและเพิ่มข้อมูลที่ต้องการเรียบร้อยแล้ว ให้เลือกปุ่มสีเขียวด้านขวาล่างตรงสัญลักษณ์▾ที่ติดกับCreate ... gistเพื่อเลือกว่าจะสร้างแบบเฉพาะเจาะจงหรือสาธารณะ จากนั้นให้กดปุ่มCreate ... gistที่เลือกไว้ ในส่วนนี้ผมจะเลือกเป็นCreate public gist G-4 ><