Giới thiệu HN: HTMX Playground được triển khai 100% trong trình duyệt

HTMX Playground

• HTMX Playground là công cụ cho phép thử nghiệm trong một môi trường sandbox mã đơn giản bằng HTMX.
• Có thể օգտագործել ngay mà không cần thiết lập riêng, đồng thời có thể xem các ví dụ được lấy từ trang mẫu gốc của htmx.org.
• Có thể viết mã trong trình duyệt trong một môi trường tương tự backend, định nghĩa endpoint trong server.js và render template riêng.
• Công cụ chạy một máy chủ giả lập chặn các request đi ra từ HTMX, đồng thời cung cấp cơ chế xử lý request và template engine quen thuộc với những người dùng Django.
• Dự án này không chỉ giới hạn ở HTMX, vì vậy cũng có thể tự do thử các thư viện khác.

Lưu và chia sẻ

• Có thể sao chép ở định dạng JSON bằng cách nhấn nút "Copy as JSON" ở góc trên bên phải.
• Tải nội dung đã sao chép lên Gist rồi nhập raw URL vào "Load Playground" để URL của trang đó được cập nhật và có thể chia sẻ.
• Mã nguồn cũng có thể dùng trên GitHub.

Lưu ý

• Không có tính năng điều hướng giữa các trang.
• Hỗ trợ di động còn hạn chế.
• server.js có thể có trạng thái, nhưng nếu cập nhật trạng thái trong view on.get("/"), bản cập nhật trạng thái có thể bị mất vì trong lần tải trang ban đầu nó được truy xuất qua một iframe riêng.

Các thư viện được sử dụng

• Svelte
• Ace (trình soạn thảo mã)
• PollyJS (máy chủ giả lập)
• Nunjucks (template engine)

Ý kiến của GN⁺

• HTMX Playground là một công cụ hữu ích giúp các nhà phát triển web nhanh chóng tạo prototype cho ứng dụng web tương tác bằng HTMX.
• Bằng cách cung cấp một môi trường dễ tiếp cận cho các nhà phát triển đã quen với các framework backend như Django, công cụ này giúp kết nối trải nghiệm phát triển frontend và backend.
• Công cụ này cũng cung cấp khả năng lưu và chia sẻ mã dễ dàng, nên có thể rất hữu ích cho mục đích cộng tác hoặc giáo dục.

[GN⁺]

Ý kiến trên Hacker News

• Lời cảm ơn từ tác giả của htmx

  • Tác giả htmx: Lời cảm ơn được gửi từ người tạo ra htmx. Ông bày tỏ rằng mình rất được khích lệ trước sự quan tâm và việc mọi người sử dụng dự án của mình.

• Những lo ngại và câu hỏi về việc sử dụng htmx

  • Lo ngại về nguồn nhân lực phát triển: Một người dùng cho biết đã cân nhắc sử dụng htmx, nhưng cảm thấy khó tuyển dụng vì nguồn nhân lực biết công nghệ này còn nhỏ. Họ chia sẻ rằng trước đây việc tuyển các lập trình viên frontend chuyên sâu, đã quen với framework riêng, dễ hơn so với tìm các lập trình viên full-stack chuyên nghiệp. Họ cũng không muốn lập trình viên e ngại xử lý mã phức tạp, và không muốn backend developer trở thành điểm nghẽn. Người này hỏi liệu htmx có nhận thức được những vấn đề đó hay không, và họ định giải quyết chúng như thế nào.

• Băn khoăn về htmx và hỗ trợ ứng dụng di động

  • Hỗ trợ ứng dụng di động: Một người dùng nói rằng họ thích khái niệm của htmx và đã bắt đầu đọc sách liên quan, nhưng lại băn khoăn khi nghĩ đến việc nếu sau này cần hỗ trợ ứng dụng di động thì sẽ phải viết lại frontend và backend trên diện rộng. Họ biết đến hyperview.org, nhưng cho rằng ứng dụng react-native không phù hợp với trường hợp sử dụng mà họ quan tâm.

• Ý kiến về lựa chọn editor và hiển thị lỗi

  • Editor và hiển thị lỗi: Một người dùng chỉ ra rằng hỗ trợ di động còn hạn chế và cho rằng nên dùng Monaco Editor thay vì Ace Editor. Tuy nhiên, có lời giải thích rằng Ace được dùng vì Monaco cố ý không hoạt động trên di động. Điều này được dẫn chứng bằng liên kết tới GitHub issue.

• Chia sẻ kinh nghiệm dùng htmx cùng Django

  • Sử dụng htmx và Django: Một người dùng cho biết họ đang dùng maplibre, Django và htmx cùng nhau, đồng thời dự định đăng ví dụ để chia sẻ với những người khác.

• Trải nghiệm và phản hồi khi dùng htmx

  • Sử dụng htmx và phản hồi: Một người dùng cho biết họ đã dùng htmx trong công việc và đánh giá là nó hoạt động tốt. Họ dự định sẽ tiếp tục dùng, nhưng cũng có thể tạo một phiên bản dựa trên PHP. Họ chia sẻ rằng đã vài lần bị mất phần việc đang làm khi dán JSON vào trường tải URL, và cũng gặp vấn đề không thể dọn dẹp trình duyệt yêu cầu mạng, kèm theo một yêu cầu tính năng.

• Câu hỏi về hỗ trợ kỹ thuật

  • Có hỗ trợ ActiveX không: Một người dùng hỏi liệu htmx có hỗ trợ ActiveX hay không.

• Bình luận châm biếm về lựa chọn công cụ phát triển

  • Dùng Svelte: Một người dùng hỏi liệu htmx có được làm bằng Svelte hay không. Đây là một bình luận mang tính châm biếm, tò mò không biết những người theo chủ nghĩa thuần MPA (Multi-Page Application) đang ở đâu và phản ứng của họ sẽ ra sao.

• Sự tò mò về phát triển ứng dụng offline

  • Phát triển ứng dụng offline: Một người dùng thắc mắc liệu có ai đang tạo ứng dụng offline bằng cách dùng mô hình request-response với htmx và HTML, rồi định nghĩa một máy chủ ảo bên trong service worker hay không.

• Chỉ ra lỗi chính tả trong phần mô tả website

  • Chỉ ra lỗi chính tả: Một người dùng chỉ ra rằng phần mô tả trên trang chính của website có lỗi chính tả. Họ nói rằng "intersepts" cần được sửa thành "intercepts".