- vừa được xem lúc

VSCode của mình trông như nào?

0 0 43

Người đăng: Tran Minh Nhat

Theo Viblo Asia

VSCode của mình trông như thế đấy ?

Khi tìm kiếm cách làm đẹp VSCode mình đã đặt ra các tiêu chí sau:

  • Màu sắc sặc sỡ chút nhưng không bị chói.
  • Các biểu tượng bắt mắt.
  • Màu nền không được sáng quá, cũng không được tối quá.
  • Chắc chắn phải là dark theme.
  • Màu chữ phải nổi bật, được highlight hợp lí.
  • Font chữ phải dễ nhìn, làm sao khi liếc qua không bị nhầm giữa chữ "l" (chữ lờ thường), chữ "I" (chữ i hoa) và số 1.
    Chắc hẳn lập trình viên nào cũng biết 3 ký tự này mà nhìn na ná nhau thì khó chịu thế nào rồi đấy ?. Như mình đang thấy ở Viblo thì 2 chữ này trông chẳng khác gì nhau cả ?.
  • Không bị nhầm khi có 1 đống cái ngoặc liền nhau.

Để mà thỏa mãn được hết đống yêu cầu trên kia thì quá là khó luôn. Mình đã từng dành hàng giờ chỉ để tìm kiếm xem cái theme nào vừa mắt. Rồi cài 1 đống vào để so sánh từng tí một về màu sắc của chúng.

Thật may, cuối cùng mình đã tìm được "các Extension của đời mình", giúp thỏa mãn được hết các tiêu chí mà mình mong muốn. Nếu các bạn thích có VSCode trông giống của mình thì hãy cài đặt các extension sau nhé.

1. GitHub Theme

Đây là mảnh ghép lớn nhất mình tìm được. GitHub Theme cung cấp 5 màu giao diện, gồm:

  • GitHub Light
  • GitHub Dark
  • GitHub Light Default
  • GitHub Dark Default
  • GitHub Dark Dimmed

Cái mình đang sử dụng là GitHub Dark. Nó tối màu nhưng không bị đen hẳn đi như GitHub Dark Dimmed. Với màu này thì giữa phần giao diện code và giao diện Tab bên trái sẽ được rạch ròi hơn, các tab code đang mở cũng được sáng hơn 1 chút, nổi bật hẳn lên để mình có thể biết đang code ở file nào.

Mình không nhớ rõ font chữ là mặc định của VSCode hay là của theme, nhưng nhìn không bị nhầm giữa mấy ký tự na ná nhau đâu.

Với những người thích theme sáng thì GitHub Light cũng rất đẹp mắt.

2. Helium Icon Theme

Đây là extension làm Tab Exporer của mình sặc sỡ hẳn lên. Nó khoác áo mới cho các file code và các thư mục. Với mỗi ngôn ngữ khác nhau sẽ có icon riêng của ngôn ngữ đó luôn, cái nào màu cũng đẹp hết.

Extension cũng có thể nhận biết để chọn icon phù hợp tùy vào project đang code và định dạng file sử dụng:

  • Project Android:

  • Project Nodejs:

Kho icon của Helium rất nhiều, thoải mái cho việc "làm màu" đủ loại project ?

3. Rainbow Brackets

Rainbow Brackets sẽ tô màu cho những cặp đóng mở ngoặc trong code của chúng ta. Mỗi cặp đóng mở ngoặc sẽ có màu khác nhau. Những dòng code gọi hàm lồng nhau từ giờ không còn rối mắt nữa ???.

Bình luận

Bài viết tương tự

- vừa được xem lúc

Tổng hợp các VS Code Extension bá đạo bạn nên có

Giới thiệu. Hiện tại, mình mới làm quen với VS code. Qua 1 thời gian tìm hiểu, mình thấy VS code khá là mạnh, nhất là về khoản có thể cài thêm ứng dụng mở rộng (extension). Dracula Official Theme.

0 0 50

- vừa được xem lúc

Tôi đã debug code PHP như nào!

. Nhân dịp đầu xuân năm mới, mình xin gửi lời chúc an lành tới tất cả thành viên của viblo.asia.

0 0 46

- vừa được xem lúc

MOSH: Kẻ hủy diệt SSH

Lời nói đầu. Lời đầu tiên xin được xin chào cả nhà, đã lâu lắm rồi mình không viết blog nay May Fest mà người iu mình thích cái áo viblo quá nên xin phép nổ phát súng trên Viblo về Mosh - thứ khá hay

0 0 126

- vừa được xem lúc

Vòng đời và trạng thái của Thread

A. Giới thiệu.

0 0 117

- vừa được xem lúc

Giải quyết vấn đề N+1 trong quan hệ cha - con vô tận bằng Eager Loading

Vấn đề. Trong khi phát triển ứng dụng, chắc hẳn các bạn đã gặp phải trường hợp đệ quy cha-con trong khi phát triển các dự án, ví dụ như cây thư mục như sau:.

0 0 172

- vừa được xem lúc

Bạn tổ chức thư mục views cho các dự án Laravel như thế nào?

Hầu hết các ứng dụng Laravel có rất nhiều views. Một ứng dụng nhỏ sẽ không xảy ra vấn đề gì cả, tuy nhiều nếu dự án lớn dần theo thời gian, chúng ta sẽ gặp bế tắc trong việc tổ chức và sắp xếp các vie

0 0 189