9 Trình chỉnh sửa mã trực tuyến tốt nhất cho các ứng dụng web

Điều gì là điều tốt nhất tiếp theo để mã hóa? Trình chỉnh sửa mã, tất nhiên!


Trình chỉnh sửa mã là lý do quan trọng thứ hai cho các cuộc chiến ngọn lửa của lập trình viên (lý do đầu tiên là định dạng mã).

Đối với một số người, Vim là biên tập viên hợp lý duy nhất từng được tạo ra, trong khi với những người khác, mọi thứ không phù hợp với thế giới xoay tròn giống như tinh thần của Emacs chỉ phù hợp với sự chế giễu. Nếu bạn rất khó tìm kiếm sự chú ý, tất cả những gì bạn cần làm là vào một cộng đồng lập trình và bắt đầu một chủ đề như Từ Tại sao tôi nghĩ X (chọn bất kỳ trình soạn thảo mã phổ biến nào) hút / là tốt nhất, hãy lấy một ít bia và thư giãn.

Tranh luận, phản biện và lăng mạ sẽ liên tục đổ vào và thảo luận suốt đêm, và sẽ mất nhiều tháng trước khi nọc độc trong luồng sẽ nguội đi.

Câu hỏi là: tại sao?

Chắc chắn, con người quản lý để tạo ra một vấn đề lớn từ tất cả mọi thứ, nhưng tôi nghĩ rằng các trình soạn thảo mã là đặc biệt khi nói đến các lập trình viên. Một lập trình viên điển hình dành gần như toàn bộ thời gian của họ (Hơn 98%, nếu tôi đánh cuộc) cho trình soạn thảo mã lựa chọn. Họ biết cách của họ xung quanh biên tập viên – điểm mạnh, điểm yếu, giới hạn, sự kỳ quặc và những viên ngọc ẩn.

Không có gì khó chịu hơn việc phải vật lộn với trình soạn thảo khi bạn viết mã (hãy nghĩ rằng thật khó chịu khi bạn phải bắn một email dài và khẩn cấp trên bàn phím mới!). Trình chỉnh sửa mã giảm ma sát tinh thần và cho phép bạn làm việc hiệu quả hơn, đó là lý do tại sao họ rất quan trọng và nhận được nhiều sự chú ý.

Vì vậy, đó là trình soạn thảo mã tốt nhất?

Thành thật mà nói, tôi đã thắng được thậm chí dám đến đó! �� ��

Tuy nhiên, nếu bạn tham gia phát triển Web, thì có một cách khác tôi muốn bạn nghĩ đến – các trình soạn thảo mã trực tuyến!

Tóm lại, đây là những trình soạn thảo nằm hoàn toàn trên một máy chủ từ xa và có thể truy cập thông qua trình duyệt.

Nghe có vẻ lạ đúng không??

Tôi cũng cảm thấy như vậy khi tôi bắt gặp họ 3-4 năm trước. Tại sao địa ngục nên ai đó muốn bàn giao mọi thứ cho một trình duyệt ngu ngốc?

Nó thậm chí có thể cạnh tranh với một trình soạn thảo mã được cài đặt hữu ích?

Hóa ra trong hầu hết các trường hợp và đặc biệt là phát triển Web, câu trả lời là có. Bây giờ, trong khi tôi thiên đường ôm ấp các biên tập viên trực tuyến làm phương tiện chính của mình, tôi thấy mình sử dụng chúng ngày càng nhiều hơn trong các tình huống cụ thể.

Trước khi chúng tôi đi sâu vào việc sử dụng các trình soạn thảo mã nào, hãy tạm dừng và suy nghĩ khi nào các trình soạn thảo mã trực tuyến có thể có ý nghĩa.

Không thiết lập

Tôi không biết về bạn, nhưng thiết lập trình soạn thảo yêu thích của tôi theo ý thích của tôi trên một hệ thống mới không phải là điều gì đó mà tôi mong chờ. Plugin, chủ đề, phông chữ, phím tắt, đoạn trích, cài đặt. . . Có một danh sách vô tận những thứ phải được cân bằng trước khi toàn bộ có thể sử dụng được. Nó dễ dàng bỏ qua một cái gì đó, chỉ để sau này bị làm phiền khi quy trình làm việc của bạn bị gián đoạn.

Ngược lại, không có gì để làm với trình soạn thảo trực tuyến khi quá trình thiết lập đầu tiên kết thúc. Bản dựng chính thức, bản cập nhật, bản dựng hàng đêm, nền tảng được hỗ trợ, kiến ​​trúc hệ thống, đồng bộ hóa FTP, đường ống CI / CD – không có vấn đề nào miễn là bạn có trình duyệt!

Hợp tác

Thường xuyên hơn không, bạn cần cộng tác với các nhà phát triển khác khi giải quyết vấn đề hoặc gỡ lỗi một cái gì đó.

Trình chỉnh sửa mã truyền thống được xây dựng cho điều này – không có phạm vi nào để chỉnh sửa, nhận xét hoặc tô sáng mã đồng thời, và điều đó đầy thách thức để thêm hỗ trợ cho nó.

An toàn dữ liệu

Bây giờ, nó có một điều chắc chắn là ngày nay không có dự án nào không có kiểm soát phiên bản, điều đó có nghĩa là một bản sao của mã tồn tại trên kho lưu trữ mọi lúc. Điều đó nói rằng, có những lúc kiểm soát phiên bản là không đủ:

  • Bạn quên đẩy các cam kết mới được tạo và máy tính xách tay của bạn bắt lửa.
  • Bạn có các tệp dữ liệu và kết xuất dữ liệu quan trọng khác mà mã của bạn tương tác, mặc dù đây không phải là một phần của ứng dụng trực tiếp. Điều gì xảy ra với họ nếu máy tính xách tay của bạn bắt lửa?

(Được rồi, có vẻ như tôi bị ám ảnh bởi những cuốn sổ bắt lửa, nhưng bạn hiểu rồi đúng không?!)

Thi hành kỷ luật

Điều này cũng có thể được tranh luận chống lại tòa án về quyền của nhà phát triển (nếu điều đó tồn tại), nhưng sự thật của vấn đề là các nhà phát triển hiếm khi hy sinh ý tưởng bất chợt của họ vì lợi ích chung.

Chẳng hạn, một người say mê văn bản siêu phàm khó tính sẽ nắm bắt hoàn toàn bất kỳ biên tập viên xuất sắc nào của JetBrains, và sẽ tìm mọi cơ hội để chỉ vào bản chất đói bộ nhớ và hiệu suất chậm hơn.

Điều tương tự cũng xảy ra với các tab so với khoảng trắng (hoặc thậm chí các tab hai không gian so với các tab bốn không gian) – bạn có thể ngây thơ nếu bạn nghĩ rằng các lập trình viên trong nhóm của bạn sẽ không khóa còi.

Trong những trường hợp như vậy, một trình soạn thảo trực tuyến là một lợi ích – bạn quyết định cài đặt cho các dự án (ngay cả cách mã phải được định dạng) và đơn giản là nó sẽ từ chối chấp nhận công việc cho đến khi tuân thủ tất cả các tiêu chuẩn. Khắc nghiệt về cá nhân, có lẽ, nhưng tuyệt vời cho dự án!

Đến bây giờ, tôi đã hết các trường hợp sử dụng, vì vậy, hãy nhanh chóng sử dụng tùy chọn nào khi nói đến các trình soạn thảo mã trực tuyến, đặc biệt là phát triển Web.

Câu đố

Trong khi Câu đố có thể thay thế một trình soạn thảo văn bản chính thức, nó thực hiện tốt công việc xử lý các tập lệnh ngoại vi một lần.

Nó rất phổ biến đến nỗi Q&Một trang web như StackOverflow đã hỗ trợ nhúng các liên kết JSFiddle trực tiếp trong nền tảng của họ.

Để bắt đầu mọi thứ một cách nhanh chóng, JSFiddle cung cấp một số mẫu lò hơi khi bắt đầu; có nghĩa là nếu bạn muốn có một bản demo, giả sử, React, đã bắt đầu, tất cả những gì bạn cần làm là nhấp vào nút có liên quan và bắt đầu viết mã. Khi bạn nhấn Save, fiddle của Fig được lưu, bạn sẽ nhận được một URL vĩnh viễn (Hãy xem fiddle ngớ ngẩn này tôi đã tạo: https://jsfiddle.net/tuqd76c4/ và lưu ý rằng bạn có thể thực hiện các thay đổi của mình và nhấn Save để tạo mới phiên bản của URL này).

Đây là những gì làm cho JSFiddle trở thành một nền tảng khả thi để phát triển web mặt trước:

  • Miễn phí sử dụng (không có phí ẩn hoặc tính năng freemium). JSFiddle tự hỗ trợ thông qua quảng cáo (ít nhất là bằng văn bản) và bạn có thể thấy quảng cáo Adobe ở phía dưới bên trái của ảnh chụp màn hình ở trên.
  • Các tính năng cộng tác mã – lý tưởng để xây dựng các khái niệm cùng nhau, các cuộc phỏng vấn, v.v..
  • Nhiều bố cục, kích thước phông chữ, chủ đề sáng / tối, v.v..
  • Định dạng mã (sắp xếp), hỗ trợ sắp tới cho các linters (CSS và JS) và hơn thế nữa.

Và bây giờ, nức nở, nức nở, cho những thứ xấu:

  • JSFiddle là một trình soạn thảo hoàn toàn phía trước. Không có cách nào để mã hóa và chạy ngôn ngữ phụ trợ yêu thích của bạn.
  • Có một khái niệm về các tập tin và thư mục ở đây (hoặc tải lên, cho vấn đề đó). Tất cả những gì bạn có là một không gian duy nhất cho mã, bất kể nó có bao nhiêu.
  • Không thể sử dụng JSFiddle để lưu trữ mã trên máy chủ của bạn. Mã phải có trên JSFiddle và luôn công khai.
  • Không có cách nào để xây dựng một đường ống CI / CD, sử dụng Git, v.v..

Điều đó nói rằng, JSFiddle có điểm ngọt ngào và tỏa sáng khi bạn cần loại bỏ các bằng chứng về khái niệm và hợp tác với tốc độ ánh sáng. Nó đã và sẽ vẫn là một bản sắc chính trong số các biên tập viên trực tuyến.

CodeSandbox

CodeSandbox có thể được coi là một công cụ mạnh mẽ và hoàn thiện hơn nhiều đối với JSFiddle. Đúng như tên gọi của nó, CodeSandbox cung cấp trải nghiệm soạn thảo mã hoàn chỉnh và môi trường hộp cát để phát triển front-end.

CodeSandbox là một thế lực thực sự và sản phẩm ngọt ngào, ngọt ngào. Tôi đã hết giấy nếu tôi cố gắng liệt kê tất cả các ưu điểm của nó, nhưng đây là một số tính năng giết người:

  • Hỗ trợ Npm: Có, bạn có thể thêm khá nhiều gói có sẵn vào npm.
  • Tập tin, thư mục, mô-đun: Bạn có thể chia mã của mình thành nhiều tệp, thêm / xóa hình ảnh khỏi thư mục công cộng và xây dựng / nhập các mô-đun khi bạn thấy phù hợp. Quy trình công việc phản ánh rằng một bộ đóng gói mô-đun hiện đại, vì vậy bạn không cần phải thiết lập (gần như) bất cứ thứ gì.
  • Hỗ trợ TypeScript, tải lại nóng, xuất GitHub, lưu trữ tệp tĩnh, v.v..
  • Nó được xây dựng trên Biên tập viên của Monaco, cùng một con thú có sức mạnh yêu thích VSCode biên tập viên. Điều này mang lại các tính năng mạnh mẽ như Đi tới, xông vào Tìm các tài liệu tham khảo, trực tiếp và tái cấu trúc cần thiết trong tầm tay của bạn!
  • Đoạn trích hỗ trợ cho Emmet
  • DevTools tích hợp, linting, lớp phủ lỗi, khung thử nghiệm (Jest), keybindings, v.v..
  • Cli mạnh mẽ để nhập trực tiếp các dự án địa phương vào CodeSandbox.

Mặc dù phiên bản miễn phí của CodeSandbox không hỗ trợ mã riêng tư, bạn có thể có được tính năng đó (và tăng giới hạn kích thước tổng thể) bằng cách giúp họ bật Patreon chỉ với $ 5 một tháng (trả những gì bạn muốn, tối đa $ 50 một tháng).

Mã ở mọi nơi

Một vấn đề với hầu hết các trình soạn thảo mã trong danh sách này (ít nhất là cho đến nay) là họ mong đợi bạn giữ mã trên máy chủ của họ mọi lúc hoặc yêu cầu bạn thường xuyên đồng bộ mã qua dòng lệnh.

Không như vậy với Mã ở mọi nơi.

Ở điểm mạnh nhất, CodeAnywhere có hai tính năng nổi bật đối với tôi:

  • Hình ảnh chứa sẵn cho 72+ ngôn ngữ lập trình và khung. Điều này có nghĩa là bạn có thể cung cấp một môi trường phát triển mới ngay từ trong trình chỉnh sửa! Tất nhiên, mã sẽ tự động được lưu trữ trên vùng chứa mới được tạo và các tệp được cung cấp trực tiếp từ đó.
  • Kết nối với bất cứ điều gì. Vâng, nghĩa đen là bất cứ điều gì. Bạn không bắt buộc phải lưu trữ mã của mình trên các máy chủ CodeAnywhere. Cho dù mã của bạn nằm trên FTP, các nền tảng chia sẻ tệp như Dropbox, Amazon S3 hoặc trên các nền tảng kiểm soát phiên bản tinh vi như GitHub, bạn có thể dễ dàng thiết lập CodeAnywhere để đọc và ghi vào nguồn đó, hoàn toàn sử dụng trình chỉnh sửa mã. . . Vâng, chỉnh sửa mã. ��

Một điều nữa tôi cảm thấy muốn chỉ ra: nếu bạn không thoải mái với Git khi xem lịch sử và sự khác biệt, CodeAnywhere có thể cảm thấy như một tiếng thở phào nhẹ nhõm. Trình chỉnh sửa sử dụng hệ thống tìm khác biệt của nó để so sánh các tệp, cho phép bạn so sánh hai tệp qua bất kỳ hai phiên bản nào (bản sửa đổi được tạo mỗi khi bạn lưu tệp).

Tuy nhiên, có một chút khó khăn với các phiên bản – phiên bản miễn phí cho phép bạn duy trì một phiên bản duy nhất, trong khi gói trả phí nhỏ nhất cho phép tối đa 20 phiên bản. Nói chung, nó không phải là vấn đề vì bạn hiếm khi muốn nhìn xa hơn bản sửa đổi thứ 20 vừa qua, nhưng vì hầu hết các lập trình viên có thói quen nhấn Save vài lần một phút, nó có thể trở nên đau đớn.

Tất cả đã nói và làm, CodeAnywhere là một đề nghị chắc chắn, dễ chịu cho những ai muốn chuyển đến Cloud và ở lại đó. Vì sức mạnh của nó vượt ra ngoài mã mặt trước, theo tôi, nó rất khuyến khích!

StackBlitz

Nếu bạn kết hợp với giao diện người dùng và không thể rời khỏi giao diện VSCode, StackBlitz được tạo ra chỉ dành cho bạn.

Thấy gì đặc biệt? Tôi đã làm quá cho đến khi tôi cuộn xuống một chút và nhấp vào nút Angular. Bùng nổ!

Đoán xem, cái mà không cố tình tạo ra trông giống như VSCode – nó được xây dựng trên trình soạn thảo VSCode! Vì vậy, bạn có thể cài đặt các tiện ích mở rộng, tìm kiếm thông qua các thư mục và sắp xếp các tệp theo cách bạn mong đợi từ một phiên bản VSCode thông thường.

Nhưng xin chờ chút nữa!

Bạn có thể hoặc có thể không nhận thấy rằng:

  • Tất cả các ứng dụng được tạo trên StackBlitz cũng được triển khai tự động trên máy chủ của họ! Vì vậy, ứng dụng đồ chơi Angular này tôi vừa tạo được lưu trữ tự động trên https://angular-yvyi2j.stackblitz.io/. Nhiều khả năng, URL vẫn hoạt động (tuy nhiên, sẽ tải chậm, như bạn mong đợi khi được lưu trữ miễn phí)!
  • Bạn có thể rẽ nhánh và chia sẻ dự án. Trong khi chia sẻ, bạn có quyền kiểm soát tốt hơn đối với những gì người khác có thể làm.
  • Bạn có thể kết nối với kho lưu trữ GitHub và cũng để mã được kéo / đẩy trực tiếp từ đó. Hoặc bạn có thể chỉ cần tải xuống dự án dưới dạng tệp zip theo cách tốt..

Nhưng xin chờ chút nữa!

Nghiêm túc! ��

Tại đây, danh sách các tính năng chính thức được cung cấp bởi StackBlitz:

  • Hỗ trợ riêng cho Firebase (đây là thứ tôi không thể sử dụng cá nhân, nhưng này, nó là một lợi ích cho những người không muốn lặn xuống độ sâu âm u của phần phụ trợ)
  • Intellisense, Tìm kiếm dự án
  • Tải lại nóng khi bạn gõ
  • Nhập gói npm
  • Chỉnh sửa ngoại tuyến khi không kết nối!

StackBlitz đầy những bất ngờ (đẹp) khi nói đến việc vượt qua những trở ngại từ việc phát triển và triển khai Web. Nhúng VSCode vào trang web của bạn không phải là thứ mơ ước nữa!

Đám mây AWS

Cloud9 được cho là IDE dựa trên trình duyệt đầu tiên cung cấp các tính năng nghiêm trọng và lấy ý tưởng về trình duyệt chính như trình soạn thảo. Không có gì ngạc nhiên khi Amazon sau đó có được nó, và ngày nay, Đám mây9 là một phần của dịch vụ AWS.

Nếu bạn thậm chí gắn bó từ xa với (hoặc quan tâm đến) nền tảng AWS, Cloud9 là nơi kết thúc quá trình tìm kiếm của bạn cho một trình soạn thảo hoàn hảo (ổn, gần như hoàn hảo). Hãy để xem tại sao:

  • Không có phí bổ sung cho việc sử dụng Cloud9. Bạn có thể kết nối Cloud9 với một phiên bản tính toán AWS hiện có / mới và bạn chỉ trả tiền cho trường hợp đó. Nó cũng có thể kết nối với máy chủ của bên thứ ba qua SSH – hoàn toàn miễn phí! ��
  • Hỗ trợ hạng nhất cho các ứng dụng AWS Serverless (gỡ lỗi, v.v.)
  • Thiết bị đầu cuối trực tiếp truy cập AWS từ bên trong trình chỉnh sửa (thành thật mà nói, một thiết bị đầu cuối được biên tập tốt, được gắn thẻ là điều tôi vẫn bỏ lỡ trong VSCode)
  • Hơn 40 ngôn ngữ lập trình được hỗ trợ (Go, C ++, Ruby, Node, Python, PHP, Java .. Hãy lựa chọn)

Các tính năng cộng tác trong Cloud9 cũng rất đáng mong đợi, cho phép đánh giá / phỏng vấn được tiến hành liền mạch.

Một tính năng giết người khác là phát lại theo kiểu video về các thay đổi được thực hiện đối với tệp, làm cho quá trình xem xét trở thành niềm vui:

Lời khuyên của tôi?

Nếu bạn có thể tham gia AWS, thì hãy chờ đợi và lấy Cloud9 ngay bây giờ. Và nếu bạn không ở trên đám mây nhưng đã nghĩ đến việc thực hiện một động thái, hãy nắm lấy AWS và tích hợp Cloud9 vào quy trình làm việc của bạn. Bạn có thể đưa ra quyết định tốt hơn!

CodeEnvy

CodeEnvy là một trình soạn thảo đám mây mạnh mẽ sử dụng các container Docker để cho phép bạn chạy các môi trường dev được cấu hình sẵn và bị cô lập. Nó được xây dựng trên IDE Eclipse đám mây nguồn mở và cung cấp rất nhiều tùy chọn khả năng mở rộng và DevOps.

Khi viết, CodeEnvy đã được mua lại bởi RedHat (điều thú vị là chính nó đã được Oracle mua lại!).

Gitpod

Gitpod là một cách làm mới đối với các trình soạn thảo mã đám mây (hoặc IDE, nếu bạn muốn) nhằm mục đích giữ cho mã của bạn luôn được kiểm tra và cập nhật. Nói cách khác, nó được tích hợp sâu với GitHub và mỗi khi bạn thêm mã, nó sẽ chạy các đường ống thử nghiệm và CI / CD của bạn để đảm bảo mã luôn ở mức 100% sức khỏe.

Đáng để kiểm tra nếu bạn yêu thích trải nghiệm VSCode và muốn một cái gì đó hỗ trợ tất cả các ngôn ngữ và khung công tác back-end / front-end chính (Django, Rails, Revel, bạn đặt tên cho nó).

Theia

Nếu bạn là một người hâm mộ RẮN cứng và một kiến ​​trúc sư phần mềm chọn nit, thì Theia IDE sẽ làm nhột xương của bạn. Nó có một IDE mã được mã hóa theo kiểu TypeScript (năm điểm cho phong cách ngay lập tức!) Có phần đầu và phần cuối hoàn toàn tách biệt. Giao diện người dùng chạy trong trình duyệt, trong khi phụ trợ có thể ở bất cứ đâu – máy cục bộ hoặc đám mây!

Nhưng đó không phải là tất cả – front-end có thể chạy như một ứng dụng Electron với môi trường trình duyệt tách biệt, đầy đủ chức năng, mang lại cho bạn giao diện của ứng dụng máy tính để bàn gốc nếu bạn khao khát.

Mã hóa

Mặc dù trang web của họ không nói rõ ràng như vậy, Mã hóa là một môi trường VSCode được gói trong một máy chủ có thể chạy cục bộ hoặc trên đám mây. Cấu hình được khuyến nghị là chạy IDE dưới dạng máy chủ trên đám mây và truy cập cục bộ qua trình duyệt. Có các hình ảnh Docker dựng sẵn cho các thiết lập không rắc rối và kế hoạch doanh nghiệp nếu bạn cần hỗ trợ hoặc có các nhu cầu khác nhau.

Phần kết luận

Điều này ít nhiều bao gồm tất cả các IDE và trình soạn thảo mã ngoài đó khi viết. Tôi đã bỏ qua hai loại dịch vụ trong danh sách này: những loại được tập trung hoàn toàn vào các cuộc phỏng vấn và không có môi trường đầy đủ (tất nhiên ngoại trừ JSFiddle cổ điển yêu thích của chúng tôi), và những loại dường như không cung cấp thứ gì đó đáng kể và có ít hơn một trang chủ kiểu dáng đẹp.

Nếu bạn nghĩ rằng một cái gì đó xứng đáng được ở đây, hãy cho tôi biết và tôi sẽ biết ơn! ��

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map