Các extension VSCode đặc biệt hữu dụng cho người mới!

9:00 17/10/2023

Trong VSCode, extension là những phần được phát triển để mở rộng tính năng, giúp bạn tăng hiệu suất làm việc, tăng tính tùy chỉnh và cải thiện trải nghiệm của bạn khi sử dụng VSCode. Vậy nên hãy cùng tìm hiểu về những extension VSCode bạn nên cài đặt để thuận tiện hơn trong quá trình học nhé!

Live sever

Live Server là một extension cho phép bạn tạo một máy chủ web tạm thời trên máy tính của mình để xem trực tiếp các trang web và ứng dụng web mà bạn đang phát triển. Khi bạn khởi động Live Server, nó sẽ tự động mở trình duyệt web và hiển thị trang web của bạn. Khi bạn chỉnh sửa mã nguồn của trang web, Live Server sẽ tự động tải lại trang web để bạn có thể xem các thay đổi của mình ngay lập tức.

Extension Live Sever

Prettier 

Prettier là một công cụ định dạng mã nguồn tự động. Nó giúp định dạng mã nguồn của bạn theo một cách chuẩn mực và đồng nhất, giúp cho mã nguồn dễ đọc hơn và dễ bảo trì hơn.Prettier đã hỗ trợ hầu hết các ngôn ngữ lập trình cho Front – end hiện tại.

Extension Prettier

CSS Peek

CSS Peek cho phép người dùng xem và chỉnh sửa CSS của một trang web trực tiếp từ trình soạn thảo. Nó cung cấp cho người dùng một cách nhanh chóng và dễ dàng để tìm kiếm các lớp CSS, các thuộc tính và giá trị của chúng, và xem trực tiếp các thay đổi được áp dụng trên trang web. CSS Peek cũng hỗ trợ các tính năng như tìm kiếm và thay thế, và cho phép người dùng lưu trữ các tệp CSS trực tiếp trong trình soạn thảo.

Extension CSS Peek

CodeSnap

CodeSnap là một tiện ích giúp bạn chụp và chia sẻ mã nguồn của mình một cách dễ dàng. Bạn có thể dễ dàng chụp lại đoạn code của mình với hình thức đẹp hơn so với chụp ảnh màn hình thông thường sau đó chia sẻ nó cho người khác với CodeSnap. CodeSnap hỗ trợ nhiều ngôn ngữ lập trình khác nhau và cung cấp các tính năng như tô sáng mã nguồn và tạo liên kết trực tiếp đến mã nguồn của bạn.

Extension CodeSnap

Auto Rename Tag

Auto Rename Tag giúp tự động đổi tên thẻ HTML đối với các cặp thẻ đóng mở. Khi bạn đổi tên một thẻ HTML, extension này sẽ tự động đổi tên thẻ đóng tương ứng. Điều này giúp tiết kiệm thời gian và giảm thiểu lỗi khi bạn phải đổi tên nhiều thẻ HTML trong một tài liệu.

Extension Auto Rename Tag

Code Spell Checker

Code Spell Checker là một extension hỗ trợ kiểm tra chính tả cho các file mã nguồn trong Visual Studio Code. Nó sẽ giúp bạn phát hiện và sửa các lỗi chính tả trong các biến, hàm, comment và các phần khác của mã nguồn.

Extension Code Spell Checker

HTML to CSS autocompletion 

HTML to CSS autocompletion hỗ trợ tự động hoàn thành CSS cho các phần tử HTML trong Visual Studio Code. Nó sẽ giúp bạn tiết kiệm thời gian hơn nếu như bạn lỡ quên tên class hoặc id  và giảm thiểu lỗi khi viết CSS cho các phần tử HTML.

Extension HTML to CSS autocompletion

Image preview

Extension Image Preview

Highlight Matching Tag

Với Highlight Matching Tag, bạn sẽ không bao giờ bị lạc trong các thẻ HTML hoặc XML nữa. Khi bạn di chuyển con trỏ đến một thẻ, extension sẽ tự động tô đậm thẻ tương ứng. Điều này giúp bạn dễ dàng nhận ra các thẻ mở và đóng, giúp cho việc sửa lỗi và chỉnh sửa code trở nên dễ dàng hơn bao giờ hết.

Extension Highlight Matching Tag

GitLens

Đây là một extension hỗ trợ quản lý Git trong Visual Studio Code. Nó cung cấp các tính năng như xem lịch sử commit, so sánh các phiên bản khác nhau của file, xem thông tin về các nhánh và merge request, và nhiều tính năng khác để giúp bạn quản lý mã nguồn của mình một cách hiệu quả hơn.

Extension GitLens

Trên đây là một vài extension cho VS Code có thể sẽ giúp ích cho bạn trong quá trình học lập trình. Tuy nhiên, không phải tất cả các extension đều phù hợp với nhu cầu và phong cách của mỗi người, cũng không nên quá lạm dụng các extension VS Code vì nó sẽ khiến bạn bị phụ thuộc khi lập trình. Do đó, hãy thử và tìm ra những extension phù hợp nhất với bạn để tối đa hóa hiệu quả học tập của mình trên VS Code. 

Bộ môn Công nghệ Thông tin
Trường Cao đẳng FPT Mạng cá cược bóng đá Hà Nội

Cùng chuyên mục

Đăng Kí học Fpoly 2023