🐙 เรียนรู้ Git และ GitHub

Learn Git and GitHub - สำหรับคนไทยที่กำลังเรียนภาษาอังกฤษ

📱 Mobile-Friendly | 🔊 Audio Pronunciation | 💻 Hands-On Learning

🎯 Git และ GitHub คืออะไร?
What are Git and GitHub?

💡 Quick Fact! / ข้อมูลด่วน!

English: Git is the most popular version control system in the world! Over 100 million developers use GitHub to store and share their code!

ไทย: Git เป็นระบบควบคุมเวอร์ชันที่ได้รับความนิยมมากที่สุดในโลก! มีนักพัฒนามากกว่า 100 ล้านคนใช้ GitHub เพื่อเก็บและแชร์โค้ดของพวกเขา!

📦 Git

Git เป็นระบบควบคุมเวอร์ชัน (Version Control System) ที่ช่วยให้คุณ:

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

English: Git is a version control system that tracks changes in your code and lets you go back to previous versions.

🐙 GitHub

GitHub เป็นเว็บไซต์สำหรับเก็บโปรเจกต์ Git ออนไลน์ ที่ให้คุณ:

  • เก็บโค้ดบนคลาวด์ (ฟรี!)
  • แชร์โปรเจกต์กับคนอื่น
  • ทำงานร่วมกันเป็นทีม
  • สร้างเว็บไซต์ด้วย GitHub Pages
  • ค้นหาโปรเจกต์โอเพนซอร์ส

English: GitHub is a website where you can store your Git projects online and collaborate with others.

🤔 Simple Analogy / เปรียบเทียบง่ายๆ

Git เหมือนกับ "Google Docs version history" สำหรับโค้ด

GitHub เหมือนกับ "Google Drive" สำหรับโปรเจกต์โค้ด

English: Git is like "Google Docs version history" for code. GitHub is like "Google Drive" for code projects.

📚 คำศัพท์สำคัญ
Key Vocabulary

📦 Repository (Repo)
รีโพซิทอรี / คลังเก็บโค้ด
โฟลเดอร์โปรเจกต์ที่มีการติดตาม Git
A project folder tracked by Git
💾 Commit
คอมมิต / บันทึกการเปลี่ยนแปลง
การบันทึกการเปลี่ยนแปลงพร้อมข้อความอธิบาย
Saving changes with a description message
📤 Push
พุช / ส่งขึ้น
ส่งการเปลี่ยนแปลงจากเครื่องคุณไป GitHub
Sending your changes to GitHub
📥 Pull
พูล / ดึงลงมา
ดึงการเปลี่ยนแปลงจาก GitHub มายังเครื่องคุณ
Getting changes from GitHub to your computer
🌿 Branch
แบรนช์ / สาขา
เวอร์ชันแยกของโปรเจกต์เพื่อทดลองฟีเจอร์ใหม่
A separate version of your project to try new features
🔀 Merge
เมิร์จ / รวม
รวมการเปลี่ยนแปลงจากแบรนช์หนึ่งเข้ากับอีกแบรนช์
Combining changes from one branch into another
📋 Clone
โคลน / คัดลอก
คัดลอกรีโพจาก GitHub มายังเครื่องคุณ
Copying a repository from GitHub to your computer
🍴 Fork
ฟอร์ก / แยกโปรเจกต์
คัดลอกรีโพของคนอื่นมาเป็นของคุณใน GitHub
Copying someone else's repository to your GitHub account
🔄 Pull Request (PR)
พูลรีเควสต์ / ขอรวมโค้ด
ขอให้เจ้าของโปรเจกต์รวมการเปลี่ยนแปลงของคุณ
Asking the project owner to include your changes
⚠️ Conflict
คอนฟลิกต์ / ความขัดแย้ง
เมื่อมีการแก้ไขที่ตำแหน่งเดียวกันและขัดแย้งกัน
When changes at the same location contradict each other
🏷️ Tag
แท็ก / ป้ายชื่อ
ทำเครื่องหมายคอมมิตพิเศษ (เช่น v1.0, v2.0)
Marking special commits (like v1.0, v2.0)
📝 README
รีดมี / ไฟล์อ่านก่อน
ไฟล์อธิบายโปรเจกต์ (README.md)
A file that describes your project (README.md)
🚫 .gitignore
กิตอิกนอร์ / ไฟล์ละเว้น
ไฟล์ระบุว่าไฟล์ไหนไม่ต้องติดตาม
A file that tells Git which files to ignore
🌐 Remote
รีโมท / ที่เก็บออนไลน์
เวอร์ชันของรีโพที่อยู่บนเซิร์ฟเวอร์ (เช่น GitHub)
The version of your repo on a server (like GitHub)
💻 Local
โลคอล / ในเครื่อง
เวอร์ชันของรีโพที่อยู่ในคอมพิวเตอร์ของคุณ
The version of your repo on your computer
🎉 เยี่ยมมาก! คุณได้เรียนรู้คำศัพท์สำคัญแล้ว 15 คำ!
Great job! You've learned 15 important vocabulary words!

👤 สร้างบัญชี GitHub
Create a GitHub Account

1ไปที่เว็บไซต์ / Visit the Website

เปิดเบราว์เซอร์และไปที่ https://github.com

English: Open your browser and go to https://github.com

2คลิก Sign Up / Click Sign Up

คลิกปุ่ม Sign up ที่มุมบนขวา

คุณจะต้องกรอก:

  • Email: อีเมลของคุณ
  • Password: รหัสผ่าน (อย่างน้อย 15 ตัวอักษร)
  • Username: ชื่อผู้ใช้ (ต้องไม่ซ้ำกับคนอื่น)

English: Click the Sign up button in the top right corner. You'll need to enter your email, create a password, and choose a unique username.

💡 Username Tips / เคล็ดลับชื่อผู้ใช้

  • ใช้ชื่อที่เป็นมืออาชีพ (เช่น john-smith, jane-dev)
  • หลีกเลี่ยงตัวเลขแบบสุ่ม (เช่น user12345)
  • จำได้ง่ายและสั้น
  • อาจใช้ชื่อจริงหรือชื่อเล่น

English: Choose a professional username that's easy to remember. Avoid random numbers!

3ยืนยันอีเมล / Verify Email

GitHub จะส่งอีเมลยืนยันไปที่คุณ

  1. เปิดอีเมลของคุณ
  2. หาอีเมลจาก GitHub
  3. คลิกลิงก์ยืนยัน (Verify email address)

English: GitHub will send a verification email. Open it and click the verification link.

4เลือกแผน / Choose a Plan

GitHub จะถามว่าคุณต้องการแผนแบบไหน

  • Free (ฟรี): เหมาะสำหรับเริ่มต้น - รีโพได้ไม่จำกัด!
  • Pro: สำหรับมืออาชีพ ($4/เดือน)

คำแนะนำ: เลือก Free ก่อน - มันใช้งานได้ดีมาก!

English: Choose the Free plan - it's perfect for learning and includes unlimited repositories!

🎊 ยินดีด้วย! คุณมีบัญชี GitHub แล้ว!
Congratulations! You now have a GitHub account!

📦 สร้าง Repository แรก
Create Your First Repository

🎯 What We'll Create / สิ่งที่เราจะสร้าง

English: We'll create a simple repository for a personal website. This will be your first step into the world of Git and GitHub!

ไทย: เราจะสร้างรีโพง่ายๆ สำหรับเว็บไซต์ส่วนตัว นี่จะเป็นก้าวแรกของคุณสู่โลกของ Git และ GitHub!

1คลิก New Repository / Click New Repository

หลังจากล็อกอินแล้ว:

  1. คลิกปุ่ม + ที่มุมบนขวา
  2. เลือก New repository

English: After logging in, click the plus button in the top right corner and select New repository.

2กรอกข้อมูล Repository / Fill in Repository Details

กรอกข้อมูลตามนี้:

  • Repository name: ชื่อโปรเจกต์ เช่น my-first-repo
  • Description: (ไม่บังคับ) คำอธิบายโปรเจกต์ เช่น "My first GitHub repository"
  • Public or Private: เลือก Public (ทุกคนเห็นได้) หรือ Private (เฉพาะคุณ)
  • Initialize with README: ✅ เลือกไว้ - สำคัญมาก!

English: Fill in the repository details. Make sure to check "Initialize this repository with a README" - this is important!

💡 Repository Name Rules / กฎการตั้งชื่อ

  • ใช้อักษรภาษาอังกฤษพิมพ์เล็ก (a-z)
  • ใช้ตัวเลข (0-9) ได้
  • ใช้ขีดกลาง (-) หรือขีดล่าง (_) ได้
  • ห้ามมีช่องว่าง (ใช้ - แทน)
  • ตัวอย่างที่ดี: my-website, hello_world

English: Use lowercase letters, numbers, hyphens, or underscores. No spaces allowed!

3คลิก Create Repository / Click Create Repository

คลิกปุ่มสีเขียว Create repository ที่ด้านล่าง

🎉 ยินดีด้วย! คุณเพิ่งสร้าง Repository แรกแล้ว!

English: Click the green Create repository button at the bottom. Congratulations! You just created your first repository!

4สำรวจ Repository / Explore Your Repository

คุณจะเห็นหน้าต่างๆ ดังนี้:

  • Code: ไฟล์และโฟลเดอร์ทั้งหมด
  • Issues: ติดตามปัญหาและงานที่ต้องทำ
  • Pull requests: ขอให้รวมโค้ด
  • Actions: ระบบอัตโนมัติ
  • Settings: ตั้งค่า repository

English: You'll see several tabs: Code shows your files, Issues tracks tasks, Pull requests manages contributions, and Settings controls repository options.

🚀 ยอดเยี่ยม! Repository แรกของคุณพร้อมแล้ว!
Excellent! Your first repository is ready!

✏️ แก้ไขไฟล์บน GitHub
Editing Files on GitHub

1แก้ไขไฟล์ README.md / Edit README.md

มาแก้ไขไฟล์ README.md กันเถอะ:

  1. คลิกที่ไฟล์ README.md
  2. คลิกปุ่มดินสอ (✏️) ที่มุมบนขวาของไฟล์
  3. ตอนนี้คุณอยู่ในโหมดแก้ไขแล้ว!

English: Click on README.md, then click the pencil icon to edit. Now you're in edit mode!

2เขียน Markdown / Write in Markdown

ลองเพิ่มข้อความนี้:

# My First Repository Welcome to my first GitHub repository! ## About Me - Name: [Your Name] - Learning: Git and GitHub - Goal: Become a great developer! ## What I'm Learning 1. How to create repositories 2. How to edit files 3. How to commit changes ## Technologies - Git - GitHub - Markdown --- Made with ❤️ by [Your Name]

English: Markdown is a simple way to format text. Use # for headers, - for lists, ** for bold text!

📝 Markdown Quick Guide / คู่มือ Markdown ฉบับย่อ

# Heading 1 (หัวข้อใหญ่) ## Heading 2 (หัวข้อรอง) ### Heading 3 (หัวข้อย่อย) **Bold text** (ตัวหนา) *Italic text* (ตัวเอียง) - List item (รายการ) - Another item 1. Numbered list (รายการเลข) 2. Second item [Link text](https://example.com) (ลิงก์) `code` (โค้ด)

3Commit การเปลี่ยนแปลง / Commit Changes

หลังจากแก้ไขเสร็จ:

  1. เลื่อนลงไปด้านล่างของหน้า
  2. เห็นส่วน Commit changes
  3. ใส่ข้อความอธิบาย เช่น "Update README with personal info"
  4. คลิกปุ่มสีเขียว Commit changes

English: Scroll down, write a commit message describing your changes, and click Commit changes.

⚠️ Good Commit Messages / ข้อความคอมมิตที่ดี

ดี:

  • "Add profile picture to README"
  • "Fix typo in introduction"
  • "Update contact information"

ไม่ดี:

  • "update" (ไม่ชัดเจน)
  • "asdfgh" (ไม่มีความหมาย)
  • "changes" (ไม่บอกว่าเปลี่ยนอะไร)

English: Write clear, specific commit messages that explain what you changed and why!

4สร้างไฟล์ใหม่ / Create a New File

ลองสร้างไฟล์ HTML ง่ายๆ:

  1. กลับไปที่หน้า Code หลัก
  2. คลิก Add file > Create new file
  3. ตั้งชื่อไฟล์: index.html
  4. เพิ่มโค้ดด้านล่าง
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>My GitHub Page</title> <style> body { font-family: Arial, sans-serif; max-width: 800px; margin: 50px auto; padding: 20px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; } h1 { text-align: center; } </style> </head> <body> <h1>Welcome to My GitHub Page!</h1> <p>This is my first web page hosted on GitHub!</p> <p>I'm learning Git and GitHub! 🚀</p> </body> </html>

English: Click Add file, choose Create new file, name it index.html, add your HTML code, and commit!

5Commit ไฟล์ใหม่ / Commit the New File

  1. เลื่อนลงไปด้านล่าง
  2. ใส่ข้อความ: Create index.html homepage
  3. คลิก Commit new file

English: Scroll down, write a commit message like "Create index.html homepage", and click Commit new file.

💪 เก่งมาก! คุณแก้ไขและสร้างไฟล์บน GitHub ได้แล้ว!
Awesome! You can now edit and create files on GitHub!

🌐 เผยแพร่เว็บไซต์ด้วย GitHub Pages
Publish Website with GitHub Pages

🎁 Free Website Hosting! / โฮสต์เว็บฟรี!

English: GitHub Pages lets you host a website directly from your repository - completely free!

ไทย: GitHub Pages ให้คุณโฮสต์เว็บไซต์ได้โดยตรงจาก repository ของคุณ - ฟรีทั้งหมด!

1ไปที่ Settings / Go to Settings

  1. คลิกแท็บ Settings (⚙️)
  2. เลื่อนลงไปหา Pages ในเมนูด้านซ้าย
  3. คลิก Pages

English: Click the Settings tab, find Pages in the left menu, and click it.

2เปิดใช้งาน GitHub Pages / Enable GitHub Pages

  1. ในส่วน Source, เลือก main branch
  2. คลิก Save
  3. รอสักครู่...
  4. คุณจะเห็นลิงก์เว็บไซต์ของคุณ!

English: Under Source, select the main branch and click Save. Wait a moment, and you'll see your website link!

🌐 Your Website URL / URL เว็บไซต์ของคุณ

เว็บไซต์ของคุณจะอยู่ที่:

https://yourusername.github.io/repository-name/

ตัวอย่าง:

https://john-smith.github.io/my-first-repo/

English: Your website will be at https://yourusername.github.io/repository-name/

🎉 ยินดีด้วย! คุณมีเว็บไซต์ออนไลน์แล้ว!
Congratulations! You have a live website!

🚀 ขั้นตอนต่อไป
Next Steps

🎓 สิ่งที่คุณได้เรียนรู้:

  • Git และ GitHub คืออะไร
  • คำศัพท์สำคัญ 15 คำ
  • วิธีสร้างบัญชี GitHub
  • วิธีสร้าง Repository
  • วิธีแก้ไขไฟล์บน GitHub
  • วิธีเขียน Markdown
  • วิธีทำ Commit
  • วิธีเผยแพร่เว็บไซต์ด้วย GitHub Pages

🎓 What You Learned:

English: You learned what Git and GitHub are, key vocabulary, how to create an account and repository, edit files, write Markdown, make commits, and publish websites with GitHub Pages!

📚 Continue Learning / เรียนรู้ต่อ

ในบทเรียนถัดไป คุณจะได้เรียนรู้:

  • การใช้ Git ในเครื่องคอมพิวเตอร์
  • การทำงานกับ Branches
  • การทำ Pull Requests
  • การทำงานร่วมกับคนอื่น
  • การแก้ไข Conflicts
  • Git Commands ขั้นสูง

English: In the next tutorial, you'll learn how to use Git on your computer, work with branches, make pull requests, collaborate with others, and resolve conflicts!

🌟 Amazing Work! / ทำได้ยอดเยี่ยม!

ไทย: คุณเพิ่งก้าวเข้าสู่โลกของการพัฒนาซอฟต์แวร์แบบมืออาชีพ! Git และ GitHub เป็นเครื่องมือที่นักพัฒนาทุกคนใช้ ฝึกฝนต่อไป!

English: You just stepped into the world of professional software development! Git and GitHub are tools that every developer uses. Keep practicing!

🎉 Happy Coding! / สนุกกับการเขียนโค้ด! 🎉

Made with 💙 for Thai English Learners

สร้างด้วย 💙 สำหรับคนไทยที่กำลังเรียนภาษาอังกฤษ

📱 Tap the 🔊 buttons anytime to hear English pronunciation!

กดปุ่ม 🔊 เมื่อไรก็ได้เพื่อฟังการออกเสียงภาษาอังกฤษ!