Sổ tay HTML phản ứng

 (maxbo.me)
1 điểm bởi GN⁺ 2024-11-19 | 1 bình luận | Chia sẻ qua WhatsApp

  • Sổ tay HTML phản ứng

    • Nhấn mạnh tầm quan trọng của việc sử dụng HTML như một nền tảng xuất bản khoa học.
    • Đề xuất khả năng dùng tệp HTML cho mọi giai đoạn của việc khám phá dữ liệu, phân tích, trực quan hóa và xuất bản.
    • Thay vì sử dụng nhiều công cụ và nền tảng khác nhau như trước đây, có thể cung cấp một quy trình làm việc thống nhất thông qua HTML.

  • Ô

    • Giải thích cách hiển thị nội tuyến các phần tử style và script bằng lớp CSS echo.
    • Tạo trình soạn thảo mã cơ bản bằng thuộc tính contenteditable.
    • Thiết lập để script được đánh giá lại khi xảy ra sự kiện blur.

  • Thư viện và runtime của Observable

    • Import thư viện chuẩn và runtime của Observable rồi bind vào window.
    • Định nghĩa ô thông qua hàm cell và hiển thị đầu ra của ô bằng Observable Inspector.

  • Ví dụ về ô

    • Khai báo ô counter để in ra một con số mỗi giây.
    • Tạo ô fizzbuzz để sinh đầu ra khác nhau tùy theo giá trị counter.
    • Dùng hàm silent để tạo ô không hiển thị đầu ra.

  • Đầu ra phức tạp

    • Dùng Hypertext Literal để định dạng giá trị counter.
    • Dùng Observable Plot để sử dụng giá trị counter trong biểu đồ.

  • TeX, Markdown, Graphviz

    • Trả về phần tử DOM từ ô để tạo đầu ra ở nhiều định dạng khác nhau.
    • Dùng TeX, Markdown và Graphviz để tạo công thức, bảng và đồ thị.

  • Trạng thái ô

    • Ô có thể trả về Promise hoặc Error, và Inspector của Observable sẽ áp dụng class vào phần tử div bên ngoài của ô.

  • SQLite

    • Thực hiện truy vấn cơ sở dữ liệu bằng client SQLite dựa trên WASM.
    • Trực quan hóa phân bố độ dài bài nhạc thông qua truy vấn SQL.

  • Python và R

    • Chạy mã Python và R bằng Pyodide và WebR, đồng thời tạo trực quan hóa.
    • Tạo biểu đồ bằng mô-đun sqlite3 của Python và Matplotlib.

  • Đầu vào

    • Tạo input bằng Observable Inputs và liên kết chúng với các ô.
    • Dùng hàm viewof để hiển thị phần tử input phía trên ô.

  • Tính khả biến

    • Dùng hàm mutable để tạo đối tượng có thể thay đổi trạng thái.
    • Mỗi khi trạng thái thay đổi, một giá trị Generator mới sẽ được tạo ra.

  • Kế hoạch tương lai

    • Có kế hoạch tích hợp toàn bộ nội dung thành một thư viện và cung cấp tài liệu phù hợp.
    • Tên thư viện được quyết định là @celine/celine.

  • Hạ tầng slide

    • Cung cấp mã để chuyển tài liệu thành slideshow.
    • Có thể điều hướng slide bằng phím tắt bàn phím.

Bài viết liên quan

1 bình luận

 
GN⁺ 2024-11-19
Ý kiến Hacker News

  • Tôi đồng ý với bài viết cho rằng HTML có thể là nền tảng tuyệt vời cho notebook tính toán. Tuy nhiên, tôi không thích cách triển khai này. Observable rất hay nhưng lại lệch khỏi JS tiêu chuẩn. Tôi đang phát triển một hệ thống HTML phản ứng tên là Heximal, dựa trên template HTML và custom elements.

    • Heximal giống như sự pha trộn giữa HTMX, Tangle, Curvenote và Polymer. Nó có lẽ sẽ rất phù hợp với các trường hợp sử dụng như chỉnh sửa đồ họa và notebook.

  • Tôi nghĩ tính khả dụng của cách tiếp cận này khá tệ. Khi làm phân tích dữ liệu khám phá, không có lý do gì phải bận tâm đến các yếu tố style. Đó là lý do Jupyter notebook xuất sắc. Dù vậy, vẫn đáng khen vì sự tò mò và nỗ lực hiện thực hóa một ý tưởng thay thế.

  • Bản demo Python và SQLite đặc biệt ấn tượng. Thật thú vị khi họ đã khởi động vòng lặp chỉnh sửa ngay trên web. Vấn đề về tính bền vững khá giống với TiddlyWiki, và có thể tránh được bằng cách dùng hệ thống tệp. Việc không thể export từ script nhúng là điểm cần được cải thiện.

  • Tôi dự định sớm thử hỗ trợ HTML notebook trong Raku. Hiện tại, các giải pháp notebook của Raku đều dựa trên Jupyter hoặc Mathematica.

  • Tôi thích định dạng của bài viết này. Nó dẫn đến những kết quả thú vị mà không cần quá nhiều dependency hay framework. Có thể sao chép các đoạn mã được đưa ra và hiểu từng bước một. Tôi sẽ dùng literate programming để export sang HTML và viết các bài blog.

  • Đây là HTML phản ứng, nhưng có vẻ gần như hoàn toàn là JavaScript.

  • Tôi đã thử chỉnh sửa pyodide nhưng nó bị crash trên điện thoại và trang bị tải lại.

  • Tác giả sẵn sàng trả lời câu hỏi.

  • Tôi đang định host các ví dụ mã Raku và xây dựng thứ gì đó tương tự cho literate programming. Có plugin Raku cho Jupyter Chatbooks, nhưng việc nó yêu cầu Python thì hơi gượng ép. Sẽ thật tuyệt nếu có một lớp message có thể dùng mã phía máy chủ để kết nối với các language kernel từ xa.

  • Con trỏ khủng long của Windows XP gợi lại rất nhiều ký ức.