หน้าแรก>แหล่งข้อมูลการสร้างเว็บไซต์>ข้อมูลเว็บไซต์
ดาวน์โหลด

Readme Banner พร้อมภาพประกอบของ Sixya

เว็บไซต์สำคัญ

นี่คือที่เก็บข้อมูลที่มีซอร์สโค้ดสำหรับเว็บไซต์ของ SINGA ซึ่งเป็นรังของเราเองบนเว็บ เราพบว่ามันเป็นงานศิลปะ แต่แน่นอนว่าเรามีอคติ

หากคุณพบว่ามันน่าสนใจสร้างแรงบันดาลใจหรือเรียนรู้บางสิ่งจากมันให้แน่ใจว่าได้ทิ้งดาวไว้

สถาปัตยกรรม

เราพัฒนาเว็บไซต์นี้โดยใช้ svelte + sveltekit และห้องสมุด UI ที่กำหนดเอง @significa/svelte-ui เผยแพร่ภายใต้ sixy/sibera-svelte-ui

เพื่อให้บรรลุคุณสมบัติทั้งหมดเราใช้ประโยชน์จากบริการภายนอกสองสามรายการ:

  • CMS - Storyblok: เป็นที่ที่เรากำหนดค่าเว็บไซต์สร้างหน้าจัดเก็บและให้บริการสินทรัพย์
  • Bucket Storage - AWS S3: ใช้ในการจัดเก็บไฟล์แนบอัปโหลดผ่านแบบฟอร์มการติดต่อ
  • Email Dispatcher - AWS SES: ใช้เพื่อส่งอีเมลแจ้งเตือน
  • ฐานข้อมูล NOSQL - AWS Dynamo DB: มีวัตถุประสงค์เพื่อจัดเก็บและดึงภาพวาดไข่ "Seggs" โดยผู้ใช้ของเรา
  • ฐานข้อมูลการส่งแบบฟอร์ม - ความคิด: เราสร้างรายการใหม่บนฐานข้อมูลความคิดเมื่อมีคนส่งแบบฟอร์ม วิธีนี้เราสามารถเก็บทุกอย่างไว้ในพื้นที่ส่วนกลาง

เว็บไซต์นี้โฮสต์บน Vercel และปรับใช้ผ่านเวิร์กโฟลว์การกระทำของ GitHub การตรวจสอบการรวมอย่างต่อเนื่อง (CI) ทั้งหมดจะทำผ่านการกระทำของ Gihub

เรามีสามสภาพแวดล้อมที่แตกต่างกันสำหรับเว็บไซต์:

  • local-development สำหรับนักพัฒนาเพื่อพัฒนาและทดสอบรหัสของพวกเขาบนเครื่องของพวกเขา
  • staging ล้อมรอบสาขา main และการปรับใช้ตัวอย่าง (คำขอดึง);
  • production นำไปใช้เมื่อมีการเผยแพร่รุ่น

ซึ่งหมายความว่าโครงสร้างพื้นฐานทั้งหมดมีรุ่นสำหรับแต่ละสภาพแวดล้อม รวมถึงคีย์ที่แตกต่างและภายนอกและการรวม: ทรัพยากร AWS, แอปพลิเคชันแนวคิด, ฐานข้อมูล ฯลฯ

นี่คือวิธีการเชื่อมต่อทุกอย่าง (ลูกศรแสดงถึงผู้ริเริ่มคำขอ):

ไดอะแกรมโครงสร้างพื้นฐาน

การบริจาค

การพัฒนาโครงการนี้เป็นไปตามแผนงานภายใน ดังนั้นเรามักจะเปิดให้มีการปรับปรุงและการแก้ไขข้อผิดพลาดที่ไม่มีผลกระทบอย่างมากในคุณสมบัติหรือการตั้งค่าโครงการ

ความต้องการ

  • ติดตั้งเวอร์ชันโหนดที่ระบุในไฟล์ .nvmrc (ใช้ตัวจัดการเวอร์ชันโหนดที่คุณชื่นชอบ)

  • รับการพัฒนาท้องถิ่น .env โดยใช้ 1 Password-Secrets: 1password-secrets local pull หรือสร้างหนึ่งโดยขึ้นอยู่กับตัวอย่างใน .env.example

  • ติดตั้งการพึ่งพาด้วย npm install (หรือ npm ci สำหรับล็อคไฟล์แช่แข็ง)

การพัฒนา

  • เริ่มต้นเซิร์ฟเวอร์การพัฒนา: npm run dev
  • รูปแบบอัตโนมัติรหัส: npm run format

การทดสอบและผ้าสำลี

  • npm run validate
  • npm run test

การปรับใช้และการเปิดตัว

สภาพแวดล้อมการจัดเตรียมนั้นล้อมรอบไปยังสาขา main ซึ่งแต่ละสาขาใหม่จะสร้างการปรับใช้ใหม่เพื่อจัดเตรียม

ในการปรับใช้เวอร์ชันใหม่ในการผลิตให้สร้างรุ่นที่สอดคล้องกับ Semver ใน GitHub (นำหน้าด้วย v ตัวอย่างเช่น: vX.XX ) มันจะถูกปรับใช้โดยอัตโนมัติในการผลิตโดยอัตโนมัติ

เพื่อสร้างโปรแกรมแก้ไข:

  • เช็คเอาท์ไปยัง git checkout vX.XX ;
  • สร้าง Branch git checkout -b hotfix/XXXX ;
  • สร้าง PR to main รับการอนุมัติและรวมเข้าด้วยกัน
  • สร้างรุ่นใหม่ตามสาขา HotFix ของคุณ ใช้สาขา release/xxx เพื่อแก้ไขแบทช์เข้าด้วยกัน

ใบอนุญาต

วัสดุนี้ได้รับใบอนุญาตภายใต้ใบอนุญาต AGPL ช่วยให้คุณสามารถรีมิกซ์เรียนรู้และทดลองใช้งานได้อย่างอิสระ

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

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

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