Tổng quan Giao diện Người dùng (UI)

Làm quen với không gian làm việc

Giao diện của VS Code được thiết kế để tối ưu hóa không gian và giảm thiểu sự phân tâm. Hãy cùng khám phá 5 thành phần chính tạo nên không gian làm việc của bạn.

Hướng dẫn chi tiết

1. Activity Bar (Thanh hoạt động)

• Vị trí: Nằm ở cạnh trái cùng.
• Chức năng: Cho phép bạn chuyển đổi giữa các chế độ xem chính.
  • Explorer: Xem và quản lý file, thư mục trong dự án của bạn (biểu tượng tài liệu).
  • Search: Tìm kiếm và thay thế văn bản trên toàn bộ dự án (biểu tượng kính lúp).
  • Source Control: Quản lý phiên bản với Git (biểu tượng nhánh cây).
  • Run and Debug: Chạy và gỡ lỗi mã nguồn (biểu tượng play với con bọ).
  • Extensions: Tìm kiếm và quản lý các tiện ích mở rộng (biểu tượng khối vuông).

2. Side Bar (Thanh bên)

• Vị trí: Nằm cạnh Activity Bar.
• Chức năng: Hiển thị nội dung của chế độ xem bạn đã chọn ở Activity Bar. Ví dụ, nếu bạn chọn Explorer, Side Bar sẽ hiển thị cây thư mục của dự án.

3. Editor Group (Nhóm trình soạn thảo)

• Vị trí: Khu vực lớn nhất, ở trung tâm.
• Chức năng: Đây là nơi bạn mở và chỉnh sửa các file. Bạn có thể mở nhiều file cùng lúc và chia màn hình (split view) để xem song song, một tính năng rất hữu ích khi so sánh tài liệu hoặc tham chiếu.

4. Panel (Bảng điều khiển)

• Vị trí: Nằm ở phía dưới Editor Group.
• Chức năng: Hiển thị các bảng thông tin khác nhau. Bảng quan trọng nhất đối với chúng ta là Terminal.
  • Problems: Hiển thị các lỗi hoặc cảnh báo trong code.
  • Output: Hiển thị đầu ra từ các tác vụ hoặc extension.
  • Debug Console: Dành cho việc gỡ lỗi.
  • Terminal: Cửa sổ dòng lệnh tích hợp, sức mạnh thực sự của VS Code.

5. Status Bar (Thanh trạng thái)

• Vị trí: Nằm ở dưới cùng của cửa sổ.
• Chức năng: Hiển thị thông tin về dự án và file đang mở, ví dụ như nhánh Git hiện tại, số lỗi, loại file, và encoding.

Command Palette (Bảng lệnh)

• Phím tắt: Ctrl+Shift+P (Windows/Linux) hoặc Cmd+Shift+P (macOS).
• Đây là công cụ quan trọng nhất trong VS Code. Nó cho phép bạn truy cập vào tất cả các lệnh có sẵn. Thay vì tìm kiếm qua các menu, bạn chỉ cần mở Command Palette và gõ vài chữ để tìm lệnh mình cần.

Nắm vững các thành phần này sẽ giúp bạn làm việc với VS Code một cách nhanh chóng và hiệu quả.