Demo

Xem demo và hướng dẫn nhanh về Smart Forecast.

---

Video Demo

Coming Soon

Video demo đang được chuẩn bị. Vui lòng quay lại sau!

---

Screenshots

Web Dashboard

Dashboard chính

Trang Dashboard tổng quan - Hiển thị thông tin tổng hợp về trạm, cảnh báo, sự cố và chỉ số AQI

Quản lý cảnh báo

Danh sách cảnh báo

Chi tiết cảnh báo

Bản đồ hiển thị vị trí các cảnh báo

Quản lý sự cố (Incidents)

Quản lý sự cố từ người dân

Thống kê sự cố

Bản đồ hiển thị vị trí các sự cố

Quản lý trạm quan trắc (Stations)

Danh sách trạm quan trắc

Tạo trạm mới

So sánh dữ liệu giữa các trạm

Biểu đồ và dữ liệu

Biểu đồ dữ liệu môi trường

Lịch sử dữ liệu theo thời gian

Ứng dụng di động (Mobile App)

Onboarding & Đăng nhập

Giới thiệu theo dõi thời tiết

Giới thiệu cảnh báo

Giới thiệu báo cáo sự cố

Trang chủ & Đăng nhập

Đăng nhập Google

Trang chủ - Thời tiết

Trang chủ - Dự báo

Báo cáo sự cố & Bản đồ

Form báo cáo sự cố

Danh sách sự cố

Bản đồ cảnh báo

Bản đồ, Thông báo & Hồ sơ

Chi tiết cảnh báo

Cài đặt thông báo

Hồ sơ cá nhân

---

Quick Demo

Chạy demo local

# Clone repository
git clone https://github.com/NEU-DataVerse/Smart-Forecast.git
cd Smart-Forecast

# Setup
pnpm install
pnpm run build:shared

# Start Docker services
docker compose up -d

# Seed database (tạo dữ liệu mẫu)
cd backend
npm run seed:force
cd ..

# Start all apps
# Terminal 1
pnpm run dev:backend    # http://localhost:8000

# Terminal 2
pnpm run dev:web        # http://localhost:3000

# Terminal 3
pnpm run dev:mobile     # Expo DevTools

Seed Database Options

Command	Mô tả
npm run seed	Seed nếu DB rỗng
npm run seed:force	Force reseed (xóa và seed lại tất cả)
npm run seed:base	Seed base data (không có fake weather/air-quality)
npm run seed:base:force	Force reseed base data
npm run seed:clear	Xóa tất cả dữ liệu

Sử dụng dữ liệu thật từ OpenWeatherMap

Nếu muốn sử dụng dữ liệu thật thay vì fake data:

# 1. Seed base data (users, stations, incidents, alerts)
npm run seed:base:force

# 2. Vào Dashboard web → "Thu thập dữ liệu lịch sử" để lấy data thật

Lưu ý: Historical Weather API của OpenWeatherMap yêu cầu paid subscription. Historical Air Quality API là miễn phí. :::

Demo accounts

Role	Email	Password	Provider
Admin	admin@smartforecast.com	admin123	local
User	user@test.com	(OAuth)	google
Demo	demo@smartforecast.com	demo123	local

note

Các tài khoản demo được tạo tự động khi chạy npm run seed trong backend. Trong production, bạn cần tạo tài khoản mới.

Trạm quan trắc mẫu

Hệ thống seed tự động tạo 4 trạm quan trắc tại Hà Nội:

Tên trạm	Mã	Vị trí	Độ ưu tiên
Hoàn Kiếm	HN-HK-001	Trung tâm	HIGH
Hà Đông	HN-HD-001	Phía Tây	MEDIUM
Cầu Giấy	HN-CG-001	Khu đại học	HIGH
Long Biên	HN-LB-001	Ven sông	MEDIUM

---

Quick Links

API Demo

# Get current weather
curl http://localhost:8000/api/v1/weather/current

# Get air quality
curl http://localhost:8000/api/v1/air-quality/current

# Check health
curl http://localhost:8000/api/v1/health

Swagger API Docs

Sau khi start backend, truy cập:

• http://localhost:8000/api

MinIO Console

Quản lý file storage:

• http://localhost:9001
• Login: minioadmin / minioadmin

---

Mobile Demo

Expo Go

1. Cài đặt Expo Go trên điện thoại
2. Chạy pnpm run dev:mobile
3. Quét QR code

Lưu ý

• Mobile cần kết nối cùng WiFi với máy development
• Sử dụng IP máy, không dùng localhost
• Đảm bảo firewall cho phép port 8000

---

Tính năng demo

Người dân (Citizen)

1. ✅ Xem thời tiết real-time
2. ✅ Xem chất lượng không khí
3. ✅ Nhận thông báo cảnh báo
4. ✅ Báo cáo sự cố (chụp ảnh, GPS)
5. ✅ Theo dõi trạng thái báo cáo

Admin/Manager

1. ✅ Dashboard tổng quan
2. ✅ Bản đồ trạm quan trắc
3. ✅ Quản lý cảnh báo
4. ✅ Xử lý sự cố từ người dân
5. ✅ Xem dữ liệu lịch sử
6. ✅ Xuất báo cáo

---

Tiếp theo

• Bắt đầu - Hướng dẫn cài đặt chi tiết
• Hướng dẫn sử dụng - User guide
• API Documentation - REST API endpoints