- กรณีศึกษาของการสร้างบล็อกเองโดยไม่ใช้ Jekyll, Ghost หรือ WordPress
- ข้อกำหนดพื้นฐานคือ ใช้โดเมนที่มีอยู่, สร้างเว็บไซต์แบบสแตติก, รองรับ SEO, และ เพิ่มบทความได้ง่าย
- องค์ประกอบหลักคือไฟล์
template.html และสคริปต์ render.py โดยเขียนบทความด้วย Markdown เพื่อเรนเดอร์ทุกหน้าแบบอัตโนมัติ
- ใช้ไลบรารี Python
markdown2 เพื่อทำให้การแปลง Markdown → HTML และการสร้างหน้าเว็บเป็นอัตโนมัติ
- เน้นโครงสร้างที่เพิ่มคอนเทนต์ได้อย่างง่ายดาย พร้อมทั้งยังคงสอดคล้องกับ SEO และ มาตรฐานเว็บสมัยใหม่
ข้อกำหนดของบล็อก
- ต้องใช้โดเมนที่เป็นเจ้าของอยู่แล้ว
- คงความเป็นมิตรต่อมาตรฐานเว็บสมัยใหม่และ SEO
- ต้องเพิ่มบทความได้ง่ายมาก
- ทุกหน้าต้องถูกสร้างแบบสแตติก
สรุปขั้นตอนการทำงาน
- เขียนไฟล์
template.html → จัดวางเลย์เอาต์ HTML พื้นฐาน
- ติดตั้งเครื่องมือเรนเดอร์ Markdown ด้วยคำสั่ง
pip install markdown2
- ขอให้
O1 ช่วยสร้างสคริปต์ Python สำหรับการเรนเดอร์ (render.py)
- เขียนโพสต์ในโฟลเดอร์
posts/ ในรูปแบบ eng.md
- รัน
render.py เพื่อแปลงเป็น HTML และสร้างโฟลเดอร์ผลลัพธ์
เทมเพลต HTML หลัก (template.html)
- โครงสร้าง HTML เรียบง่ายและมินิมอล โดยแทรกผลลัพธ์จากการเรนเดอร์ Markdown ไว้ที่
{{ content }}
- CSS ใช้ฟอนต์แบบ
system-ui, padding แบบปรับตามขนาดหน้าจอ, การตั้งค่า color-scheme ฯลฯ เพื่อให้อ่านง่าย
สคริปต์ Python สำหรับเรนเดอร์หลัก (render.py)
- ใช้
markdown2 เพื่อแปลงโพสต์ Markdown แต่ละรายการเป็น HTML
- ระหว่างแปลง จะแทนที่พาธ
<img> เป็น /posts/{post_code}/ โดยอัตโนมัติ
- ชื่อหัวข้อ HTML จะดึงมาจาก
# 헤더 ใน Markdown
index.html ประกอบด้วย greetings.md + รายการชื่อโพสต์แต่ละรายการ- ผลลัพธ์จะถูกบันทึกเป็นไฟล์
.html ในโฟลเดอร์ ./blog/
5 ความคิดเห็น
ตอนนี้ผมก็จัดการบล็อกของตัวเองแบบเดียวกับด้านบนเลยครับ ผมสร้างและใช้งาน SSG ที่ตอบโจทย์ความต้องการส่วนตัวของตัวเอง โดยเพิ่มฟังก์ชันคัสตอมทีละอย่างเพื่อให้ใช้ความสามารถอย่างรูปภาพ thumbnail, หมวดหมู่ และแท็กได้ด้วย รูปภาพที่แนบมาก็ถูกแปลงเป็น webp โดยอัตโนมัติแล้วอ้างอิงใช้งาน ทำให้ความเร็วในการเรนเดอร์น่าพอใจมากครับ
โอ้ ฟีเจอร์แบบคัสตอมพวกนั้นคุณค่อย ๆ เขียนโค้ดเพิ่มเองโดยตรงใช่ไหมครับ? ผมเองก็คิดจะทำแบบ DIY อยู่เสมอเหมือนกัน แต่ก็มักลังเลเพราะฟังก์ชันการขยายความสามารถและปลั๊กอินที่เฟรมเวิร์กบล็อกแบบ SSG ที่เคยใช้งานอยู่มีมาให้นี่แหละครับ
ถ้าตัดความโลภออกไปได้ แค่ตัดความอยากได้อยากมีออกไป ที่เหลือก็ไม่ได้ยากอะไรมาก จริง ๆ แล้วถ้าขอให้ AI เขียนโค้ดให้
ssgก็เขียนให้ได้หมด และถ้าขอให้เพิ่มฟีเจอร์ ก็เพิ่มให้ได้หมดเหมือนกัน 555ถ้าเลือกแค่ฟอนต์ที่สวย ๆ มันก็ดูน่าอ่านขึ้นมาเลยครับ
ความคิดเห็นจาก Hacker News
ตอนเริ่มทำบล็อกใช้ SSG แต่สุดท้ายเปลี่ยนไปใช้ WordPress ทำให้มีอิสระมากขึ้น
องค์ประกอบสองอย่างที่จำเป็นเพื่อให้มีคุณสมบัติเป็นบล็อก
ความรักที่มีต่อเว็บไซต์อิสระ
อยากให้เบราว์เซอร์รองรับ
text/markdownและtext/geminiแบบเนทีฟมีการชี้ถึงบั๊กที่ทำให้สตริง "Minimum viable blog" ถูกแทนที่ด้วยชื่อโพสต์
เคยทำบล็อกด้วยหน้า HTML แบบเรียบง่าย แต่ตอนนี้ใช้ Astro เพื่อทำเว็บไซต์ที่พัฒนาขึ้นกว่าเดิม
การทดลองกับ Bun JS และการใช้ HTML เป็นสตริงใน JS
ทริกบางอย่างที่ได้เรียนรู้จากการทดลองทำบล็อกแบบมินิมัลมา 15 ปี
ความง่ายของเฟรมเวิร์กบล็อกแบบสแตติกมาตรฐานที่ใช้ Hugo/Zola และ Cloudflare Pages
ระหว่างการชุบชีวิตบล็อกเก่าก็ได้พบกับความไม่สะดวกของ Hexo