Giới thiệu

Có một số tùy chọn cho các nhà phát triển đang tìm kiếm một trình soạn thảo JavaScript tốt cung cấp môi trường làm việc hiệu quả và dễ chịu hơn.

Các trình soạn thảo mã JavaScript hàng đầu chia sẻ nhiều tính năng chính tuyệt vời mà bạn có thể mong đợi, bao gồm tự động hoàn thành (hoàn thành mã), tích hợp git và hỗ trợ plugin. Nhưng đó là những điều nhỏ có thể làm cho một trình soạn thảo phù hợp hơn một trình soạn thảo cho một nhà phát triển nhất định.

Khi bạn cảm thấy thoải mái với trình chỉnh sửa code và làm quen với quy trình làm việc sẽ giúp bạn hiệu quả hơn, có thể khó chuyển đổi trình chỉnh sửa vì bạn sẽ phải học lại các phím tắt để tối ưu hóa quy trình phát triển của mình.

Bây giờ chúng ta hãy đi qua một số tùy chọn trình biên tập phổ biến nhất.

Visual Studio Code

VSCode từ Microsoft là mã nguồn mở miễn phí và khá nhẹ khi cài đặt. Đây là trình soạn thảo thực tế cho các nhà phát triển JavaScript mới bắt đầu, một phần vì nó được tải sẵn một bộ chức năng tốt không yêu cầu bổ sung. VSCode cũng phổ biến và có thể lý tưởng cho những người dùng cao cấp hơn cần bắt đầu nhanh chóng.

Mẹo : Làm việc trên một dự án lớn trong một IDE khác, nơi quá trình xây dựng có thể mất một chút thời gian, tôi sẽ thường mở tệp đầu ra JS lớn trong VSCode và điều chỉnh nó để kiểm tra ngay sự thay đổi trong trình duyệt trước khi áp dụng nó.

Git được tích hợp vào IDE, nhưng sự tích hợp không mạnh mẽ như một số trình soạn thảo khác. Ví dụ: người dùng WebStorm thích trải nghiệm đẩy / hợp nhất so với VSCode.

Bạn có thể cài đặt nhiều tính năng bổ sung mà bạn có thể cần dưới dạng tiện ích mở rộng, trong đó có hàng nghìn. Nhưng không phải tất cả chúng là các tính năng thực tế. Đoạn code được trộn lẫn với các tính năng và tiện ích bổ sung, có thể mất thời gian để xem xét và tìm các tùy chọn tốt nhất để thêm. Nếu bạn từng gặp phải một vấn đề, VSCode có một cộng đồng người dùng khổng lồ; ai đó có khả năng đã có cùng một vấn đề và đã giải quyết nó.

Nếu bạn chưa sẵn sàng cho một IDE trả phí đầy đủ với tất cả chuông và còi và không đủ quen thuộc với tất cả các plugin và tính năng bạn có thể cần, thì đây là điểm khởi đầu hợp lý.

Atom

Trình chỉnh sửa Atom miễn phí được phát triển bởi GitHub. Nó thực sự là một phiên bản chuyên dụng của trình duyệt crom được chuyển đổi thành trình soạn thảo văn bản và mã nguồn. Trong nội bộ, nó sử dụng Node.js để hỗ trợ plugin.

Rất nhiều plugin có sẵn cho bất kỳ tính năng nào bạn có thể muốn, tuy nhiên nó không mạnh bằng hộp. Bạn phải thu thập một số plugin để xây dựng môi trường dev đến nơi bạn có thể hiệu quả nhất có thể. Nếu bạn đang làm việc với JavaScript, đây là một số plugin Atom cần thiết để bạn bắt đầu:

• atom-typescript
• file-icons - to colorize and assign icons to different file types
• atom-beautify
• linter

Mẹo : Kích hoạt gói tự động sẽ lưu các chỉnh sửa khi mất tiêu điểm. Mặc định là tắt.

Nhiều người dùng có thể làm việc trên cùng một tệp cùng một lúc, mỗi người có nhiều con trỏ trên màn hình, thông qua plugin teletype. Bạn có thể sử dụng điều này để tư vấn, ghép mã hóa hoặc cộng tác. Tính năng này đặt Atom ngoài các trình soạn thảo khác.

Việc tích hợp git được triển khai tốt, như bạn mong đợi từ phần mềm GitHub. Cũng hữu ích là một plugin git-plus cho phép bạn chạy các lệnh git thông qua các phím tắt mà không cần sử dụng thiết bị đầu cuối git.

Atom có thể tùy chỉnh đến mức bạn có thể chỉnh sửa tệp .less để điều chỉnh màu IDE, điều này thật tuyệt nếu bạn muốn điều chỉnh từng chi tiết trong môi trường của mình. Bạn có thể chạy tập lệnh .coffe khi khởi động có thể được sử dụng để nhanh chóng thay đổi hành vi của người chỉnh sửa.

Bạn có thể viết các plugin bằng JavaScript dựa trên API trình soạn thảo được ghi chép tốt. Khả năng tác giả chức năng và hành vi của riêng bạn là tốt đẹp để có, nếu cần.

Trải nghiệm chỉnh sửa rất mượt mà và bạn có thể cải thiện nó bằng các plugin khác như minimap, nhưng cần có một khoản đầu tư thời gian ban đầu để thiết lập nó với tất cả các tính năng bạn muốn. Lợi ích là các tính năng bạn không cần sẽ không mất thời gian tải mà làm chậm trải nghiệm. Tuy nhiên, bạn có thể gặp một số chậm chạp nhất thời khi tải các tệp lớn hoặc chuyển đổi tab.

Ban đầu tôi thích ý tưởng chỉnh sửa các kiểu CSS để tùy chỉnh môi trường IDE hoặc ít nhất là có khả năng nếu tôi muốn đưa ra các chủ đề của riêng mình. Nghe có vẻ vui nhưng trong thực tế, đến với các chủ đề bao gồm nhiều biến không phải là dự án tầm thường. May mắn thay, có rất nhiều plugin chủ đề được đánh bóng có sẵn để tải về.

Atom là một trình soạn thảo vững chắc và nó sẽ phù hợp với nhiều lập trình viên.

Sublime Text

Sublime Text là một trình soạn thảo trả phí nhưng bản dùng thử miễn phí có sẵn. Nó không được tải sẵn nhiều plugin để bắt đầu, nhưng tất nhiên chúng có sẵn để giải quyết bất kỳ nhu cầu nào bạn có thể có. Một số gói như SideBarEnhancements để đổi tên, di chuyển, sao chép và dán có lẽ nên được tích hợp vào gói lõi nhưng bạn có thể tải xuống để kích hoạt chức năng này.

Tương tự như Atom, có thể mất một chút thời gian để thiết lập mọi thứ. Nhưng một khi đã chạy và chạy, trải nghiệm rất trơn tru. Tiết kiệm mất tập trung cũng có sẵn.

Sublime Text rất hay vì nó nhẹ, giúp tải rất nhanh và làm việc với các dự án hoặc tệp lớn. Việc triển khai tính năng "goto anything" nổi bật vì nó có thể được sử dụng với tên tệp, ký hiệu và số dòng. Hầu hết các IDE cung cấp các tính năng tương tự ở dạng này hay dạng khác, nhưng có thể kết hợp chúng và tìm kiếm với các truy vấn như " fileName @ functionName " khá hay.

Chọn một biến sẽ chọn tất cả các lần xuất hiện của biến đó và đổi tên nó tự động đổi tên tất cả các lần xuất hiện, vì vậy tác vụ chung này trở thành một trải nghiệm rất hợp lý.

Theo nhiều cách, Sublime Text rất giống với Atom. Nhưng Sublime Text có lợi thế với hiệu suất và khả năng phản hồi tốt hơn, rất tuyệt vời.

VIM

VIM cũng là một trình soạn thảo văn bản miễn phí và rất cấu hình. Ban đầu được đặt tên là vi và trình soạn thảo văn bản đầu tiên được phát triển cho Unix, sau đó nó được mở rộng thành một trình soạn thảo giàu tính năng hơn có tên là Vim. Nó có sẵn trên hầu hết các bản phân phối Linux.

Vim có khả năng làm nổi bật cú pháp và tìm kiếm mạnh mẽ, và nó rất nhẹ nên nó có thể hoạt động tốt với các tệp thậm chí rất lớn. Nhưng nó đòi hỏi một số công việc để thiết lập và sẵn sàng sử dụng.

GUI có sẵn, nhưng nó không phải là giao diện mặc định cho Vim. Ngay cả việc kích hoạt hỗ trợ chuột cũng cần một số hành động để làm cho nó hoạt động. Mặc định là chế độ bàn phím mà một số người có thể thích truy cập mọi điều khiển và tính năng thông qua các phím tắt.

Điều đó đang được nói, Vim có thể là IDE hoàn hảo của bạn nếu bạn dành thời gian tìm hiểu phần mềm và phần mềm và thiết lập tất cả các hành vi và tính năng bạn muốn trong đó. Nếu bạn bị khủng hoảng thời gian và không thể đầu tư ban đầu để thu hút mọi thứ, Vim có thể không phải là lựa chọn tốt nhất cho bạn.

WebStorm

WebStorm được JetBrains phát triển và nổi bật so với phần còn lại là một IDE JavaScript thực sự, vì nó có tất cả các tính năng được tích hợp ngay bên ngoài. Môi trường phát triển cho các nền tảng khác nhau như React, Angular, Vue.js, v.v. là liền mạch. Bạn có thể gỡ lỗi các tập lệnh nút và chạy thử nghiệm trên máy chủ tích hợp. Bạn cũng có thể thực thi và gỡ lỗi các tập lệnh npm thông qua giao diện dạng cây. Và nó không yêu cầu bất kỳ plugin nào để làm điều này.

Tuy nhiên, plugin có sẵn cho một số tính năng hiếm không được tích hợp trực tiếp vào phần mềm. Một plugin không được bao gồm theo mặc định là cửa sổ chỉnh sửa / xem trước phân tách đánh dấu. Nhưng đối với hầu hết mọi thứ bạn có thể cần đã ở đó. Điều tuyệt vời ở đây là bạn sẽ khám phá ra các tính năng mà bạn không biết đã tồn tại và thật tuyệt vời khi có chúng.

Các tệp lưu tự động khi bạn làm việc trên chúng theo mặc định. Khi bạn sử dụng một ứng dụng khác không làm điều này, việc lưu thủ công sẽ tạo cảm giác rất thô sơ. Mặc dù nó không phải là duy nhất cho WebStorm, nhưng việc triển khai sẽ đẹp hơn một chút.

Một số người có thể không luôn tin tưởng vào tính toàn vẹn của ngăn xếp trạng thái ctrl-z, nhưng trong WebStorm có hệ thống VSC được xây dựng, về cơ bản thực hiện một cam kết mỗi khi tệp được lưu. Đây là nội bộ và tách biệt với cam kết git của bạn. Tệp lưu ít nhất bất cứ khi nào cửa sổ nội dung tệp mất tập trung. Vì vậy, nếu bạn đi một lúc mà không cam kết git và phải quay lại hoặc nhìn thấy trạng thái trước đó sau lần cam kết cuối cùng của bạn, thì không vấn đề gì.

Mẹo : Mũi tên Ctrl-shift-lên / xuống cho phép bạn di chuyển các dòng hoặc khối mã lên hoặc xuống trong khi trình chỉnh sửa tự động xử lý dấu phẩy / khối dấu ngoặc.

Khi bạn làm việc trên các dự án có nhiều tệp, việc cuộn cây tệp để tìm kiếm một tệp cụ thể có thể làm bạn chậm lại. Nhưng nếu một trong những mục đó đã được mở và trong tiêu điểm, nhấp vào biểu tượng đích sẽ cuộn chế độ xem dạng cây dự án vào tệp này. Nó rất tiện lợi.

Một vài khuyết điểm là nó không miễn phí. Và đôi khi, nó có thể là một con heo nhớ với các dự án rất lớn. Nó đã trở nên tốt hơn trong những năm qua và nội dung tệp được lập chỉ mục nội bộ để tìm kiếm các dự án lớn rất nhanh. Một bản cập nhật gần đây cũng bao gồm một sự cải thiện đáng kể về tốc độ khởi động.

Lời khuyên về hiệu năng

Phím tắt lựa chọn / dòng trùng lặp (trong WebStorm: ctrl-d, trong Atom: ctrl-shift-d, nhưng tất cả đều có thể làm được) là một trong những mục yêu thích của tôi và có thể tiết kiệm rất nhiều thời gian trong nhiều tình huống mã hóa.

Điều này sẽ xuất hiện theo thời gian khi bạn có một danh sách các mục và phải sửa đổi ký tự đầu tiên (hoặc một số) trên mỗi dòng từ '.' để ',' nhưng tìm-thay thế là không thực tế để sử dụng. WebStorm cho phép nhấp chuột để đặt nhiều con trỏ để thực hiện các chỉnh sửa giống nhau ở nhiều nơi. Tuy nhiên, tôi thấy cách tiếp cận sau nhanh hơn trong một số tình huống:

Đặt con trỏ của bạn sau khoảng thời gian đầu tiên và bắt đầu thực hiện thay đổi theo cách thủ công. Nhấn backspace, dấu phẩy, mũi tên xuống. Có một ngón tay trên mỗi phím, và lặp lại các lần nhấn bắt đầu từ từ sau đó tăng tốc khi bạn đi. Khi bạn nhận được mô hình, bạn có thể tăng tốc đến nơi bạn sẽ đi qua danh sách 200 dòng ngay lập tức. Nó gần giống như chơi một giai điệu trên piano (nhanh nhất có thể). Bạn có thể làm điều này với danh sách đánh số là tốt. Viết dòng đầu tiên không có số, nhân đôi dòng 9 lần và thực hiện cùng một quy trình ngoại trừ có một ngón tay bấm một số tiếp theo mỗi lần. Bắt đầu 10 dòng tiếp theo với '1' và thực hiện quy trình tương tự thêm một chữ số sau mỗi '1'.

Nếu bạn google [tên biên tập viên], bạn có thể nhận được một bản tóm tắt nhanh từ người dùng về cấu hình hoặc phím tắt quan trọng cho trình chỉnh sửa bạn đang thử. In nó và đọc tất cả các phím tắt để nhận biết các tính năng và chức năng mới mà bạn có thể không được tiếp xúc.

Xem xét làm thế nào các hành động được tô sáng có thể cải thiện các quy trình hiện tại của bạn sẽ có lợi. Nếu bạn thấy một cái có thể giúp ích, hãy đặt một dấu bên cạnh nó để lần sau bạn gặp tình huống, thật dễ để nhớ lại. Ngay cả khi bạn sử dụng nó hiếm khi và chủ yếu ngay từ đầu, việc có một tài liệu tham khảo nhanh trong tay có thể giảm ma sát để tìm hiểu thêm về trình soạn thảo của bạn và có thể tiết kiệm thời gian chuyển đổi và tìm kiếm bối cảnh trong tương lai.

Tôi đi xa như tìm phiên bản PDF, in và dán trang để tham khảo trong tương lai, nhưng đối với một số dấu trang hoặc ảnh chụp màn hình cũng có thể hoạt động tốt.

Kết luận

Nếu bạn là người mới bắt đầu hy vọng học JavaScript và sử dụng môi trường phát triển bóng bẩy để bắt đầu, VSCode là lựa chọn rõ ràng vì nó dễ sử dụng với nhiều tính năng mạnh mẽ được tích hợp.

Đối với các nhà phát triển có kinh nghiệm hơn, những người biết chính xác những gì họ muốn, Sublime và Atom có ​​thể thích hợp hơn vì họ sẽ cung cấp cho bạn quyền kiểm soát hoàn toàn đối với môi trường nhà phát triển của bạn. Bạn có thể chọn từ hàng ngàn tính năng (gói) để cài đặt và giữ cho ứng dụng khởi động và sử dụng tài nguyên không có các tính năng bổ sung mà bạn không cần hoặc không muốn. Dành thời gian cho từng người sẽ giúp bạn có sự lựa chọn đúng đắn.

Đối với những người dùng có năng lực cốt lõi, những người cảm thấy như ở nhà khi sử dụng bàn phím một mình làm việc trong các dự án, bạn có thể hiệu quả với Vim hơn bất kỳ trình soạn thảo nào khác. Tiết kiệm thời gian để bàn tay của bạn di chuyển giữa bàn phím và chuột sẽ tăng lên, nhưng sẽ mất một thời gian để làm chủ quá trình này!

Cuối cùng, nếu bạn không duy trì đăng ký trả phí và không quan tâm đến các hạn chế về bộ nhớ hoặc CPU của máy phát triển, WebStorm sẽ giúp bạn khởi động và chạy nhanh bất kể nền tảng phát triển JavaScript, bộ chuyển mã hoặc xây dựng các quy trình bạn làm việc. Nó cung cấp một môi trường rất thuận tiện để làm việc.

Cá nhân tôi sử dụng WebStorm làm IDE chính của mình, nhưng vẫn thường xuyên sử dụng VSCode để chỉnh sửa các tệp riêng lẻ hoặc rất lớn khi hiệu suất là ưu tiên.

Nguồn: https://www.freecodecamp.org/news/how-to-choose-a-javascript-code-editor/