goulven clech.dev ดาวน์โหลด - goulven clech.dev ดาวน์โหลดซอร์สโค้ด

goulven clech.dev

หมวดหมู่อื่นๆ

v1.4.1: Refreshed design

ดาวน์โหลด

บล็อกส่วนตัวของฉัน สร้างด้วย Astro, TypeScript และ Tailwind CSS ถ่ายทอดสดที่ goulven-clech.dev ซึ่งจัดโดย Vercel

ซอร์สโค้ดมีให้ภายใต้ใบอนุญาต 0BSD การแสดงที่มานั้นได้รับการชื่นชม แต่ไม่จำเป็น เนื้อหาต้นฉบับของบล็อกมีให้ภายใต้โฉนด CC BY 4.0 โดยต้องมีการแสดงที่มา แต่สำหรับทั้งสองอย่าง คุณมีอิสระที่จะใช้ คัดลอก แก้ไข และ/หรือแจกจ่ายเพื่อวัตถุประสงค์ใดๆ ก็ตาม ในเชิงพาณิชย์หรือส่วนบุคคล

ผลงานบางรายการอาจอ้างอิงข้อความ รูปภาพ หรือแหล่งข้อมูลจากแหล่งภายนอก: มีใบอนุญาตต้นฉบับ และหากทราบ ข้าพเจ้าจะระบุผู้เขียนด้วย

คุณสมบัติเด่น

โดยพื้นฐานแล้ว โปรเจ็กต์นี้ดูเหมือนบล็อกใดๆ ที่สร้างด้วย Astro คุณสามารถเริ่มต้นด้วยการอ่านบทความของฉัน "เปิดตัวบล็อกด้วย Astro" แต่ทีละเล็กทีละน้อย ฉันได้เพิ่มคุณสมบัติดั้งเดิมบางอย่างที่คุณอาจสนใจ นี่คือคุณสมบัติหลัก:

แถบค้นหา: สร้างขึ้นด้วย Astro และ Web Components เท่านั้น กรองรายการบล็อกตามอินพุตของผู้ใช้
สารบัญ: ใช้ Astro และ MDX สร้างสารบัญตามหัวข้อ ด้วยรายการที่ซ้อนกัน
เปิดไลบรารีและบล็อก Google Maps: แสดงผล API ในรายการบล็อกอย่างสวยงาม
โหมดมืด: สลับระหว่างโทนสีสว่าง สีเข้ม และระบบสี ใช้ที่จัดเก็บในตัวเครื่องเพื่อยืนยันตัวเลือกของผู้ใช้
บริการรูปภาพแบบกำหนดเอง: ดึงมาจากบล็อกของ Erika เพิ่มประสิทธิภาพและแสดงตัวยึดตำแหน่งระหว่างการโหลดรูปภาพ

โครงสร้างโครงการ

 /
├── src/
│   ├── content/ -> Sub repository
│   ├── assets/
│   │   └── base.css
│   ├── components/
│   │   └── Card.astro
│   ├── layouts/
│   │   └── Layout.astro
│   ├── pages/
│   │   └── index.astro
│   ├── env.d.ts
│   └── [...utils].ts
├── public/
│   └── Iosevka-Regular.woff2
├── [... config files]
├── README.md
└── package.json

pages/ ประกอบด้วยทุกหน้าของบล็อกนี้เป็นไฟล์ .astro

layouts/ และ components/ มีทุกองค์ประกอบของเว็บเป็นไฟล์ `.astro``

คำสั่ง

สั่งการ	การกระทำ
`pnpm install`	ติดตั้งการพึ่งพา
`pnpm run dev`	เริ่มเซิร์ฟเวอร์ dev ภายในเครื่องที่ `localhost:3000`
`pnpm run build`	สร้างไซต์การผลิตของคุณเป็น `./dist/`
`pnpm run preview`	ดูตัวอย่างงานสร้างของคุณภายในเครื่องก่อนที่จะปรับใช้
`pnpm run astro ...`	รันคำสั่ง CLI เช่น `astro add` , `astro check`
`pnpm run astro --help`	รับความช่วยเหลือในการใช้ Astro CLI