VSCode là gì?
VSCode hay còn gọi là Visual Studio Code là phần mềm soạn thảo code mã nguồn mở được phát triển bởi Microsoft, sử dụng để xây dựng các website, ứng dụng hoàn toàn miễn phí với sự hổ trợ đa dạng các loại ngôn ngữ khác nhau cùng với vô vàng extension đi cùng để hổ trợ lập trình viên.
Lý do khiến cho VSCode trở nên phổ biến đến như vậy là nhờ vào kho extension vô cùng phong phú hổ trợ lập trình viên và không ngừng cập nhật.
Vì sao nên cài extension cho VSCode?
Việc cài đặt các extension hay cho VSCode sẽ giúp bổ sung tính năng cho nó, hổ trợ, phục vụ cho mục đích học tập, công việc của lập trình viên. Bao gồm:
- Hổ trợ các công việc liên quan đến kiến thức như quản lí database, gở lỗi.
- Cập nhật thêm ngôn ngữ lập trình mới vào VScode.
- Giúp người dùng tạo ra các tính năng ảo giúp trải nghiệm tốt hơn.
- Giúp thao tác người dùng nhanh hơn bằng việc tạo ra các lỗi tắt từ đó giúp công việc của lập trình viên nhanh chóng hơn.
- Giúp code đẹp hơn, gọn gàng hơn, dể nhìn dể đọc và dể hiểu.
Không để các bạn đợi lâu nửa, hãy cùng Lùn Dev xem thử top 10 extension hay nhất của VScode nhé.
Các extension hay cho VSCode hay nhất
1. CSS Peek
Nhiều lập trình viên đánh giá CSS Peek là một trong các extension hay cho VSCode, là plugin tuyệt vời để sử dụng với VSCode. CSS Peek giúp người lập trình viên di chuyển nhanh chóng đến nơi định nghĩa các class và id của css. Lập trình viên chỉ cần nhấp chuột phải vào một selector và chọn “Go to Definition”. Peek sẽ nhanh chóng chuyển bạn đến đúng file, vị trí mà class và id đó được định nghĩa.
Extension này khiến việc tìm kiếm class và id để nhanh chóng thực hiện chỉnh sửa những đoạn code. Ngoài ra, nó cũng nhảy ngay lập tức đến phần khai báo được nhắc đến trong file CSS. Từ đó, rút ngắn thời gian hoàn thiện công việc đến mức tối đa bởi vì chúng ta không cần tìm kiếm, chỉ cần một click là song.
2. Live SERVER
Live Server là một tiện ích dành cho VSCode giúp lập trình viên đỡ khổ khi cần phải phát triển một trang web. Extension này được phát triển trên một bộ core cùng tên, tích hợp thêm nhiều tính năng, nhưng chung quy lại vẫn xoay quanh 2 tính năng cơ bản sau:
Prettier - Code formatter giúp lập trình viên định dạng lại code một cách tự động và tạo ra một phong cách code chung cho team lập trình thông qua quy tắc riêng được quy định bởi extension. Nó hộ trợ đa dạng các loại ngôn ngử từ HTML, CSS, Javascript, PHP...
4. ESLint
ESLint là một công cụ phân tích code trong hệ thống nhằm đưa ra các lỗi cũng như những đoạn code cần phải cải thiện lại và cung cấp cho lập trình viên những gợi ý về giải pháp làm sao cho đoạn mã trở nên ngắn gọn và sạch sẽ hơn.
Lập trình viên hoàn toàn có thể tùy chỉnh ESLint để những gợi ý được đưa ra phù hợp với phong cách củng như mục đích code của mình.
5. Bracket Pair Colorizer
Bracket Pair Colorizer là tiện ích mở rộng giúp làm nổi bật những dấu ngoặc tương ứng trong đoạn code với nhau bằng cách sử dụng màu sắc. Nó giúp lập trình viên có thể dễ dàng phát hiện những dấu ngoặc còn thiếu hay có cái nhìn trực quan khi có quá nhiều ngoặc lồng vào nhau trong đoạn code.
6. Clipboard Manager
Clipboard Manager giúp lập trình viên dể dàng ghi nhớ những đoạn code đã copy trước đó để dể dàng tái sử dụng lại nhờ đó lập trình viên sẽ không mất quá nhiều thời gian khi phải tìm và copy từng đoạn code và dán vào liên tục.
Thay vào đó lập trình viên có thể copy một lần tất cả sau đó tiến hành paste lần lược ra.
Dracula Official chính là một extension mở rộng với mục đích làm đẹp cho code rất phổ biến với tông màu neon, phông chử đẹp và hổ trợ rất nhiều ngôn ngử khác nhau từ HTML, CSS, Javascript, PHP,... giúp lập trình viên nhìn code đẹp hơn và dể nhìn hơn.
8. Gitlens
Gitlens là một extension tuyệt vời trong VScode giúp bạn làm việc đơn giản hơn với GIT bằng việc nắm mọi thông tin về dự án của bạn trên GIT, từ củ nhất đến mới nhất, cho bạn thấy được sự thay đổi trong lịch sử ở từng dòng.
9. Polacode
Polacode là một extension thú vị của VSCode được xin ra với mục đích giúp lập trình viên chụp lại đoạn code của mình một cách đẹp hơn, dể nhìn hơn, giữ đúng form, đúng khung hình và màu sắc của code khi chụp.
10. Auto Rename Tag
Auto Rename Tag là một extension rất hay trong VSCode đặt biệt dành cho những lập trình viên làm việc với code HTML. Auto Rename Tag hổ trợ lập trình viên đổi tên phần đuôi của một thẻ element khi họ chỉ đang cố gắng sửa phần mở của nó.
Cụ thể khi bạn muốn sửa một thẻ tag từ thẻ a sang thẻ div bạn cần phải sửa div tại vị trí mở <div> và </div> tại vị trí đóng. Thì với Auto Rename Tag khi nó bắt được sự kiện bạn đang muốn đổi giá trị cho thẻ tag nó sẽ hổ trợ bạn điền luôn phần còn lại ở thẻ đóng.
Kết luận
Bên trên chính là một vài extension hay của Vscode mà Lùn Dev thường xuyên sử dụng muốn chia sẽ với mọi người. Còn rất nhiều extension hay nửa hảy đợi ở bài viết sau nhé.