85 lines
4.5 KiB
Markdown

# 🚀 เทมเพลตเว็บไซต์องค์กร (Organizational Website Template)
> **เว็บไซต์องค์กร**
> เว็บไซต์ข่าวสารและประชาสัมพันธ์ขององค์กร นำเสนอข้อมูลอัปเดตเกี่ยวกับกิจกรรม นวัตกรรม และเรื่องราวดี ๆ ที่เราอยากบอกต่อ ทั้งในภาษาไทยและภาษาอังกฤษ
ทั้งนี้สามารถทดสอบการทำงานได้ที่ https://humantech.softwarecraft.tech
---
## ✨ คุณสมบัติหลัก
- 🔖 **ข่าวสารตามหมวดหมู่** เช่น ข่าวประชาสัมพันธ์, ข่าวบริการประชาชน, ข่าวนวัตกรรม
- 🌟 **ข่าวเด่น (Feature Story)**: เรื่องราวดี ๆ ที่น่าสนใจและสร้างแรงบันดาลใจ
- 🌐 **รองรับหลายภาษา**: ภาษาไทย และภาษาอังกฤษ
- 📰 **หน้าแสดงข่าวรายละเอียด**: พร้อมรูปภาพและเนื้อหาฉบับเต็ม
- 📱 **Responsive Design**: แสดงผลได้ทุกอุปกรณ์ (มือถือ แท็บเล็ต คอมพิวเตอร์)
- ⚙️ **จัดการสถานะด้วย Pinia Store**
- 📦 **Component-based**: ใช้โครงสร้างที่จัดระเบียบดี พร้อมนำกลับมาใช้ซ้ำ
---
## 🛠️ เทคโนโลยีที่ใช้
| เทคโนโลยี | รายละเอียด |
|-----------|-------------|
| [Vue 3](https://vuejs.org/) | JavaScript Framework |
| [Vite](https://vitejs.dev/) | Frontend Build Tool ที่รวดเร็ว |
| [Pinia](https://pinia.vuejs.org/) | State Management |
| [Vue Router](https://router.vuejs.org/) | Routing สำหรับ SPA |
| [Tailwind CSS](https://tailwindcss.com/) | Utility-first CSS Framework |
| JavaScript (ESNext) | ใช้ Feature ใหม่ของ ECMAScript |
---
## 🚀 วิธีติดตั้งและใช้งาน
### 🧩 ข้อกำหนดเบื้องต้น
- ติดตั้ง [Node.js](https://nodejs.org/) (แนะนำเวอร์ชัน LTS)
- ติดตั้ง npm หรือ yarn
### 📥 ติดตั้งโปรเจกต์
```bash
git clone https://gitea.softwarecraft.tech/gitea/vue_website_template.git
cd your-repo-name
npm install
```
### ▶️ เริ่มต้น Development Server
```bash
npm run dev
```
## 📁 โครงสร้างโปรเจกต์
```bash
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)**
```markdown
## 🤝 การมีส่วนร่วม
ยินดีต้อนรับทุกการมีส่วนร่วม 🎉
หากคุณพบปัญหา, มีข้อเสนอแนะ หรืออยากพัฒนาเพิ่ม
สามารถแจ้งได้ที่ admin@softwarecraft.tech ได้เลยครับ!
```
## 🚀 Todo
> แก้ไข Known Issue ที่เกิดจากการใช้ flipbook-vue ที่จะค้างเมื่อเปิดหน้าถัดไป