gatsby

แกสบี้

อนาคตของการพัฒนาเว็บไซต์อยู่ที่นี่

Gatsby เป็นเฟรมเวิร์กโอเพ่นซอร์สฟรีที่ใช้ React ซึ่งช่วยให้นักพัฒนาสร้างเว็บไซต์และแอพที่รวดเร็วเป็นพิเศษ
โดยผสมผสานการควบคุมและความสามารถในการปรับขนาดของไซต์ที่แสดงผลแบบไดนามิกเข้ากับความเร็วของการสร้างไซต์คงที่ ทำให้เกิดความเป็นไปได้ใหม่ๆ

การเริ่มต้นอย่างรวดเร็ว · บทช่วยสอน · ปลั๊กอิน · ผู้เริ่มต้น · โชว์เคส · มีส่วนร่วม
สนับสนุน: Twitter, การสนทนา & Discord

Gatsby ช่วยให้นักพัฒนามืออาชีพสร้างเว็บไซต์ที่มีเนื้อหาครบถ้วนและบำรุงรักษาได้ประสิทธิภาพสูงได้อย่างมีประสิทธิภาพ

• โหลดข้อมูลจากทุกที่ Gatsby ดึงข้อมูลจากแหล่งข้อมูลใดๆ ไม่ว่าจะเป็นไฟล์ Markdown, CMS ที่ไม่มีส่วนหัว เช่น Contentful หรือ WordPress หรือ REST หรือ GraphQL API ใช้ปลั๊กอินต้นทางเพื่อโหลดข้อมูลของคุณ จากนั้นพัฒนาโดยใช้อินเทอร์เฟซ GraphQL แบบเดียวกันของ Gatsby

• ไปไกลกว่าเว็บไซต์คงที่ รับประโยชน์ทั้งหมดของเว็บไซต์แบบคงที่โดยไม่มีข้อจำกัด ไซต์ Gatsby เป็นแอป React ที่ทำงานได้อย่างสมบูรณ์ ดังนั้นคุณจึงสามารถสร้างเว็บแอปไดนามิกคุณภาพสูงได้ ตั้งแต่บล็อก ไซต์อีคอมเมิร์ซ ไปจนถึงแดชบอร์ดผู้ใช้

• เลือกตัวเลือกการแสดงผลของคุณ คุณสามารถเลือกตัวเลือกการเรนเดอร์อื่นได้ เช่น Deferred Static Generation (DSG) และ Server-Side Rendering (SSR) นอกเหนือจาก Static Site Generation (SSG) — ในแต่ละเพจ การควบคุมแบบละเอียดประเภทนี้ช่วยให้คุณสามารถปรับประสิทธิภาพและประสิทธิผลให้เหมาะสมโดยไม่ต้องเสียสละสิ่งหนึ่งไปอีกอย่าง

• ประสิทธิภาพถูกอบอวลอยู่ในตัว เก่งการตรวจสอบประสิทธิภาพของคุณตามค่าเริ่มต้น Gatsby ทำให้การแยกโค้ดเป็นอัตโนมัติ การเพิ่มประสิทธิภาพรูปภาพ สไตล์ที่สำคัญแบบอินไลน์ การโหลดแบบ Lazy Loading การดึงข้อมูลทรัพยากรล่วงหน้า และอื่นๆ เพื่อให้แน่ใจว่าไซต์ของคุณรวดเร็ว — ไม่จำเป็นต้องปรับแต่งด้วยตนเอง

• ใช้สแต็คสมัยใหม่สำหรับทุกไซต์ ไม่ว่าข้อมูลจะมาจากไหน ไซต์ Gatsby ก็ถูกสร้างขึ้นโดยใช้ React และ GraphQL สร้างขั้นตอนการทำงานที่เหมือนกันสำหรับคุณและทีมของคุณ ไม่ว่าข้อมูลจะมาจากแบ็กเอนด์เดียวกันก็ตาม

• เป็นเจ้าภาพในระดับสำหรับเพนนี ไซต์ Gatsby ไม่จำเป็นต้องใช้เซิร์ฟเวอร์ ดังนั้นคุณจึงสามารถโฮสต์ไซต์ทั้งหมดของคุณบน CDN ได้ในราคาเพียงเศษเสี้ยวของไซต์ที่แสดงผลบนเซิร์ฟเวอร์ เว็บไซต์ Gatsby หลายแห่งสามารถโฮสต์ได้ฟรีบน Netlify และบริการอื่นๆ ที่คล้ายคลึงกัน

• ใช้ชั้นข้อมูลส่วนกลางของ Gatsby ทุกที่ ด้วย Valhalla Content Hub ของ Gatsby คุณสามารถนำชั้นข้อมูลของ Gatsby ไปใช้กับโปรเจ็กต์ใดก็ได้ ทำให้สามารถเข้าถึงได้ผ่าน GraphQL API แบบรวมสำหรับการสร้างไซต์เนื้อหา แพลตฟอร์มอีคอมเมิร์ซ และทั้งแอปพลิเคชันเนทีฟและเว็บ

เรียนรู้วิธีใช้ Gatsby สำหรับโปรเจ็กต์ถัดไปของคุณ

จัดส่งไซต์ Gatsby แรกของคุณใน 5 นาที

คลิกลิงก์ด้านล่างเพื่อลองใช้ขั้นตอนการพัฒนา สร้าง และปรับใช้เว็บไซต์ด้วย Gatsby และ Netlify อย่างรวดเร็ว

เมื่อสิ้นสุดกระบวนการนี้ คุณจะมี

1. เว็บไซต์ที่ทำงานบน Netlify

2. พื้นที่เก็บข้อมูลใหม่ที่เชื่อมโยงกับไซต์ใหม่นั้น

3. เมื่อคุณผลักดันการเปลี่ยนแปลงไปยังพื้นที่เก็บข้อมูลใหม่ Netlify จะสร้างและปรับใช้ไซต์ของคุณใหม่โดยอัตโนมัติ!

เริ่มต้นใช้งาน Gatsby ในพื้นที่ภายใน 5 นาที

คุณสามารถทำให้ไซต์ Gatsby ใหม่พร้อมใช้งานบนสภาพแวดล้อมการพัฒนาในพื้นที่ของคุณได้ภายใน 5 นาทีด้วยสี่ขั้นตอนเหล่านี้:

1. เริ่มต้นโครงการใหม่

    npm เริ่มต้นแกสบี้

   ตั้งชื่อให้ว่า "My Gatsby Site"

2. เริ่มไซต์ในโหมด develop

   จากนั้น ย้ายไปยังไดเร็กทอรีของไซต์ใหม่ของคุณแล้วเริ่มต้นใหม่:

    ซีดี my-gatsby-site/
   npm วิ่งพัฒนา

3. เปิดซอร์สโค้ดและเริ่มแก้ไข!

   ขณะนี้เว็บไซต์ของคุณทำงานที่ http://localhost:8000 เปิดไดเร็กทอรี my-gatsby-site ในโปรแกรมแก้ไขโค้ดที่คุณเลือกและแก้ไข src/pages/index.js บันทึกการเปลี่ยนแปลงของคุณ แล้วเบราว์เซอร์จะอัปเดตแบบเรียลไทม์!

ณ จุดนี้ คุณมีเว็บไซต์ Gatsby ที่ใช้งานได้เต็มรูปแบบแล้ว สำหรับข้อมูลเพิ่มเติมเกี่ยวกับวิธีปรับแต่งไซต์ Gatsby ของคุณ โปรดดูปลั๊กอินและบทช่วยสอนอย่างเป็นทางการของเรา

- การเรียนรู้แกสบี้

เอกสารฉบับเต็มเกี่ยวกับ Gatsby Lives อยู่บนเว็บไซต์

• สำหรับนักพัฒนาส่วนใหญ่ เราขอแนะนำให้เริ่มต้นด้วยบทช่วยสอนเชิงลึกของเราสำหรับการสร้างเว็บไซต์ด้วย Gatsby เริ่มต้นด้วยการไม่มีสมมติฐานเกี่ยวกับระดับความสามารถของคุณและอธิบายทุกขั้นตอนของกระบวนการ

• หากต้องการเจาะลึกตัวอย่างโค้ดโดยตรง โปรดไปที่เอกสารประกอบของเรา โดยเฉพาะอย่างยิ่ง โปรดดูส่วน " คำแนะนำวิธีการ ", " ข้อมูลอ้างอิง " และ " คำแนะนำเชิงแนวคิด " ในแถบด้านข้าง

เรายินดีรับข้อเสนอแนะในการปรับปรุงเอกสารของเรา ดูเอกสารประกอบ “วิธีการมีส่วนร่วม” สำหรับรายละเอียดเพิ่มเติม

เริ่มเรียนรู้ Gatsby: ปฏิบัติตามบทช่วยสอน · อ่านเอกสาร

- บันทึกประจำรุ่น

สงสัยว่าเราได้จัดส่งอะไรเมื่อเร็วๆ นี้? ตรวจสอบบันทึกประจำรุ่นของเราสำหรับไฮไลท์สำคัญ การปรับปรุงประสิทธิภาพ คุณสมบัติใหม่ และการแก้ไขข้อบกพร่องที่สำคัญ

นอกจากนี้ โปรดอ่านเอกสารของเราเกี่ยวกับการรองรับเวอร์ชันเพื่อทำความเข้าใจแผนของเราสำหรับ Gatsby แต่ละเวอร์ชัน

คู่มือการโยกย้าย

มีไซต์ Gatsby แล้วหรือยัง? คำแนะนำที่มีประโยชน์เหล่านี้จะช่วยให้คุณเพิ่มการปรับปรุง Gatsby v5 ลงในเว็บไซต์ของคุณโดยไม่ต้องเริ่มต้นใหม่!

• ย้ายจาก v4 เป็น v5

• ย้ายจาก v3 เป็น v4

• ย้ายจาก v2 ไปยัง v3

❗ จรรยาบรรณ

Gatsby ทุ่มเทเพื่อสร้างชุมชนที่อบอุ่น มีความหลากหลาย และปลอดภัย เราคาดหวังให้ทุกคนที่เข้าร่วมในชุมชน Gatsby ปฏิบัติตาม หลักจรรยาบรรณ ของเรา กรุณาอ่านมัน. โปรดติดตามมัน. ในชุมชน Gatsby เราทำงานอย่างหนักเพื่อสร้างกันและกันและสร้างสรรค์สิ่งมหัศจรรย์ร่วมกัน -

- วิธีการมีส่วนร่วม

ไม่ว่าคุณจะช่วยเราแก้ไขข้อบกพร่อง ปรับปรุงเอกสาร หรือกระจายข่าว เรายินดีอย่างยิ่งที่จะให้คุณเป็นส่วนหนึ่งของชุมชน Gatsby!

ดู คู่มือการสนับสนุน ของเราเพื่อดูแนวคิดในการมีส่วนร่วมและขั้นตอนการตั้งค่าเพื่อให้พื้นที่เก็บข้อมูลของเราพร้อมใช้งานและทำงานบนเครื่องภายในของคุณ

หมายเหตุเกี่ยวกับวิธีการจัดระเบียบที่เก็บนี้

พื้นที่เก็บข้อมูลนี้เป็น monorepo ที่จัดการโดยใช้ Lerna ซึ่งหมายความว่ามีหลายแพ็กเกจที่ได้รับการจัดการในโค้ดเบสนี้ แม้ว่าเราจะเผยแพร่ไปยัง NPM ในรูปแบบแพ็คเกจแยกกันก็ตาม

ใบอนุญาต

ได้รับอนุญาตภายใต้ใบอนุญาต MIT

- ขอบคุณ

ขอขอบคุณผู้ร่วมให้ข้อมูลจำนวนมากของเราที่สร้างปลั๊กอิน ผู้เริ่มต้น วิดีโอ และโพสต์บนบล็อก และขอขอบคุณเป็นพิเศษสำหรับสมาชิกชุมชนของเราที่ช่วยแก้ไขปัญหาและประชาสัมพันธ์ หรือการตอบคำถามเกี่ยวกับการสนทนา Discord และ GitHub

ส่วนสำคัญของสิ่งที่ทำให้ Gatsby ยอดเยี่ยมก็คือพวกคุณทุกคนในชุมชน การมีส่วนร่วมของคุณช่วยยกระดับประสบการณ์ Gatsby และทำให้ดีขึ้นทุกวัน