# IPv6 Summit 2026 — Hệ Thống Website Chính Thức

> **IPv6 for AI & Data Centre Summit 2026** — Hội nghị quốc tế về hạ tầng IPv6 cho AI và Trung tâm Dữ liệu khu vực ASEAN. Website được xây dựng với Next.js 16, TypeScript, Tailwind CSS v4 và hỗ trợ song ngữ Anh–Việt hoàn chỉnh.

---

## ✨ Tổng Quan

Website phục vụ toàn bộ vòng đời của sự kiện: từ trang giới thiệu hội nghị, đăng ký tham dự, thu thập phản hồi (feedback), trưng bày nhà tài trợ, đến bảng quản trị dành riêng cho ban tổ chức. Toàn bộ nội dung được lưu trữ trong các file JSON riêng biệt theo ngôn ngữ, giúp dễ dàng cập nhật mà không cần sửa code.

---

## 🚀 Tính Năng Nổi Bật

| Tính năng | Mô tả |
|---|---|
| 🌐 **Song ngữ (EN / VI)** | Chuyển đổi ngôn ngữ tức thì, mọi nhãn và nội dung đều được Việt hoá hoàn toàn |
| 📋 **Form Đăng Ký** | Đăng ký tham dự hội nghị, lưu trữ vào MongoDB |
| 💬 **Form Phản Hồi** | Đánh giá sự kiện chi tiết sau khi tham dự |
| 🏢 **Trang Nhà Tài Trợ** | Giới thiệu các đối tác và nhà tài trợ của hội nghị |
| 🗂️ **Admin Console** | Bảng quản trị xem, duyệt, từ chối hồ sơ đăng ký; xuất Excel |
| 🔐 **Bảo Mật Admin** | HTTP Basic Auth tuỳ chỉnh cho khu vực `/admin` |
| 📱 **Responsive** | Tối ưu hiển thị trên mọi thiết bị từ mobile đến desktop |
| 🎨 **Premium UI** | Glassmorphism, gold gradient, Material Symbols, micro-animations |
| 🗄️ **MongoDB** | Lưu trữ và truy vấn hồ sơ đăng ký/phản hồi theo thời gian thực |

---

## 🛠️ Công Nghệ Sử Dụng

- **Framework**: Next.js 16 (App Router)
- **Language**: TypeScript 5
- **Styling**: Tailwind CSS v4 + SCSS (custom design tokens)
- **Database**: MongoDB (Mongoose v9)
- **Icons**: Google Material Symbols (Outlined)
- **Font**: Inter (Google Fonts)
- **Containerization**: Docker + Docker Compose
- **HTTP Client**: Axios

---

## 📁 Cấu Trúc Thư Mục

```
├── app/
│   ├── (site)/                   # Các trang công khai
│   │   ├── page.tsx              # Trang chủ
│   │   ├── registration/         # Form đăng ký tham dự
│   │   ├── feedback/             # Form phản hồi sau sự kiện
│   │   └── sponsor/              # Trang nhà tài trợ
│   ├── (internal)/
│   │   └── admin/                # Bảng quản trị (yêu cầu xác thực)
│   │       ├── page.tsx          # Dashboard tổng hợp
│   │       ├── pending/          # Danh sách chờ duyệt
│   │       ├── approved/         # Danh sách đã duyệt
│   │       └── rejected/         # Danh sách từ chối
│   ├── api/                      # API Routes (Next.js)
│   ├── components/
│   │   ├── home/                 # Hero, Stats, Vision, Agenda sections
│   │   ├── admin/                # AdminConsole component
│   │   ├── forms/                # RegistrationForm, FeedbackForm
│   │   ├── layout/               # Header, Footer
│   │   ├── sponsor/              # Sponsor components
│   │   └── ui/                   # Shared UI primitives
│   ├── context/                  # LanguageContext (EN/VI)
│   ├── data/                     # JSON content files (song ngữ)
│   │   ├── admin.json / admin.vi.json
│   │   ├── home.json  / home.vi.json
│   │   ├── registration.json / registration.vi.json
│   │   ├── feedback.json / feedback.vi.json
│   │   ├── sponsor.json / sponsor.vi.json
│   │   └── site.json  / site.vi.json
│   ├── hooks/                    # useTranslation hook
│   └── layout.tsx                # Root layout
├── models/
│   └── SummitRequest.ts          # Mongoose schema
├── lib/
│   └── mongodb.ts                # Kết nối MongoDB
├── scripts/
│   └── seed-summit-requests.ts   # Seed dữ liệu mẫu
├── types/
│   └── admin-submission.ts       # TypeScript types
├── middleware.ts                  # HTTP Basic Auth cho /admin
├── Dockerfile
├── docker-compose.yml
└── .env.example
```

---

## ⚙️ Hướng Dẫn Cài Đặt

### Yêu Cầu Hệ Thống

- **Node.js** 18+
- **MongoDB** 6+ (local hoặc Atlas)
- npm / yarn / pnpm

### 1. Clone & Cài Dependencies

```bash
git clone <repository-url>
cd IPV6

npm install
```

### 2. Cấu Hình Môi Trường

Sao chép file `.env.example` thành `.env.local` và điền các giá trị:

```bash
cp .env.example .env.local
```

```env
# MongoDB — lưu trữ hồ sơ đăng ký và phản hồi
MONGODB_URI=mongodb://localhost:27017/ipv6_summit

# URL công khai (tuỳ chọn)
NEXT_PUBLIC_BASE_URL=http://localhost:3000

# Bảo vệ trang Admin bằng HTTP Basic Auth (tuỳ chọn)
ADMIN_BASIC_AUTH_USER=admin
ADMIN_BASIC_AUTH_PASS=your_password
```

### 3. Seed Dữ Liệu Mẫu (Tuỳ chọn)

```bash
npm run db:seed
```

### 4. Chạy Development Server

```bash
npm run dev
```

Truy cập [http://localhost:3000](http://localhost:3000) để xem website.
Truy cập [http://localhost:3000/admin](http://localhost:3000/admin) để vào bảng quản trị.

---

## 📜 Scripts

```bash
npm run dev           # Chạy development server (Next.js Turbopack)
npm run build         # Build production
npm run start         # Chạy production server
npm run lint          # Kiểm tra ESLint
npm run db:seed       # Seed dữ liệu mẫu vào MongoDB
npm run scss:build    # Compile SCSS → CSS (một lần)
npm run scss:watch    # Compile SCSS → CSS (watch mode)
```

---

## 🐳 Chạy Với Docker

### Development

```bash
# Build và chạy toàn bộ stack (Next.js + MongoDB)
docker-compose up --build

# Chạy ở background
docker-compose up -d

# Dừng
docker-compose down
```

### Production

```bash
# Build production image
docker build -t ipv6-summit .

# Chạy container
docker run -p 3000:3000 --env-file .env.local ipv6-summit
```

---

## 🌐 Hệ Thống Đa Ngôn Ngữ (i18n)

Dự án sử dụng kiến trúc i18n tự xây dựng (không phụ thuộc thư viện bên ngoài):

- **`LanguageContext`** (`app/context/`) — quản lý trạng thái ngôn ngữ toàn cục (`en` | `vi`).
- **`useTranslation` hook** (`app/hooks/`) — load nội dung JSON tương ứng với ngôn ngữ hiện tại.
- **File JSON song ngữ** — mỗi module có 2 file: `*.json` (EN) và `*.vi.json` (VI).

Để thêm nội dung mới, chỉ cần cập nhật cả hai file JSON song ngữ tương ứng.

---

## 🗄️ Database Schema

Collection `summitrequest` (MongoDB):

| Trường | Kiểu | Mô tả |
|---|---|---|
| `publicId` | String | ID công khai (ví dụ: `V6-4821`) |
| `fullName` | String | Họ và tên người đăng ký |
| `jobTitle` | String | Chức vụ |
| `company` | String | Công ty / Tổ chức |
| `email` | String | Địa chỉ email |
| `phone` | String | Số điện thoại |
| `segment` | String | Phân khúc (`tier1`, `cloud`, `enterprise`) |
| `status` | String | Trạng thái (`pending`, `approved`, `rejected`) |
| `source` | String | Nguồn gốc (`registration`, `feedback`) |
| `notes` | String | Ghi chú hoặc nội dung phản hồi |
| `submittedAt` | String | Ngày nộp hồ sơ |

---

## 🔒 Bảo Mật Admin

Khu vực `/admin` được bảo vệ thông qua `middleware.ts` bằng HTTP Basic Auth. Để kích hoạt, thiết lập hai biến môi trường:

```env
ADMIN_BASIC_AUTH_USER=admin
ADMIN_BASIC_AUTH_PASS=your_secure_password
```

Nếu không thiết lập, trang Admin vẫn truy cập được (phù hợp cho môi trường development nội bộ).

---

## 📝 Cập Nhật Nội Dung

Mọi nội dung văn bản đều được tách biệt khỏi code và lưu trong `app/data/`. Để thay đổi nội dung:

1. Mở file JSON tương ứng (ví dụ: `app/data/home.vi.json`)
2. Chỉnh sửa giá trị cần thay đổi
3. Lưu file — Next.js sẽ tự động hot-reload

**Không cần sửa code TypeScript/TSX** khi chỉ thay đổi nội dung văn bản.

---

## 🚀 Triển Khai (Deployment)

### Vercel (Khuyến nghị)

1. Push code lên GitHub / GitLab
2. Kết nối repository với [Vercel](https://vercel.com)
3. Thêm biến môi trường `MONGODB_URI` trong Vercel dashboard
4. Deploy tự động mỗi khi push lên `main`

### VPS / Server (PM2)

```bash
npm run build
pm2 start npm --name "ipv6-summit" -- start
```

### Docker Compose (Production)

```bash
docker-compose -f docker-compose.yml up -d --build
```

---

## 📱 Responsive Breakpoints

| Màn hình | Kích thước |
|---|---|
| Mobile | < 768px |
| Tablet | 768px – 1024px |
| Laptop | 1024px – 1440px |
| Desktop | > 1440px |

---

## 🤝 Đóng Góp

1. Fork repository
2. Tạo feature branch: `git checkout -b feature/ten-tinh-nang`
3. Commit: `git commit -m 'feat: mô tả thay đổi'`
4. Push: `git push origin feature/ten-tinh-nang`
5. Tạo Pull Request vào nhánh `main`

---

## 📄 License

MIT License — xem file [LICENSE](LICENSE) để biết thêm chi tiết.

---

**Dự án**: IPv6 Summit 2026 — Official Website  
**Công nghệ**: Next.js 16 · TypeScript · Tailwind CSS v4 · MongoDB  
**Phiên bản**: 0.1.0  
**Cập nhật**: Tháng 5, 2026