Hướng dẫn

Yêu cầu

• nvm (node version manager):
  • MacOS: https://github.com/nvm-sh/nvm
  • Windows: https://github.com/coreybutler/nvm-windows
• Node: 20.15.0 (nvm sẽ tự động cài đặt phiên bản này nếu chưa có)
  • MacOS: https://nodejs.org/dist/v20.15.0/node-v20.15.0.pkg
  • Windows: https://nodejs.org/dist/v20.15.0/node-v20.15.0-x64.msi
• Docker: https://www.docker.com/products/docker-desktop
• Dùng npm, không dùng các công cụ khác để tránh xung đột

Cài đặt

Sao chép file .env.example ra một file tương tự, đổi tên file thành .env

Chỉnh sửa một số trường .env cho phù hợp với môi trường máy cá nhân, có thể để như mặc định ở môi trường localhost

Chạy ở môi trường development - Docker (cần bật Docker trước)

make build-development
make start-development

Chạy ở môi trường development (cần bật mongodb trước)

npm i -f
npm run dev

Khi thành công sẽ thấy terminal/console hiển thị thông báo:

  VITE v5.4.10  ready in 223 ms

  ➜  Local:   http://localhost:8001/
  ➜  Network: http://192.168.2.6:8001/
  ➜  press h + enter to show help

Kiểm tra lỗi (chạy thủ công)

npm run lint:check

Sửa lỗi (chạy thủ công)

npm run lint:fix

Một số quy ước

Quy ước đặt tên

• Tên biến: camelCase
• Tên hàm: camelCase
• Tên biến parameter: camelCase
• Tên biến argument: camelCase
• Tên biến private: _camelCase
• Tên class: PascalCase
• Tên hằng số: UPPER_CASE
• Tên file: kebab-case
• Tên thư mục: kebab-case

Quy ước đặt tên chung

• Tiền tố tuỳ thuộc vào từ khoá của typescript hoặc graphql
• Quy tắc: Tiền tố + tên kiểu dữ liệu (ví dụ: interface I_User, interface I_Role)
• Trường hợp biến đại diện cho input (kiểu dữ liệu đầu vào): Tiền tố + loại + tên kiểu dữ liệu (ví dụ: interface T_Input_User cho typescript, input T_Input_CreateUser cho graphql)
• Trường hợp biến đại diện cho output (kiểu dữ liệu đầu ra): Tiền tố + loại + tên kiểu dữ liệu (ví dụ: interface I_Response_User cho typescript, type T_Response_User cho graphql)

Quy ước tiền tố typescript

• Dùng tiền tố I_ cho interface (ví dụ: interface I_User)
• Dùng tiền tố T_ cho type (ví dụ: type T_User)
• Dùng tiền tố E_ cho enum (ví dụ: enum E_User)

Quy ước đặt tên type graphql

• Dùng tiền tố T_ cho type (ví dụ: type T_User)
• Dùng tiền tố I_ cho input (ví dụ: input I_InputCreateUser)

Quy ước đặt tên biến môi trường

• Dùng tiền tố REACT_APP_ cho biến môi trường của react
• Dùng tiền tố NEXT_PUBLIC_ cho biến môi trường của nextjs
• Dùng tiền tố VITE_ cho biến môi trường của vite
• Dùng tiền tố NODE_ cho biến môi trường của node

Quy ước khi import: Xem các file có sẵn

• Các thư viện cài đặt bên ngoài trên cùng
• Các hàm tiện ích/module trong hệ thống ở dưới, cách một dòng trắng với các thư viện bên ngoài, cấu hình dường dẫn để import nhanh nằm ở file tsconfig.json

Quy ước viết code

• Không dùng var
• Không dùng ==
• Xóa console.log trước khi commit
• Xóa debugger trước khi commit
• Không dùng any, unknown, never
• Không dùng @ts-ignore
• Không dùng @ts-nocheck

Quy ước đặt commit message

• Commit message có dạng: type(module/entity): message (ví dụ: feat(user): add user feature, fix(user): cannot create user)

Cấu trúc thư mục và ý nghĩa

.
├── .github => cấu hình workflow để chạy CI/CD cho github
├── docker => cấu hình triển khai docker
├── node_modules => thư mục chứa các thư viện ngoài
├── public
│   ├── assets => Chứa các asset như fonts, images, icons
├── shared => Các file dùng chung
│   └── components => Các component dùng chung
│       ├── index.ts => import tất cả các component con vào index
│   └── contexts => Các context dùng chung
│       ├── index.ts => import tất cả các context con vào index
│   └── hocs => Các hoc dùng chung
│       ├── index.ts => import tất cả các hoc con vào index
│   └── hooks => Các hook dùng chung
│       ├── index.ts => import tất cả các hook con vào index
│   └── i18n => Dịch thuật của hệ thống
│   └── layouts => Các layout trong hệ thống
│       ├── index.ts => import tất cả các layout con vào index
│   └── typescript => Các typescript dùng chung
│       ├── index.ts => import tất cả các typescript con vào index
│   └── utils => Các hàm tiện ích dùng chung
│       ├── index.ts => import tất cả các util con vào index
├── .env => biến môi trường (copy từ .env.example)
├── .env.example => mẫu biến môi trường
├── .gitignore => cấu hình git
├── .ncurc.cjs => cấu hình bỏ qua thư viện khi kiểm tra phiên bản mới
├── .npmrc => cấu hình npm
├── .nvmrc => phiên bản node
├── .eslint.config.js => cấu hình kiểm tra cú pháp code
├── index.html => file đầu vào
├── Makefile => lệnh make dùng để chạy docker
├── package-lock.json => cấu hình npm
├── package.json => cấu hình npm
├── README.md => hướng dẫn
└── tsconfig.app.json => cấu hình typescript cho app
└── tsconfig.json => cấu hình typescript
└── tsconfig.node.json => cấu hình typescript cho server
└── vite.config.ts => cấu hình vite

Quy trình làm việc

1. Tách nhánh từ develop

git checkout -b branchName

2. Sau khi code, thêm file muốn đẩy lên git vào staged

git add fileName

hoặc thêm tất cả file

git add .

3. Đặt commit message

git commit -m "feat(user): add user feature"

=> Chờ hệ thống kiểm tra lỗi, nếu xảy ra lỗi, giải quyết lỗi và quay lại bước 2

4. Đẩy code lên git

git push