Có gì hot? Tuần 46 - 2022

Viết bởi @kcjpop

Đăng ngày

Dài 849 từ. Đọc trong 5 phút.

Một loạt framework phát hành phiên bản mới

Thật ra thì ban đầu mình định đưa phần này vào mục Tin vắn, nhưng ngẫm lại thấy (1) không có tin nào nổi bật hơn (2) nhiều framework ra bản mới thật nên thôi viết ở đây luôn ha 😄

Đầu tiên là Nuxt phát hành v3. Cho những bạn chưa biết thì Nuxt là một meta framework khá phổ biến trong hệ sinh thái Vue, giống như Next.js bên React vậy (bạn thấy tên ná ná hông, rất đúng tinh thần Vue ha). Phiên bản 3 được viết lại hoàn toàn dựa trên Vite, Vue 3, và Nitro, hỗ trợ TypeScript tận răng. Nuxt 3 chỉ hỗ trợ 2 phiên bản gần nhất của Chrome, Firefox, phiên bản hàng tháng của Edge, và phiên bản theo năm của Safari.

Tiếp theo là 🥁 Gatsby 5, phiên bản Gatsby nhanh nhất (nhưng không chừng lại là meta framework chậm nhất j/k 🤪). Phiên bản này giới thiệu Slice API để tăng tốc độ của Incremental Builds và Incremental Deploys. Bạn có thể dùng Slice API cho các components như thanh điều hướng (navigation), banner, headers, footers, v.v. và chúng sẽ không cần phải build lại nữa. Nghe cũng hợp lý ha. Bên cạnh đó v5 còn thử nghiệm Partial Hydration cho phù hợp với xu thế thời đại mới. Ngoài ra còn có một Script component mới, GraphiQL v2, Header API, v.v. trong phiên bản này.

Cuối cùng là Angular ra v15. Chi tiết thì mọi người click vào link để đọc nha chứ mình không rành Angular mà tóm tắt thì lại dở 😅

Github thử nghiệm giao diện xem code mới trên web

Github đang thử nghiệm một giao diện mới khi bạn xem code trên web (xem hình trên). Bạn sẽ có thêm một thanh sidebar ở bên trái, giúp nhảy nhanh đến tập tin cần thiết (RIP Octotree). Phần mã nguồn cũng tô sáng các symbols, ví dụ như tên hàm hay biến, và khi click vào thì Github sẽ hiện ra những chỗ mà các symbols này được dùng. Giao diện mới được làm bằng React đó.

Vì hiện tại vẫn đang beta nên nếu bạn phải đăng ký vào hàng đợi. Click vào đây để đăng ký nha. Xem hướng dẫn sử dụng giao diện mới ở đây

Tin vắn

  • Deno 1.28 tương thích với các packages trên npm: Phiên bản 1.28 vừa được phát hành của Deno mở ra khả năng sử dụng các package từ npm. Chỉ cần import … from 'npm:<tên package>@<phiên bản>' là được rồi. Bạn có thể đọc thêm hướng dẫn viết app Deno với express, React, hay Vue ở đây.

  • google/wireit ra bản 0.7.3 với nhiều cải tiến: Wireit giúp cho npm scripts của bạn thông minh và hiệu quả hơn. Coi sơ qua thì mình thấy giống npm-watch với concurrently vậy, nhưng chắc xịn hơn nhiều.

  • Warp.dev cập nhật cho phép nhập lệnh như đang xài IDE luôn: Được quảng cáo là terminal của thế kỷ 21, Warp đem đến trải nghiệm như IDE khi xài terminal: syntax highlight, hiển thị lỗi, rê chuột để xem tài liệu hướng dẫn, và hơn nữa. Nghe nói sắp tới còn có AI tự viết command cho chúng ta luôn.

  • sqlite 3.40 sẽ có bản WASM chính thức.

Mới thấy trên quầy

Một vài thư viện/ công cụ hữu ích mà bọn mình mới phát hiện 😛

  • Design Token Generator: được xây dựng bởi Agustín Capeletto, giúp bạn tạo các token cho color, spacing, duration, easing, radius, etc. Có thể xuất ra định dạng JSON theo chuẩn W3C, CSS, SASS,…

  • Mercateo/rust-for-node-developers: Với sự xuất hiện của các công cụ viết bằng Rust dành cho hệ sinh thái JavaScript thì học Rust cũng là một lựa chọn đáng suy ngẫm ha.

  • dlvhdr/gh-dash: là một dashboard cho Github chạy trên terminal.

  • refinedev/refine: headless framework để làm ứng dụng CRUD với React.

  • facebook/sapling: là một công cụ quản lý phiên bản tương thích với git, được viết bằng Rust. Hàng Facebook nên có khi giải quyết những vấn đề của Facebook thôi, còn người dùng bình thường chúng ta thì cứ trung thành với git vậy.

Đọc/ xem gì cuối tuần

  • Command K Bars: Maggie Appleton viết về thanh tác vụ khi bạn nhấn Cmd + K, một pattern dần trở nên phổ biến trên các ứng dụng như Linear, Todoist, v.v.

  • Dialogs, modality and popovers seem similar. How are they different?: Một bài của Hidde de Vries giúp bạn phân biệt giữa dialog, modal, và popover.

  • Inside Framer’s Magic Motion: Bài viết rất là có đầu tư của Nanda Syahrasyad, mô tả về tính năng chuyển động layout của Framer Motion.

  • Goldman Sachs’ Design System Patterns: Tập hợp những chỉ dẫn về UX khi xây dựng các tính năng như drag and drop, filter and sort, forms, grids and tables, etc.

  • Google Fonts Glossary: Thắc mắc không biết cap height là gì, hay CJK và FOUT là viết tắt của cái chi thì hãy nghía qua bảng chú giải của Google Fonts nhe.

Kết

Tuần này Twitter biến động quá nên cũng không có tin gì nhiều.

Hẹn gặp lại các bạn trong Bản tin Ehkoo tuần tiếp theo 👋

Bản tin Ehkoo hàng tuần 💌

Đăng ký ngay để nhận những tin và bài viết mới nhất về lập trình frontend, cũng như các thủ thuật hay thư viện mới…

Powered by Buttondown

Gửi tặng cà phê ☕️

Nếu thấy bài viết này hữu ích, bạn có thể gửi tặng Ehkoo một ly cà phê theo link bên dưới 👇

Cám ơn bạn rất nhiều 🤗