Polacode extension trongg vs code

Chào anh em,

Hôm nay đổi gió một chút nhé. Tạm gác lại mấy cái đau đầu như tối ưu query, dựng Kafka hay thiết kế microservices đi. Hôm nay chúng ta sẽ bàn về một chủ đề nhẹ nhàng nhưng lại cực kỳ quan trọng với anh em dev: Nghệ thuật "sống ảo" với code.

Anh em hay share code cho đồng nghiệp, đăng lên group Facebook hỏi bug, hay viết bài trên Viblo bằng cách nào?

• Bôi đen rồi Ctrl + C, Ctrl + V? (Nhìn khô khan và mất hết format nếu nền tảng không hỗ trợ markdown).
• Dùng Snipping Tool hoặc Lightshot cắt cái rẹt màn hình? (Kèm theo nguyên mớ lộn xộn của explorer bên trái, terminal bên dưới, và đôi khi là vài cái tab Chrome mờ ám đang mở 🙄).
• Lấy điện thoại ra chụp màn hình máy tính? (Lạy chúa, xin đừng làm vậy!).

Nếu anh em muốn những dòng code của mình khi show ra trông phải thật "nghệ", background bo góc xịn sò như mấy pháp sư trên Twitter/X hay khoe, thì đây là lúc anh em cài ngay Polacode.

Polacode là cái quái gì?

Hiểu đơn giản, Polacode là một extension trên VS Code giúp bạn chụp ảnh những đoạn code với giao diện cực kỳ đẹp mắt, giống hệt như một bức ảnh Polaroid (đó là lý do nó có tên là Pola-code).

Nó tạo ra một tấm ảnh code có background đẹp, đổ bóng (shadow) nhẹ nhàng, bo góc tinh tế, và đặc biệt là giữ nguyên màu sắc theme và font chữ mà anh em đang dùng trong VS Code.

Cách dùng: Dễ hơn cả viết "Hello World"

1. Mở phần Extensions trong VS Code (Ctrl + Shift + X), gõ Polacode và nhấn Install.

(Tip nhỏ: Cái bản gốc Polacode hình như tác giả lâu rồi không update nên thỉnh thoảng hơi ngáo. Nếu anh em cài bản gốc bị lỗi, hãy tìm bản Polacode-2020 hoặc Polacode (fixed) nhé. Xài bao mượt).

2. Mở file code bạn muốn chụp lên.
3. Mở Command Palette (Ctrl + Shift + P trên Windows/Linux hoặc Cmd + Shift + P trên Mac), gõ Polacode rồi Enter.
4. Một tab mới sẽ hiện ra bên cạnh cửa sổ code của bạn.
5. Việc của bạn bây giờ chỉ là: Bôi đen đoạn code cần chụp, Copy và Paste nó sang cái tab Polacode kia.
6. Căn chỉnh lại độ rộng một xíu cho vừa mắt, rồi bấm cái nút hình tròn tròn (như nút chụp ảnh) ở bên dưới. Done! Chọn chỗ lưu file .png là mang đi khè thiên hạ được rồi.

Tại sao lại là Polacode mà không phải mấy tool web?

Chắc nhiều anh em sẽ thắc mắc: "Sao không lên carbon.now.sh hay ray.so mà chụp, web làm đẹp thiếu gì?".

Đúng là Carbon hay Ray.so rất xịn, nhưng Polacode có những cái "ngon" mà mấy thằng kia không làm được (hoặc làm mất công hơn):

Không cần rời khỏi editor: Đang code lở dở, muốn chụp cái hàm vừa viết ném cho thằng bạn xem. Chỉ cần mở Polacode ra paste vào là xong. Không cần mở trình duyệt, không cần chuyển tab.

Ăn theo theme VS Code 100%: Bạn đang xài theme Dracula, One Dark Pro hay cái theme hường phấn nào đó? Polacode sẽ chụp ra đúng y cái màu đó. Code ở ngoài màu gì, highlight ra sao thì vào ảnh y chang vậy.

Giữ nguyên Font chữ & Ligatures: Anh em nào đam mê custom font xịn như Fira Code hay Cascadia Code (mấy cái font mà gõ => hay != nó tự nối lại thành ký tự nhìn rất pro ấy), thì Polacode cân tất. Mấy tool web nhiều khi không hỗ trợ font của riêng bạn.

Offline hoàn toàn: Mất mạng vẫn chụp ảnh code sống ảo được. Quá tuyệt vời!

Một vài lưu ý nhỏ để ảnh đẹp hơn

Đừng tham lam: Đừng cố paste một cái class dài 200 dòng vào Polacode. Ảnh xuất ra cái chữ nó sẽ bé tí như con kiến, chả ai đọc được đâu. Cắt đúng cái function hoặc đoạn logic cần show thôi.

Kéo thả lề: Cái tab Polacode có thể kéo lề trái phải để thu hẹp hoặc mở rộng background. Hãy kéo sao cho hai bên viền code nó cân đối một chút nhìn sẽ thuận mắt hơn.

Tóm lại

nếu anh em hay viết blog, hay làm slide thuyết trình, hoặc đơn giản là thích cái đẹp, thì Polacode là một "must-have extension". Code có thể đang dính bug tè le, logic có thể hơi cồng kềnh, nhưng nhìn ảnh chụp đoạn code đẹp thì người ta vẫn cứ nghĩ bạn là senior. 😉

Anh em xài thử đi, đảm bảo mấy bài post trên Viblo sau này chất lượng hình ảnh sẽ tăng lên vài phần chân kính. Chúc anh em cuối tuần code ít bug và có nhiều ảnh đẹp!