Phím tắt VS code

Hướng dẫn 1 vài phím tắt nhanh tiện lợi khi làm việc với Visual studio code.

-Xem danh sách phím tắt mặc định trong VS code: CTRL+K+S.
-Xem lượt sử phím tắt đã dùng gần đây: Ctrl+Shift+P

1. để mở nhanh 1 file html trong trình duyệt web các bạn cài thêm extension (open in browser 2.0)

2. để định dạng đoạn code ngay thẳng các bạn bôi đen sau đó nhấn tổ hợp phím (shift+ alt + f )

3. để chuyển nhanh giữa các tab trong Visual studio code các bạn nhấn tổ hợp phím (ctrl + tab)

4. Chúng ta có thể dành nhiều không gian cho cửa sổ đang code bằng cách ẩn/ hiện thanh Activity bar, các bạn nhấn tổ hợp phím (Ctrl + B)

5. để chèn nhanh 1 đoạn code giống dòng phía trên các bạn nhấn tổ hợp phím (shift + alt + mũi tên xuống)

6. để thay đổi vị trí 1 đoạn code các bạn bôi đen sau đó nhấn tổ hợp phím (alt + mũi tên lên hoặc alt+ mũi tên xuống)

7. để search nhanh 1 chuỗi hay đoạn code các bạn chọn kính lúp trên nhanh Activity Bar ( hoặc nhấn tổ hợp phím Ctrl + shift + f )

8. Bôi đen từ vị trí chuột 1 dòng hay đoạn văn bản ( tổ hợp phím ctrl + shift + mũi tên lên hoặc xuống)

9. để đi đến 1 dòng code xác định, gõ Ctrl+ g: điều số cần đi đến.

10. cài nhanh extenstion hỗ trợ bootstrap: Ctrl+ shift+X: gõ "bootstrap 3 snippet"
- Chèn nhanh CDN bootstrap: gõ bs3-cdn và nhấn phím tab
- Chèn nhanh modal bootstrap: gõ bs3-modal và nhấn phím tab

11. Hướng dẫn tạo snippet (chế độ gõ nhanh 1 cụm lệnh đã định nghĩa)

B1: xác định đoạn code và từ khóa cần snippet:

-ví dụ mình gõ tắt ajax với desciption là gõ nhanh ajax.

-đoạn mã cần snippet là:

$.ajax(
{
url:'vd2.php' ,
type: 'POST',
data: 't='+v,
success: function(s)
{
$('#kq3').html(s);
}
}
);

B2: Truy cập vào trang tạo nhanh snippet cho vs code:

https://snippet-generator.app

sau đó paste đoạn code cần tạo ở bước 1 vào, lúc này web sẽ tạo ra (generate) cho ta mã dùng cho VS code như sau:

"": {
  "prefix": "",
  "body": [
    "$.ajax(",
    "    {",
    "     url:'vd2.php' ,",
    "     type: 'POST',",
    "     data: 't='+v,",
    "     success: function(s)",
    "     {",
    "      $('#kq3').html(s);",
    "     }",
    "    }",
    "   );"
  ],
  "description": ""
}

-Chúng ta cần quan tâm đến 2 chỗ là:

+prefix: hãy điền tên cần snippet: "ajax" chẳng hạn.

+description: mô tả đoạn khi các bạn gõ tắt: "gõ tắt ajax"

B3: sau khi xong bước ta có đoạn code sau:

"": {
  "prefix": "ajax",
  "body": [
    "$.ajax(",
    "    {",
    "     url:'vd2.php' ,",
    "     type: 'POST',",
    "     data: 't='+v,",
    "     success: function(s)",
    "     {",
    "      $('#kq3').html(s);",
    "     }",
    "    }",
    "   );"
  ],
  "description": "go tat ajax"
}

B4: trong vs code các bạn nhấn tổ hợp phím CTRL+SHIFT+P

rồi gõ vào: configure user snippets, sau đó chọn "new global snippet file",

điền đoạn code ở bước 3 vào trong cặp {}, rồi save lại:

B5, kiểm tra lại kết quả: