Fuwari-Blog/docs/README.th.md

🍥Fuwari

แม่แบบสำหรับเว็บบล็อกแบบ static สร้างด้วย Astro

🖥️ ตัวอย่างการใช้งานจริง (Vercel)

✨ คุณสมบัติ

• สร้างด้วย Astro และ Tailwind CSS
• มีอนิเมชั่นและการเปลี่ยนหน้าอย่างลื่นไหล
• รองรับโหมดสว่าง / โหมดมืด
• ปรับแต่งสีธีมและแบนเนอร์ได้
• Responsive design (หน้าตาเว็บปรับเปลี่ยนตามขนาดจอ)
• การแสดงความคิดเห็น
• การค้นหา
• TOC (สารบัญ)

จำเป็นต้อง

• Node.js <= 22
• pnpm <= 9

🚀 วิธีใช้งาน 1

เริ่มต้นโปรเจ็กต์ในเครื่องโดยใช้ create-fuwari

# npm
npm create fuwari@latest

# yarn
yarn create fuwari

# pnpm
pnpm create fuwari@latest

# bun
bun create fuwari@latest

# deno
deno run -A npm:create-fuwari@latest

1. แก้ไขไฟล์การตั้งค่า src/config.ts เพื่อปรับแต่งบล็อกของคุณ
2. รันคำสั่ง pnpm new-post <filename> เพื่อสร้างโพสต์ใหม่ใน src/content/posts/ และแก้ไขไฟล์โพสต์นั้นๆ ให้สมบูรณ์
3. Deploy เว็บบล็อกของคุณไปยัง Vercel, Netlify, GitHub Pages หรือบริการอื่นๆ โดยอ้างอิงวิธีการจากคู่มือนี้ อย่าลืมแก้ไขการตั้งค่าเว็บไซต์ในไฟล์ astro.config.mjs ก่อนที่คุณจะ deploy เว็บ

🚀 วิธีใช้งาน 2

1. Generate repository ใหม่ขึ้นมาจากแม่แบบนี้ หรือจะ fork repository นี้ก็ได้
2. เริ่มแก้ไขบล็อกของคุณแบบ local โดยการ clone repository ของคุณ (จากข้อ 1) ไว้ในเครื่องของคุณ แล้วรันคำสั่ง pnpm install และ pnpm add sharp เพื่อติดตั้ง dependencies ที่จำเป็น
   • ติดตั้ง pnpm ด้วยคำสั่ง npm install -g pnpm ถ้ายังไม่เคยติดตั้ง
3. แก้ไขไฟล์การตั้งค่า src/config.ts เพื่อปรับแต่งบล็อกของคุณ
4. รันคำสั่ง pnpm new-post <filename> เพื่อสร้างโพสต์ใหม่ใน src/content/posts/ และแก้ไขไฟล์โพสต์นั้นๆ ให้สมบูรณ์
5. Deploy เว็บบล็อกของคุณไปยัง Vercel, Netlify, GitHub Pages หรือบริการอื่นๆ โดยอ้างอิงวิธีการจากคู่มือนี้ อย่าลืมแก้ไขการตั้งค่าเว็บไซต์ในไฟล์ astro.config.mjs ก่อนที่คุณจะ deploy เว็บ

⚙️ Frontmatter ของโพสต์

---
title: โพสต์แรกของฉัน
published: 2023-09-09
description: นี่คือโพสต์แรกของเว็บบล็อก Astro อันใหม่ของฉัน
image: ./cover.jpg
tags: [Foo, Bar]
category: Front-end
draft: false
lang: jp      # เขียนค่านี้เมื่อภาษาของโพสต์นั้นๆ แตกต่างจากภาษาของเว็บไซต์ที่ตั้งค่าไว้ใน `config.ts` เท่านั้น
---

🧞 คำสั่ง

คำสั่งที่รันได้ใน terminal จาก root ของโปรเจค:

คำสั่ง	ผลที่เกิด
pnpm install และ pnpm add sharp	ติดตั้ง dependencies
pnpm dev	เปิดเซิร์ฟเวอร์เพื่อพัฒนาเว็บแบบ local ที่ localhost:4321
pnpm build	Build เว็บไซต์แบบพร้อมใช้งานจริงไปยังโฟลเดอร์ ./dist/
pnpm preview	ดูตัวอย่าง build ของคุณแบบ local ก่อนที่จะ deploy จริง
pnpm new-post <filename>	สร้างโพสต์ใหม่
pnpm astro ...	รันคำสั่ง CLI เช่น astro add, astro check
pnpm astro --help	ดูข้อมูลเพิ่มเติมเกี่ยวกับ Astro CLI