81 lines
4.2 KiB
Markdown
81 lines
4.2 KiB
Markdown
# 🚀 เทมเพลตเว็บไซต์องค์กร (Organizational Website Template)
|
|
|
|
> **เว็บไซต์องค์กร**
|
|
> เว็บไซต์ข่าวสารและประชาสัมพันธ์ขององค์กร นำเสนอข้อมูลอัปเดตเกี่ยวกับกิจกรรม นวัตกรรม และเรื่องราวดี ๆ ที่เราอยากบอกต่อ ทั้งในภาษาไทยและภาษาอังกฤษ
|
|
|
|
---
|
|
|
|
## ✨ คุณสมบัติหลัก
|
|
|
|
- 🔖 **ข่าวสารตามหมวดหมู่** เช่น ข่าวประชาสัมพันธ์, ข่าวบริการประชาชน, ข่าวนวัตกรรม
|
|
- 🌟 **ข่าวเด่น (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://github.com/your-username/your-repo-name.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 ได้เลยครับ! |