Có gì hot? Tuần 02 - 2023

CodeSandbox hỗ trợ Dockerfile

CodeSandbox hôm thứ năm vừa rồi công bố hỗ trợ Dockerfile ngay trên trình duyệt 🤯 Nghĩa là bạn chỉ cần tạo một tập tin .codesandbox/Dockerfile, nhấn Save một phát, và Bùm! Mọi thứ được tự động cài đặt và hoạt động y chang ở local (🤯 lần hai). Điều này mở ra biết bao nhiêu thứ hay ho, chẳng hạn như bạn có thể dùng CodeSandbox để code Java hoặc bất cứ ngôn ngữ/ ứng dụng nào có thể chạy trong Docker, hay tạo một database xong kết nối vào đó. The possibility is endless 🤯

Một điểm hay nữa là bạn có thể dùng VSCode có cài đặt CodeSandbox extension, xong truy xuất vào thẳng sandbox và chỉnh sửa ngay từ ứng dụng desktop. Rất là tiện lợi và thoải mái.

Phía bên dưới, CodeSandbox chạy một rootless container Podman. Nhờ vào đó, bạn có thể truy cập dưới quyền root mà vẫn đảm bảo các permissions được thiết lập rõ ràng.

Hiện tại thì khi tạo sandbox mới, bạn có thể chọn các template Docker có sẵn, bao gồm Docker Starter, Deno Fresh, Deno Starter, và Bun Starter. Trong tuần tới, CodeSandbox có thể sẽ công bố hỗ trợ Docker Compose, cho phép bạn tạo nguyên một ứng dụng full-stack ngay trên trình duyệt. Cùng đón chờ nhé.

Bài viết: Những viewport units mới trong CSS

Tự quảng cáo một chút vậy 😅

Ehkoo vừa đăng bài giới thiệu về các viewport units mới trong CSS, bao gồm sv*, lv*, và dv*. Còn chi tiết như thế nào thì bạn xem chi tiết ở đây nha 👉 https://ehkoo.com/bai-viet/css-viewport-units.

Tin vắn

• Mới đây, Tobias Koppers đã chia sẻ những định hướng phát triển của Turbopack tại React Day Berlin. Theo đó, Turbopack đang được xây dựng với tầm nhìn phục vụ cho xu hướng phát triển web trong 10 năm tới. Về mặt kiến trúc, nhóm phát triển đang chia thành 2 lớp: Turbo engine là phần lõi, xử lý những tác vụ thông dụng như lưu/xóa bộ đệm, và build tăng tiến, và Turbopack sẽ là phần xử lý các assets như CSS, WASM, hình ảnh, fonts, v.v. Hiện tại Turbopack dùng chung với Next.js 13.1 đã hỗ trợ PostCSS/ Tailwind CSS, next/image, next/font, và nhiều nữa.

• The New Stack đưa ra 5 dự đoán cho WebAssembly trong năm 2023: 1️⃣ Sự phổ biến của Wasm Component 2️⃣ Wasm sẽ được sử dụng nhiều hơn trên các nền tảng serverless 3️⃣ Các ứng dụng Wasm sẽ được lưu trên DockerHub hay các trang lưu trữ container 4️⃣ Tất cả các ngôn ngữ lập trình thông dụng sẽ hỗ trợ Wasm và 5️⃣ JavaScript sẽ là ngôn ngữ Wasm thông dụng nhất.

• SWC vừa tweet một phát cho thấy đã “đánh bại” terser trên hầu hết các mặt trận.

• Safari vừa lên tuổi 20 ngày 07 tháng 01 vừa qua. Cult of Mac cũng có bài nhìn lại giao diện của Safari qua các thời kỳ.

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 😛

• @formkit/auto-animate (2.4kB min+gzipped): Cái này hay nè, tự động thêm animation vào app React/ Vue/ JavaScript mà không cần phải thiết lập gì mấy.

• huozhi/bunchee là công cụ để đóng gói thư viện JavaScript/ TypeScript/ JSX thành một tập tin duy nhất. Được xây dựng trên nền rollup và SWC.

• antfu/taze là công cụ CLI giúp bạn cập nhật phiên bản của các packages trong dự án. taze sẽ tôn trọng semver, hỗ trợ monorepo, và bạn chỉ cần npx taze là xong.

• easings.net giúp bạn chọn hàm easing phù hợp. Nói thật là trước giờ mình toàn xài ease-in-out 🥲

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

• Why Not document.write()?: Harry (@csswizardry) chia sẻ vì sao bạn không nên xài document.write().

• How to Build a GraphQL Server with Deno: Một bài hướng dẫn xây dựng GraphQL bằng Deno. Bạn có thể vừa đọc vừa code theo bằng cách dùng CodeSandbox với Docker như trên. Tiện quá luôn.

• The gotcha of unhandled promise rejections: Jake Archibald, developer 🥑 của Google Chrome, giới thiệu những vấn đề đối với unhandled Promise rejections. Đọc bài này xong mới thấy mình chưa xài for await bao giờ.

• Trailing Slashes on URLs: Contentious or Settled? (2022): Zach Leatherman, tác giả của 11ty, thảo luận về có nên luôn đính kèm dấu gạch chéo ”/” vào cuối URL hay không. Tác giả cũng so sánh luôn các nền tảng như Github Pages, Vercel, hay Netlify sẽ xử lý URL khác nhau như thế nào.

Kết

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