Sublime Text là một IDE soạn thảo code đã nền tảng, đây là phần mềm dạng shareware (dùng thử miễn phí) cùng với một Python API. Sublime hỗ trợ nhiều ngôn ngữ lập trình và ngôn ngữ đánh dẫu (HTML, XML...), theo đó là rất nhiều tính năng được thêm vào bởi các plugin.

Màn hình soạn thảo code trong Sublime 3

Một số tính năng của Sublime

Sublime Text được giới thiệu từ năm 2008, viết bằng C++ và Python. Phiên bản Sublime Text 2 giới thiệu năm 2013 và phiên bản Sublime Text giới thiệu năm 2017 với các tính năng như:

Dễ dàng điều hướng tới các file, ký hiệu, hay các dòng với tính năng Goto Anything (nhấn Ctrl + P hoặc Cmd + P).

Tính năng Command palette (Ctrl + Shift + P hoặc Cmd + Shift +P), được sử dụng để nhanh chóng truy cập các tính năng từ bàn phím

Hỗ trợ soạn thảo tương tác với nhiều vùng chọn, thiết lập các thuộc tính cho dự án, tùy chọn thiết lập thông qua file cấu hình JSON và cuối cùng Sublime chạy đa nền tảng (macOS, Windows, Linux)

Cài đặt Sublime Text trên Windows, macOS, Ubuntu

Nói chung dù cài đặt trên nền tảng nào bạn đều có thể tải về và cài đặt theo hướng dẫn tại: https://www.sublimetext.com/3, sau khi tải về bạn có thể cài đặt bằng cách chạy file cài đặt và làm theo hướng dẫn của nó.

Ngoài ra bạn có thể cài đặt bằng cách:

Cài đặt Sublime trên macOS

Có thể sử dụng brew để cài đặt:

brew cask install sublime-text

Cài đặt Sublime trên Ubuntu

wget -qO - https://download.sublimetext.com/sublimehq-pub.gpg | sudo apt-key add - sudo apt-get install apt-transport-https echo "deb https://download.sublimetext.com/ apt/stable/" | sudo tee /etc/apt/sources.list.d/sublime-text.list sudo apt-get update sudo apt-get install sublime-text Tải và cài đặt Sublime Text trên Windows bằng WinGet

Trên Windows nếu có sử dụng chương trình quản lý gói WinGet thì có thể tải về vài cài đặt Sublime bằng lệnh

winget install SublimeHQ.SublimeText

Sau khi cài đặt Sublime, bạn có thể mở thư mục chứa code của dự án mã nguồn ra và bắt đầu biên tập code.

Sau đây là một số thiết lập, cài đặt thêm để làm việc với Sublime

Cài đặt Package Control cho Sublime

Package Control là trình quản lý gói cho Sublime, thông qua nó có thể cài đặt thêm vào Sublime nhiều thành phần, để cài đặt hãy mở Command Palettes (Menu Tool) hoặc nhấn phím CTRL + Shift + P hoặc Cmd + Shifp + P (macOS), gõ vào pack và chọn mục Install Package Control

Cài đặt Package Control

Cài đặt các phần mở rộng vào Sublime

Sau khi có Package Control, bạn có thể dùng nó để cài đặt thêm vào Sublime các thành phần mở rộng mong muốn, tùy thuộc vào ngôn ngữ cũng như nhu cầu về các công cụ bạn cần dùng.

Để cài đặt gói mở rộng bạn vào Command Palettes bằng cách gõ CTRL + Shift + P hoặc Cmd + Shifp + P, sau đó chọn mục Package Control: Install Package

Cài đặt Package Control

Sau đó một giao diện đổ xuống, để bạn có thể tìm kiếm và chọn cài đặt các gói mong muốn, như hình là tìm kiếm gói Emmet

Cài đặt Package Control

Sau đây là một số gói mà bạn có thể tham khảo để cài đặt, thông tin về các package có thể tìm đầy đủ tại https://packagecontrol.io/

Alignment https://packagecontrol.io/packages/Alignment

Cho phép căn thẳng đoạn code được lựa chọn. Sử dụng bằng cách chọn code, rồi nhấn Ctrl + Alt + A hoặc trên macOS Cmd + Ctrl + A

Alignment trong Sublime

Trailing​Spaces https://packagecontrol.io/packages/TrailingSpaces

Gói này cho phép bạn quan sát dễ dàng các khoảng trắng và xóa nó. Sau khi cài đặt nó có menu lệnh: Edit > Trailing Space để bạn chọn để highlight các khoảng trắng cuối các dòng, có thể chọn để xóa nó

Sublime​Linter-phplint https://packagecontrol.io/packages/SublimeLinter-phplint

Giúp kiểm tra lỗi cú pháp PHP

Emmet https://packagecontrol.io/packages/Emmet

Hỗ trợ tự động điền nội dung khi gõ, nhấn Tab để hoàn chỉnh. Ví dụ gõ phpi nhấn Tab sẽ hoàn chỉnh kết quả là phpinfo()

Hướng dẫn sử dụng Sublime Text 3 để khai thác hết những công dụng mãnh liệt của Sublime là mục tiêu chính của bài Hướng Dẫn Sử Dụng Sublime Text 3 Để Lập Trình Mọi Thứ này mà ATP Web mong muốn gửi đến độc giả. Bởi Sublime Text là một trong những trình soạn thảo phổ biến nhất vào thời điểm hiện tại. so với Atom hay VSCode, Sublime chiếm ưu điểm hơn hẳn nhờ tốc độ nhanh, giao diện dễ dàng, và có phần lớn các khả năng mạnh mẽ.

Sublime Text 3 là gì?

Sublime Text 3là một editor phổ biến ở thời điểm hiện tại dùng để lập trình, soạn thảo văn bản thay cho Notepad trên Windows, nó có thể thực hiện được mọi thứ ảnh hưởng đến văn bản VD như sử dụng nó để biên soạn bằng Markdown và còn nhiều thứ khác mà tôi sẽ cùng bạn khai thác nó.

Sublime Text 3 được beta lần đầu vào 29/1/2013. Hiện tại phiên bản mới quan trọng là 31xx. Sublime Text 3 miễn phí, và nếu thích bạn có thể ủng hộ tác giả bằng việc mua lisence.

Ngoài Sublime Text ra còn rất nhiều editor phổ biến khác như Atom, Brackets, Visual Studio Code, PhpStorm, Zend Studio …bạn có thể tìm hiểu thêm nhé.

Hướng Dẫn Sử Dụng Sublime Text 3

Vì sao tôi chỉ bạn dùng Sublime Text?

• Sublime Text dành cho người cho toàn bộ mọi người, cho người từ mới khởi đầu và chuyên nghiệp
• Thiết lập đơn giản, có bản Portable click là chạy
• Sử dụng miễn phí, bạn sẽ trả phí ủng hộ tác giả bất cứ lúc nào
• Rất nhẹ, nhẹ như Notepad trên máy của bạn vậy
• Hỗ trợ mọi ngôn ngữ ví dụ: HTML, CSS, LESS, PHP, Javascript, …. hầu như là toàn bộ.
• Cộng đồng rộng rãi với hàng chục nghìn Package hỗ trợ cho ngôn ngữ bạn đang làm. có thể kể đến là Emmet,
• WordPress Code Reference, Syntax các loại …
• Hỗ trợ đa nền tảng Windows, Linux, Mac Os, Ubuntu.
• Chế độ tìm kiếm, replace, highlight, go anywhere rất dễ dàng để sử dụng
• Có rất nhiều theme thay cho mặc định
• Tự tạo code với Snippets
• Tích hợp sẵn Terminal
• Và còn rất nhiều option mà bạn có thể biết….
  Hướng Dẫn Sử Dụng Sublime Text 3

Hướng dẫn sử dụng Sublime Text 3 – Phím tắt

Sử dụng phím tắt để thực thi tác vụ luôn nhanh hơn dùng chuột hay thực đơn.

Chung

• Ctrl+Shift+P : Mở Command Prompt
• Ctrl+K, Ctrl+B : Ẩn/hiện side bar

Chỉnh sửa

• Ctrl+Shift+↑ : chuyển dịch dòng/vùng chọn lên 1 dòng
• Ctrl+Shift+↓ : chuyển dịch dòng/vùng chọn xuống 1 dòng
• Ctrl+L : Chọn dòng hiện tại, tiếp tục nhấn Ctrl+L để chọn dòng kế tiếp
• Ctrl+D : Chọn một từ, tiếp tục nhấn Ctrl+D để chọn những từ giống vậy
• Ctrl+Shift+D : Nhân đôi dòng hiện tại
• Ctrl+M : Đi tới dấu đóng ngoặc gần nhất – Lặp lại để đi tới dấu mở ngoặc
• Ctrl+Shift+M : Chọn phần nhiều thông tin trong dấu ngoặc
• Ctrl+Shift+K : Xóa phần lớn dòng
• Ctrl+] : Lùi dòng hiện tại vào trong 1 tab
• Ctrl+[ : Lùi dòng hiện tại ra ngoài 1 tab
• Ctrl+/ : Comment/Un-comment dòng/vùng chọn hiện tại
  Hướng Dẫn Sử Dụng Sublime Text 3

Tô màu mã gốc với các gói mở rộng ngôn ngữ

Một khi setup, Sublime hỗ trợ đến hơn 50 ngôn ngữ lập trình. hơn nữa, nếu làm việc với Angular, Vue, React hay những framework/ngôn ngữ mới, bạn phải cần phải thiết lập thêm các phần xây dựng rộng để Sublime đủ sức thấu hiểu và tô màu mã nguồn. Tùy nhu cầu nhất định mà bạn đủ sức tìm thấy plugin tương ứng trên Package Control. ATP Web liệt kê sau đây những plugin phổ biến nhất.

Ngôn ngữ

• Babel (React): bên cạnh hỗ trợ các công dụng mới trong ES6, ES7, plugin này cũng hỗ trợ tô màu cho JSX
• Better CoffeeScript
• Flow
• TypeScript

Thư viện

• AngularJS
• Vue Syntax Highlight
• EmberScript

Hướng dẫn sử dụng Sublime Text 3 – Emmet

Với lập trình viên front-end, Emmet là plugin không thể thiếu rồi. Emmet cho phép bạn viết HTML “nhanh như chớp” bằng hướng dẫn dùng biểu thức mô tả HTML. Sau đấy Emmer sẽ mở rộng biểu thức này. Chẳng hạn, khi mà bạn viết

content>p.text*5>lorem, Emmet sẽ “úm ba la” thành:

Các gói Snippets hữu dụng

JavaScript & NodeJS Snippets, như tên gọi, gồm có các snippets dành riêng cho JavaScript, giúp cho bạn gõ một đoạn mã thông dụng nhanh hơn. VD, thay vì gõ document.querySelector(‘selector’);, bạn chỉ cần gõ qs, click Tab, và Sublime sẽ giúp phần việc còn lại giúp cho bạn. Hoặc ghi giống như VD dưới đây.

Nếu như thấy Emmet hơi phức tạp, bạn sẽ sử dụng một plugin khác tương tự là HTML Snippets. Plugin này có ít khả năng hơn, nhưng dễ sử dụng hơn.

Bên cạnh đó, cũng đừng bao giờ quên những gói snippets khi làm việc với các thư viện/framework. giống như ReactJS Snippets, AngularJS Snippets, VueJS Snippets…

Với CSS, bạn chỉ cần cài CSS Snippets là có hỗ trợ CSS, LESS, SASS và Stylus.

Định dạng mã nguồn

Bằng cách dùng HTMLBeautify, CSS Format, Pretty JSON hoặc jsfmt, bạn sẽ chọn tự động định dạng mã nguồn khi lưu files. nếu là fan của Prettier, bạn đừng quên plugin JsPrettier.

Hướng Dẫn Sử Dụng Sublime Text

Hướng dẫn sử dụng Sublime Text 3 – Canh hàng với Alignment

Alignment giúp cho bạn canh hàng khi khai báo nhiều biến. không những hoạt động trên JS, Alignment còn hỗ trợ PHP. Để tùy chỉnh plugin này, bạn có thể xem hướng dẫn.

Loại bỏ khoảng trắng dư thừa bằng Trimmer

Trimmer giúp cho bạn loại bỏ những khoảng trắng thừa nhanh nhất. Bên cạnh đó plugin này còn có tính năng Replace Smart Characters, giúp thay thế những ký tự đặc biệt như « thành <<. Dùng DocBlockr để viết tài liệu

Trong lúc viết code, đôi khi chúng ta phải viết thêm tài liệu miêu tả về hàm hay lớp đang xây dựng. mục tiêu là để công đoạn bảo trì ứng dụng đơn giản hơn, các thành viên mới gia nhập team cũng dễ kiểm soát nội dung hơn. Doc​Blockr là plugin giúp bạn viết những tài liệu này rất nhanh, tiện lợi. Chỉ cần để con trỏ ở trước hàm hay phương thức, gõ /** và Tab, DocBlockr sẽ tự động biết được các tham số và giá trị trả về.

DocBlockr không những hỗ trợ JavaScript mà còn vận dụng được với nhiều ngôn ngữ khác như PHP, CoffeeScript, TypeScript…

(Nguồn: Tổng hợp)

Lời tổng kết

Qua bài viết trên của ATP Trang Website đã cung cấp đến các bạn đọc một số thông tin về Hướng Dẫn Sử Dụng Sublime Text 3 Để Lập Trình Mọi Thứ. Hy vọng những thông tin trên của bài viết sẽ hữu ích với các bạn đọc. Cảm ơn các bạn đã dành nhiều thời gian để xem qua bài viết này nhé.