4.2 KiB
4.2 KiB
🚀 เทมเพลตเว็บไซต์องค์กร (Organizational Website Template)
เว็บไซต์องค์กร
เว็บไซต์ข่าวสารและประชาสัมพันธ์ขององค์กร นำเสนอข้อมูลอัปเดตเกี่ยวกับกิจกรรม นวัตกรรม และเรื่องราวดี ๆ ที่เราอยากบอกต่อ ทั้งในภาษาไทยและภาษาอังกฤษ
✨ คุณสมบัติหลัก
- 🔖 ข่าวสารตามหมวดหมู่ เช่น ข่าวประชาสัมพันธ์, ข่าวบริการประชาชน, ข่าวนวัตกรรม
- 🌟 ข่าวเด่น (Feature Story): เรื่องราวดี ๆ ที่น่าสนใจและสร้างแรงบันดาลใจ
- 🌐 รองรับหลายภาษา: ภาษาไทย และภาษาอังกฤษ
- 📰 หน้าแสดงข่าวรายละเอียด: พร้อมรูปภาพและเนื้อหาฉบับเต็ม
- 📱 Responsive Design: แสดงผลได้ทุกอุปกรณ์ (มือถือ แท็บเล็ต คอมพิวเตอร์)
- ⚙️ จัดการสถานะด้วย Pinia Store
- 📦 Component-based: ใช้โครงสร้างที่จัดระเบียบดี พร้อมนำกลับมาใช้ซ้ำ
🛠️ เทคโนโลยีที่ใช้
| เทคโนโลยี | รายละเอียด |
|---|---|
| Vue 3 | JavaScript Framework |
| Vite | Frontend Build Tool ที่รวดเร็ว |
| Pinia | State Management |
| Vue Router | Routing สำหรับ SPA |
| Tailwind CSS | Utility-first CSS Framework |
| JavaScript (ESNext) | ใช้ Feature ใหม่ของ ECMAScript |
🚀 วิธีติดตั้งและใช้งาน
🧩 ข้อกำหนดเบื้องต้น
- ติดตั้ง Node.js (แนะนำเวอร์ชัน LTS)
- ติดตั้ง npm หรือ yarn
📥 ติดตั้งโปรเจกต์
git clone https://github.com/your-username/your-repo-name.git
cd your-repo-name
npm install
▶️ เริ่มต้น Development Server
npm run dev
📁 โครงสร้างโปรเจกต์
project/
├── public/ # ไฟล์ static (เช่น logo, favicon)
├── src/
│ ├── assets/ # ไฟล์ภาพ/ไอคอน/ฟอนต์
│ ├── components/ # Vue components เช่น NewsItem, Tabs
│ ├── router/ # การตั้งค่า Routing (Vue Router)
│ ├── stores/ # Pinia stores (จัดการสถานะ)
│ ├── views/ # หน้าแสดงผล เช่น HomeView, NewsView
│ └── main.js # Entry Point ของแอป
├── vite.config.js # การตั้งค่า Vite
├── .gitignore # ไฟล์ที่ Git จะไม่ติดตาม
└── README.md # ไฟล์คำอธิบายโปรเจกต์นี้
📄 License
MIT License© 2025 softwarecraft.tech
การมีส่วนร่วม (Contributing)
## 🤝 การมีส่วนร่วม
ยินดีต้อนรับทุกการมีส่วนร่วม 🎉
หากคุณพบปัญหา, มีข้อเสนอแนะ หรืออยากพัฒนาเพิ่ม
สามารถแจ้งได้ที่ admin@softwarecraft.tech ได้เลยครับ!