Tổng hợp các plugins cần thiết trong Sublime Text

Ở bài trước mình đã giới thiệu đến các bạn về khái niệm cũng như là cách cài đặt và sử dụng Sublime Text. Tiếp theo đây, mình sẽ tổng hợp các plugins (packages) hữu ích giúp cho Developer có thể thao tác nhanh chóng hơn, cũng như là cách cài đặt và sử dụng chúng như thế nào.


Đầu tiên, để cài đặt được những plugins tuyệt vời này thì Sublime text phải được cài đặt package control.

 
Và tiếp theo:
    1. Nhấn tổ hợp phím: Ctrl + Shift + P, sau đó gõ "Package install" => Enter.
 

package install

    2. Tiếp theo, gõ tên "package" mà bạn muốn cài đặt vào đây => Enter.

package name

 

Dưới đây là danh sách các plugins/packages:

1. Emmet

- Là package cho phép chúng ta gõ tắt các code HTML, CSS.

- Sử dụng: dùng cú pháp gõ tắt mà emmet hỗ trợ => sau đó nhấn TAB để thực hiện.

emmet in sublime text

cool Xem cú pháp gõ tắt của emmet tại đây: https://docs.emmet.io/cheat-sheet/

 

2. AdvancedNewFile

- Package này giúp chúng ta có thể tạo ra các file mới một cách nhanh chóng.

  Thay vì duyệt qua các thư mục trong project và sử dụng menu để tạo file, thì với package này các chúng ta chỉ cần:

Ctrl + Alt + N => sau đó viết đường dẫn đến file mới muốn tạo.

AdvancedNewFile in Sublime Text

enlightened Nếu tập tin nằm trong thư mục chưa tồn tại, thì thư mục mới này sẽ được tạo.

 

3. Color HighLighter

- Package này "hiển thị màu sắc" của mã màu trong css => có thể giúp chúng ta code css hay hơn.

Color HighLighter in Sublime text

 

4. AutoFileName

- Package AutoFileName sẽ hiển thị ra tất cả các file có trong thư mục để các bạn có thể nhúng file một cách đơn giản hơn.

 
5. Sidebar Enhancements

- Package tạo ra các context menu với nhiều tiện ích như tạo mới file và folder, open in browser, duplicate, copy, ...

 
6. AutoPrefixer

- Giúp chúng ta tạo ra các prefix cho các trình duyệt tương ứng.

 
7. HTML-CSS-JS Prettify

- Plugin này giúp cho code của chúng ta được format lại theo đúng chuẩn. Nó hỗ trợ HTML, CSS, Javascript và JSON.

- Nhấn tổ hợp phím: Ctrl + Shift + H để thực hiện chức năng.

 
8. Bracket HighLighter

- Chúng ta có thể dễ dàng nhìn ra phần đóng/mở của thẻ nằm ở vị trí nào dựa vào plugin này.

 
9. DocBlockr

- Package này giúp chúng ta tạo ra các comment đúng chuẩn.

- Sử dụng bằng cách: Gõ /** hoặc /* => Nhấn Enter/Tab

          

 
10. Bootstrap Snippets

- Sử dụng package này có thể giúp chúng ta code Bootstrap 1 cách nhanh chóng.

- Ví dụ: Nếu muốn 1 đoạn code của Navbar trong Bootstrap, thay vì lên trang chủ của Bootstrap or any where để copy đoạn code đó về, thì khi sử dụng package này chúng ta chỉ cần gõ:

  b4:navbar => Tabs

 
11. Bootstrap Autocomplete

- Hỗ trợ các class có sẵn trong Bootstrap.

 

12. Placeholders

- Sublime Text 3 có bộ tạo sẵn Lorem Ipsum mà bạn có thể sử dụng để tạo văn bản giả. Và plugin này mở rộng chức năng đó và cho phép Sublime Text tạo ra một cách nhanh chóng cho hình ảnh, form, list và table của placeholder.

 
13. Git

- Một tích hợp Git hoạt động trực tiếp từ bảng lệnh của Sublime Text, giúp truy cập và thao tác nhanh đến các lệnh Git như thêm tin, commit, mở Git log, ... ngay trên Sublime Text.

 
14. GitGutter

- Plugin này đánh dấu mỗi dòng trong mã nguồn của chúng ta, cho ta biết trạng thái của Git cũng như cung cấp 1 cái nhìn tổng quan về những thay đổi đã xảy ra. Nó còn có thể sử dụng để so sánh các tệp của bạn với Git HEAD, origin, branch mà bạn chọn or 1 số commit.

 

Ngoài ra, Sublime text còn 1 số plugins khác như: SFTP, CodeIntel, Alignment, CodeFormatter, ...

Thật tuyệt vời đúng không nào! heart heart heart

Bài viết tiếp theo, Thư viện hướng dẫn sẽ giới thiệu đến các bạn nội dung TỔNG HỢP CÁC PHÍM TẮT TRONG SUBLIME TEXT giúp các bạn có thể code nhanh hơn, hiệu quả hơn! smiley

Cám ơn các bạn đã theo dõi!

Hẹn gặp lại các bạn ở bài tiếp theo nhé!

Tổng hợp các plugins cần thiết trong Sublime Text

Cùng chuyên mục

Xem nhiều hôm nay