นี่คือ repo สำหรับ https://jamstack.org
จุดเริ่มต้นสำหรับการเรียนรู้เกี่ยวกับโมเดลสถาปัตยกรรมนี้ สถานที่เรียนรู้ว่า Jamstack คืออะไรสำหรับการแบ่งปันเครื่องมือ เคล็ดลับ ตัวอย่าง และบทความ ที่นี่ยังเป็นสถานที่สำหรับพบปะสังสรรค์ในชุมชนท้องถิ่น หรือขอความช่วยเหลือในการเริ่มต้นพบปะสังสรรค์ของคุณเอง
เราได้รวบรวมชุดวิดีโอ การนำเสนอ บทความ และแหล่งเรียนรู้อื่นๆ เกี่ยวกับ Jamstack คุณสามารถสนับสนุนเนื้อหาไปยังแหล่งทรัพยากรนั้นได้!
เรายอมรับผลงานที่ส่งเป็นคำขอดึง
หากต้องการสนับสนุนลิงก์ไปยังทรัพยากร:
src/site/resources
ด้วยชื่อที่ไม่ซ้ำใครและสื่อความหมาย เติมไฟล์นั้นตามโครงสร้างที่แสดงด้านล่างsrc/site/img/cms
(รูปภาพควรเป็น JPEG กว้าง 600px และสูง 400px)การอ้างอิง md ทรัพยากร:
---
title : Resource title
date : Publish date (YYYY-MM-DD)
link : the URL of this resource
thumbnailurl : /img/cms/resources/resource-thumbnail.jpg
type :
- article (Help us group and sort the resources by type article|video|presentation)
---
ก่อนที่จะส่งคำขอดึง หรือหากคุณกำลังแนะนำ/สนับสนุนโค้ดหรือการเปลี่ยนแปลงเนื้อหา ก็ควรที่จะดูตัวอย่างการเปลี่ยนแปลงของคุณในบิลด์ในเครื่อง เราได้พยายามทำให้กระบวนการรันบิลด์ในเครื่องต่ำที่สุดเท่าที่จะเป็นไปได้
# Clone this repository to your local environment
git clone [email protected]:jamstack/jamstack.org.git
# move in to your local site folder
cd jamstack.org
# install the dependencies
npm install
# run the build and dev server locally
npm start
ไซต์นี้ใช้ TailwindCSS เพื่อนำเสนอคลาส CSS ของยูทิลิตี้และจัดเตรียมวิธีที่รวดเร็วในการจัดรูปแบบไซต์ ซึ่งหมายความว่าการจัดสไตล์ส่วนใหญ่สามารถทำได้โดยไม่ต้องเขียน CSS เพิ่มเติมใดๆ คุณสามารถเพิ่มคลาสยูทิลิตี้ลงใน HTML ได้โดยตรงแทน สิ่งนี้สามารถทำให้เกิดการพัฒนาที่รวดเร็วมากและยังมอบความคุ้นเคยในระดับที่น่าประหลาดใจสำหรับผู้ที่เคยทำงานในลักษณะนี้ (เนื่องจากแบบแผนและชั้นเรียนไม่ได้ เป็นไปตามไซต์ )
ขณะรัน/พัฒนาในเครื่อง คำสั่ง npm run start
จะสร้างไซต์รวมถึงไปป์ไลน์ CSS จาก Tailwind
มีการจัดเตรียมกฎ CSS ตามความต้องการจำนวนเล็กน้อยเพื่อประสิทธิภาพของคลาสซ้ำหรือคลาสทั่วโลก สิ่งเหล่านี้อยู่ใน src/css/tailwind.css
แต่ควรใช้เท่าที่จำเป็น โดยการจัดรูปแบบส่วนใหญ่จะเกิดขึ้นใน HTML ผ่านคลาสยูทิลิตี้ของ Tailwind
ในระหว่างการสร้างที่ใช้งานจริง ไปป์ไลน์ CSS จะมีขั้นตอนในการลบคำสั่ง CSS ที่ไม่ได้ใช้ทั้งหมด และบีบอัด CSS ที่เป็นผลลัพธ์ เพื่อประสิทธิภาพการพัฒนา ขั้นตอนนี้จะไม่ดำเนินการในระหว่างการพัฒนาโลคัลผ่านคำสั่ง npm run start
คุณสามารถดูตัวอย่างบิลด์การผลิตที่ปรับให้เหมาะสมได้โดยการรันคำสั่งเหล่านี้:
# Run a production build
npm run build
# Serve the build locally
npm run start
คุณสามารถโคลนพื้นที่เก็บข้อมูลนี้และบูตเป็นไซต์ทดสอบของคุณเองได้ พร้อมด้วยไปป์ไลน์การสร้าง CI/CD บน Netlify โดยคลิกปุ่มด้านล่าง (ต้องใช้บัญชี GitHub และ Netlify ฟรี)