qubyte codes
1.0.0
พื้นที่เก็บข้อมูลนี้มีทั้งตัวสร้างไซต์แบบคงที่และเนื้อหาสำหรับ https://qubyte.codes
ตัวสร้างส่วนใหญ่อยู่ใน index.js การยกของหนักส่วนใหญ่ทำได้โดยระบบสร้างกราฟแบบกำหนดเองและทำเครื่องหมาย ซึ่งจะนำไฟล์มาร์กดาวน์และประมวลผลเป็นเนื้อหา HTML แม้ว่ามันจะไม่สมบูรณ์แบบ และจำเป็นต้องมีการปะปะลิงบ้าง โมดูล lib/render.js ทำการแพตช์นี้ และเพิ่มการเน้นไวยากรณ์และการจัดรูปแบบของสูตรทางคณิตศาสตร์
Serve.js เป็นเซิร์ฟเวอร์สำหรับการพัฒนา เมื่อไฟล์เปลี่ยนแปลง ส่วนของกราฟบิลด์จะถูกรันอีกครั้งเพื่อรับเอาต์พุตที่อัปเดต
ไฟล์ต้นฉบับมีอยู่ในไดเร็กทอรี src และเนื้อหา เมื่อสร้างแล้ว ไดเร็กทอรีสาธารณะจะถูกสร้างขึ้น และไฟล์ต้นฉบับบางส่วนเหล่านี้จะถูกคัดลอกไปทับ (ไฟล์ที่ไม่จำเป็นต้องคอมไพล์ เช่น โปรแกรมทำงานของบริการ) ไฟล์อื่นๆ จะต้องถูกสร้างขึ้นและวางไว้ในไดเร็กทอรีสาธารณะในขณะที่ถูกสร้างขึ้น
netlify.toml เป็นการกำหนดค่าสำหรับ Netlify ซึ่งโฮสต์บล็อกของฉัน (ฉันขอแนะนำเป็นอย่างยิ่ง) ในขณะที่เขียนไฟล์นี้มีเพียงการกำหนดค่าสำหรับส่วนหัวเท่านั้น สิ่งเหล่านี้ได้รับการปรับให้เหมาะสมเพื่อความปลอดภัยและการแคชเบราว์เซอร์ของ CSS เดิมทีฉันโฮสต์บล็อกนี้บน DigitalOcean droplet โดยใช้ NGINX การกำหนดค่านั้นยังคงเป็นส่วนหนึ่งของ repo นี้ nginx.conf
ฉันใช้ postcss เพื่อคอมไพล์ CSS โดยหลักการแล้ว CSS สามารถใช้งานได้โดยไม่ต้องมีมัน postcss ส่วนใหญ่ใช้เพื่อเชื่อมและลดขนาด CSS CSS เอาท์พุตถูกแฮช และแฮชจะกลายเป็นส่วนหนึ่งของชื่อไฟล์ CSS นี่เป็นการหยุดแคช เนื่องจาก CSS มีเวลาแคชนานหรือไม่มีกำหนดเพื่อหลีกเลี่ยงไม่ให้บล็อกการโหลดหน้าเว็บหลังจากโหลดไปแล้วครั้งหนึ่ง
ไซต์นี้หลีกเลี่ยงการใช้คลาสใน HTML เป็น hooks สำหรับ CSS เป็นหลัก ยกเว้นการเน้นไวยากรณ์ โดยยืนยันว่ามาร์กอัปความหมายให้บริบทที่เพียงพอสำหรับ CSS ที่จะยึดถือ
บล็อกนี้เป็น Progressive Web App (PWA) และมีไอคอนหลายขนาดตามลำดับ หนึ่งในนั้นก็คือไอคอน Fav
ไดเร็กทอรีนี้ประกอบด้วยแหล่งที่มาของมาร์กดาวน์ของโพสต์ที่เผยแพร่ แต่ละโพสต์มีคำนำ JSON ที่มีข้อมูลเมตาต่างๆ:
| ชื่อ | คำอธิบาย |
|---|---|
| วันที่และเวลา | การประทับเวลาการเผยแพร่ของโพสต์ หากเป็นเช่นนี้ในอนาคต โพสต์จะไม่ถูกแสดงผล |
| ชื่อ | ชื่อเรื่องของโพสต์ |
| คำอธิบาย | คำอธิบายของโพสต์ สิ่งนี้ถูกเพิ่มลงในส่วนหัว HTML เป็นคำอธิบายเมตาและคำอธิบายเมตาทวิตเตอร์ ทวิตเตอร์ใช้อันหลังเพื่อเติมการ์ดตัวสั่นด้วยความตื่นเต้น |
| ร่าง | หากเป็นจริง โพสต์จะไม่ถูกแสดงผล |
| แท็ก | รายการแท็ก สิ่งเหล่านี้จะแสดงที่ด้านบนของแต่ละรายการ และยังใช้เมื่อแชร์บน Twitter และ Mastodon ผ่านลิงก์ที่ด้านล่างของแต่ละโพสต์ |
| การกล่าวถึงเว็บ | รายชื่อเว็บเมนชั่นจากบล็อกอื่นๆ |
| สคริปต์ | รายการวัตถุที่มีฟิลด์ href สิ่งเหล่านี้จะถูกเพิ่มเป็นสคริปต์ประเภทโมดูลที่ส่วนหัวของโพสต์ |
ฉันใช้เทมเพลตแฮนด์บาร์เพื่อแสดงเนื้อหาลงในหน้าต่างๆ บางส่วนมีหน้าต่างๆ และบางส่วนเป็นส่วนประกอบทั่วไปของหน้า พวกเขาค่อนข้างเป็นโรงเรียนเก่า แต่ทำงานได้ดี
โปรแกรมทำงานของบริการและไฟล์ Manifest คือไฟล์ที่ช่วยให้บล็อกนี้ทำงานเป็น PWA ได้ โดยส่วนใหญ่ จะมีแคชแบบกำหนดเอง นอกจากนี้ยังอนุญาตให้ "ติดตั้ง" บล็อกนี้บน Android ได้ (แม้ว่าฉันจะไม่สนใจฟังก์ชันนี้ก็ตาม)
