Extension VSCode – 23 công cụ đỉnh nhất cho Front End / React JS

Visual Studio Code là một trong những trình viết code phổ biến nhất. Đặc điểm nổi bật là đơn giản, gọn nhẹ, dễ dàng cài đặt. VSCode có thể cài đặt được trên cả Windows, Linux và Mac OS và hỗ trợ nhiều ngôn ngữ. Bài viết này sẽ chia sẻ danh sách về extension VSCode HTML / CSS / JS / React và được sắp xếp theo thứ tự bảng chữ cái.5 min


1071
1.7k shares, 1071 points

Extension VSCode

Bracket Pair Colorizer

Extension trong VSCode này cho phép các dấu ngoặc phù hợp được xác định bằng màu sắc. Người dùng có thể xác định các ký tự phù hợp và màu sắc sẽ sử dụng.

extension vscode
Bracket Pair Colorizer

change-case

Extension giúp thay đổi từ UpperCase sang camelCase hoặc bất cứ trường hợp khác theo ý bạn

extension vscode
change-case

Code Spell Checker

Kiểm tra chính tả, đặc biệt tốt đối với kiểu camelCase. Giúp bạn kiểm soát lỗi về chính tả thấp nhất để giữ được ngữ nghĩa.

extension vscode
Code Spell Checker

File Utils

Một cách nhanh chóng để tạo, sao chép, di chuyển, đổi tên và xóa các tập tin hoặc các thư mục.

extension vscode
File Utils

file-icons

Các icon của file thay đổi để có thể kiểm soát và nhìn dễ dàng theo cảm nhận riêng.

extension vscode
file-icons

Find Related Files

Đúng như cái tên, tìm những file có tên liên quan đến file hiện tại.

extension vscode
Find Related Files

FiraCode

Extension dùng để thay đổi các font chữ chẳng hạn như !===>, …. để biểu tượng đẹp hơn

extension vscode
FiraCode

GitLens

Khả năng Git tích hợp với VSCode đến tuyệt vời. Có một cái nhìn trực quan về mọi thứ chẳng hạn như sự thay đổi code, các log git, mọi thứ nhanh chóng và dễ dàng hơn trong Extension VSCode

extension vscode
GitLens

indent-rainbow

Tô màu những khoảng trống trước đoạn code, để code clean hơn, dễ nhìn hơn.

indent-rainbow
indent-rainbow

Markdown All in One

Tất cả bạn cần để viết Markdown (phím tắt, xem trước và có thể làm nhiều hơn thế nữa).

Markdown All in One
Markdown All in One
Markdown All in One 2
Markdown All in One

Material Icon Theme

Biểu tượng lấy cảm hứng từ Material-UI thay thế cho file icon

Material Icon Theme
Material Icon Theme

Multi Line tricks

Kích hoạtAlt + L (chọn dòng) và Alt + Shift + L (lựa chọn cho nhiều con trỏ) trên VSCode. Một tính năng đến từ Sublime.

Multi Line tricks
Multi Line tricks

Nest Comments

Code của bạn đã chứa đoạn comment và bạn muốn thêm comment thì đây là extension bạn cần

Extensio này chuyển đổi comment có sẵn thành các ký tự an toàn, cho phép comment mới bao gồm comment ban đầu. Và cũng làm điều ngược lại để loại bỏ comment mới

Nest Comments
Nest Comments
Nest Comment 2
Nest Comments

open-in-github VSCode

Chỉ đơn giản là mở project hoặc file trên github.com nhanh chóng

open-in-github
open-in-github

Path Intellisense

Extension giúp bạn autocomplete filenames để có thể code dễ dàng hơn

Path Intellisense
Path Intellisense

Project Manager

Bạn có thể thay đổi giữa các project đơn giản

Project Manager
Project Manager

Visual Studio IntelliCode

The Visual Studio IntelliCode giúp bạn code nhanh nhờ sự hỗ trợ AI dựa trên ngữ cảnh trong Extension VSCode

extension vscode
Visual Studio IntelliCode

Extensions HTML/CSS/JS/React

Auto Rename Tag

Tự động đổi tên thẻ HTML / XML

Auto Rename Tag
Auto Rename Tag

eslint-disable-snippets

Bao gồm các đoạn để bỏ qua, dòng hiện tại hoặc dòng tiếp theo.

.

eslint-disable-snippets
eslint-disable-snippets

glean

Cho phép trích xuất codejavascript vào mô-đun riêng biệt, cũng như trích xuất JSX vào file mới

glean

javascript console utils

Giúp thêm hoặc xoá console

javascript console utils
javascript console utils

npm Intellisense

Autocomplete import mô-đun npm

npm Intellisense

Theme

Dracula Official

Dracula Official
Dracula Official

Kết luận

Trên đây là những extension và plugin tốt nhất dựa trên sự trải nghiệm của bản thân tôi. Mong giúp bạn có thể tạo ra những project nhanh chóng và tốt nhất với sự trợ giúp trên Visual Studio Code.

Tham khảo thêm về Debug tại đây : Từng bước debug NodeJs trong Docker không dùng


Like it? Share with your friends!

1071
1.7k shares, 1071 points

What's Your Reaction?

hate hate
0
hate
confused confused
1
confused
fail fail
1
fail
fun fun
1
fun
geeky geeky
1
geeky
love love
1
love
lol lol
0
lol
omg omg
0
omg
win win
0
win