vibe.j2team.org

Sẽ thế nào nếu cả nhóm J2TEAM Community vibe code cùng nhau?

Trang chủ là một Launcher, dẫn link tới các trang con do thành viên tạo ra. Mọi người tự do vibe code thoải mái trên trang của mình!

Tech Stack

Vue 3 - Progressive JavaScript Framework
TypeScript - JavaScript với static typing
Vite - Build tool thế hệ mới
Tailwind CSS - Utility-first CSS framework
Vue Router - Routing
Pinia - State management
VueUse - 200+ composables cho Vue
Iconify - 200,000+ icons từ 150+ bộ icon

Trang nổi bật

| Trang | Mô tả | Tác giả | |-------|-------|---------| | Project 42 | Where does everything begin? | sanghynh | | Cờ Tướng Online | Cờ Tướng P2P với webcam — chơi online qua WebRTC, có chế độ xem | hwg | | Cuộc sống hàng ngày của AI | Mô tả cuộc sống của AI bằng giao diện pixel | ngducnhatt | | Gạch Bông đi cảnh | Game nối gạch bông truyền thống — Relaxing Music Video | hidang | | CanChi | Lá số Tử Vi Đẩu Số — lập lá số theo ngày tháng năm sinh | duckocancode | | What if? | Tương lai là muôn vàn ngã rẽ và lựa chọn, nếu là bạn, bạn sẽ chọn con đường nào? | Nhật ký học tập của Khang - KBOT | | Đập Bug | Đập bug để giải tỏa áp lực coding! Đập càng nhanh, vibe càng cao | Jimmy Trần | | Flash Card | Học từ vựng hoặc kiến thức mới với thẻ ghi nhớ | ldblckrs-258 | | Resume Builder | Soạn thảo CV bằng Markdown và xem preview đẹp real-time | Nguyen Hoang Thong | | Piano ảo | Chơi đàn piano ngay trên trình duyệt — dùng chuột hoặc bàn phím | Dinh San |

Xem thêm...

Bắt đầu

pnpm install
pnpm dev

Nguyên tắc

Không có database — dự án không sử dụng database
Luôn có link về trang chủ — mỗi trang con phải có link quay lại trang chủ
Ngôn ngữ: tiếng Việt (ưu tiên) hoặc tiếng Anh
Không trùng ứng dụng con đã có — kiểm tra danh sách trang trước khi tạo mới
Mỗi trang con hoạt động độc lập — chỉ làm việc trong thư mục trang của mình
Responsive — trang phải hiển thị tốt trên mobile
Không thêm dependency mới trừ khi thật sự cần và được approve. Các thư viện sau đã được cài sẵn — tự do sử dụng:
- @vueuse/core — 200+ composables cho Vue
- @iconify/vue — 200,000+ icons từ 150+ bộ icon
- shiki — Syntax highlighter
Các thư viện sau được chấp thuận sẵn và có thể thêm mà không cần approve:
- vue-konva — Thư viện canvas 2D cho vẽ, game, đồ hoạ tương tác
Ghi rõ tên tác giả trong file meta.ts của trang

Cách tham gia

Fork repo và clone về máy
Tạo branch mới từ main (ví dụ: git checkout -b feat/tên-trang)
Tạo trang mới bằng script:
```
pnpm create:page <tên-trang>
```
Script sẽ hỏi tên hiển thị, mô tả, tác giả, Facebook URL (tuỳ chọn) và danh mục, rồi tự tạo src/views/<tên-trang>/index.vue + meta.ts.
Code trang của bạn trong index.vue
Tạo Pull Request và chờ merge!

Xem trang mẫu: src/views/hello-world/

Xem hướng dẫn thiết kế: docs/DESIGN_SYSTEM.md

Cấu trúc dự án

src/
  views/
    HomePage.vue                 # Trang chủ (launcher)
    hello-world/
      index.vue                  # Trang mẫu
      meta.ts                    # Thông tin trang (tên, mô tả, tác giả)
    <tên-của-bạn>/
      index.vue                  # Trang của bạn
      meta.ts                    # Thông tin trang của bạn
  router/index.ts                # Cấu hình routes
  stores/                        # Pinia stores

Các lệnh thường dùng

| Lệnh | Mô tả | |------|-------| | pnpm dev | Chạy dev server | | pnpm build | Build production | | pnpm test:unit | Chạy unit tests | | pnpm lint | Lint code | | pnpm format | Format code | | pnpm create:page <slug> | Tạo trang mới từ template |

IDE

VS Code + Vue (Official)

Contributors

Made with contrib.rocks.

Star History

Vibe.j2team.org

Install / Use

README