Show HN: Nash - โน้ตแบบสแตนด์อโลนที่สร้างจากไฟล์ HTML เดียว

 (keepworking.github.io)
3 คะแนน โดย GN⁺ 2025-03-16 | 2 ความคิดเห็น | แชร์ทาง WhatsApp
  • Nash เป็นโน้ตในรูปแบบ HTML แบบสแตนด์อโลนที่ไม่ต้องใช้ซอฟต์แวร์หรือบริการเพิ่มเติม
  • ใช้งานได้ด้วยเว็บเบราว์เซอร์เพียงอย่างเดียว และสามารถบันทึกและแก้ไขได้แม้ออฟไลน์
  • แรงบันดาลใจ
    • ระหว่างที่กำลังสร้างฟังก์ชันสำหรับทำ POC (Proof of Concept) ของไอเดียง่าย ๆ ด้วย HTML เดียว จึงตระหนักได้ว่าสามารถสร้างไฟล์เอกสารที่ทำงานได้โดยไม่ต้องพึ่งบริการหรือซอฟต์แวร์แยกต่างหาก
    • นี่คือความพยายามครั้งแรกในการสร้างไฟล์เอกสารที่ทำงานได้โดยไม่ต้องใช้ซอฟต์แวร์อย่าง Notion หรือ Word
  • รับโน้ตเปล่า
    • สามารถไปยังหน้าว่างได้ผ่านลิงก์ต่อไปนี้: Nash หน้าว่าง
  • Nash เป็นโอเพนซอร์ส และสามารถแก้ไขและใช้งานได้อย่างอิสระ

บทความที่เกี่ยวข้อง

2 ความคิดเห็น

 
xguru 2025-03-16

Nash, โน้ตที่ทำงานด้วย HTML ไฟล์เดียว

เห็นว่าที่เคยโพสต์ใน Show GN ได้นำไปโพสต์บน Hacker News ด้วย และได้รับโหวตเยอะเลยนะครับ ขอแสดงความยินดีด้วย!
 
GN⁺ 2025-03-16
ความคิดเห็นใน Hacker News
  • ฉันชอบโปรเจ็กต์นี้มาก และเมื่อดูซอร์สโค้ดก็คิดว่าเท่มากที่เขาเขียนด้วย vanilla JS ทุกวันนี้คนมักประเมินต่ำไปว่าเราสามารถสร้างเว็บแอปแบบโต้ตอบได้มากแค่ไหนโดยไม่ต้องพึ่งไลบรารีหรือเฟรมเวิร์ก
    • ฉันเองก็ชอบไอเดียการทำเว็บแอปโลคัลแบบง่าย ๆ ในหน้า HTML เดียวมาก เมื่อไม่นานมานี้ฉันพาลูกไปพิพิธภัณฑ์วิทยาศาสตร์และได้ลองใช้ตัวทำสต็อปโมชันแอนิเมเตอร์แบบง่าย ๆ เลยตัดสินใจจะทำเว็บแอปแบบนั้นขึ้นมา แล้วทำเป็นหน้า HTML เดียวเพื่อคัดลอกลงโน้ตบุ๊กของลูกให้ใช้งานได้โดยไม่ต้องมีอินเทอร์เน็ต ฉันขี้เกียจเขียน vanilla JS เลยใช้ React กับบันเดลเลอร์ มันถูกบันเดิลออกมาเป็นไฟล์ HTML เดียว สักวันหนึ่งอาจจะเอาไปโพสต์ใน Show HN
  • งานหนักหลายอย่างถูกจัดการด้วยคุณสมบัติที่เรียบง่ายแต่ทรงพลังนี้ น่าแปลกที่ดูเหมือนนักพัฒนาหลายคนจะไม่ค่อยรู้จักคุณสมบัตินี้ ทั้งที่มันมีมานานพอสมควรแล้ว
    • <div id="editor" contenteditable="true">
  • งานยอดเยี่ยม
    • อยากเสนอให้พิจารณาเปิดหน้าในโหมดแก้ไขอัตโนมัติเมื่อเปิดจากดิสก์ภายในเครื่องผ่านเบราว์เซอร์ และเปลี่ยนเป็นมุมมองอ่านอย่างเดียวตามปกติเมื่อถูกเผยแพร่บนเว็บไซต์ของใครสักคนและเข้าถึงผ่านเว็บสาธารณะ (ตรวจว่าที่อยู่เป็น http/https)
    • แน่นอนว่า:
      1. ควรมีวิธีข้ามสิ่งนี้ได้ (พารามิเตอร์ใน query string หรือ URL fragment แบบพิเศษ) เพื่อให้ยังดูในโหมดแก้ไขได้
      2. ควรมีข้อยกเว้นสำหรับบางโดเมน/คำนำหน้า URL—โดยพื้นฐานคือ keepworking.github.io (หรือ https://keepworking.github.io/nash/)—เพื่อให้โหมดแก้ไขเปิดทำงานบนไซต์นั้นด้วย ซึ่งหมายความว่าส่วนตัวแล้วไม่จำเป็นต้องทำอะไรพิเศษเพื่อให้เดโมทำงานได้ (ข้อยกเว้นนี้ควรให้ผู้ใช้แก้ไขได้ด้วย เพื่อให้คนอื่นได้พฤติกรรมแบบเดียวกันโดยไม่ต้องใช้วิธีในข้อ #1)
  • นี่เจ๋งมาก เรา (หรืออาจจะแค่ฉัน) คุ้นเคยกับการเขียนส่วน JS ของเว็บไซต์ไว้นอก HTML จริง ๆ มากเกินไป พอเห็นสิ่งนี้แล้วก็คิดว่า "ว้าว นี่มันบ้ามากที่ทำทั้งหมดนี้ได้ด้วย HTML อย่างเดียว" แล้วพอไปดูซอร์สและเห็นว่า JS ทั้งหมดอยู่ใน script tag แบบดั้งเดิม ก็ทำให้นึกขึ้นมาได้อีกครั้งว่านี่เป็นสิ่งที่ทำได้จริง
  • คุณสามารถใช้การบันทึกแบบ "ของจริง" เพื่อทำให้สิ่งนี้เป็นอิสระและพกพาได้อย่างแท้จริง https://rpdillon.net/redbean-tiddlywiki-saver.html
  • อยากให้เบราว์เซอร์รองรับเว็บแอปโลคัลได้ดีกว่านี้ ถ้าไฟล์โลคัลเข้าถึง persistent storage ได้ง่าย ก็จะเปิดโอกาสมากมายสำหรับแอป GUI ที่ทำได้เร็วและง่าย โดยพื้นฐานแล้วมันคือด้านตรงข้ามของ electron
  • ทำได้ดี! ก่อนหน้านี้มีการพูดถึงไอเดียนี้พร้อมอ้างถึง TiddlyWiki ในวงสนทนานี้ https://news.ycombinator.com/item?id=43179649
  • การเรียกมันว่า "โน้ต" ค่อนข้างทำให้งงนิดหน่อย ฉันน่าจะเรียกสิ่งนี้ว่าเว็บแอปไฟล์เดียวแบบแก้ไขได้และแก้ไขตัวเองได้มากกว่า
  • ข้อเสนอแนะ: ควรเตือนเมื่อพยายามปิดหน้าโดยยังไม่ได้บันทึกหลังแก้ไข ลองพิจารณาเพิ่มแฮนด์เลอร์ onbeforeunload
  • เมื่อไม่นานมานี้ฉันพยายามจะทำโลคัลวิกิด้วย TiddlyWiki แต่ล้มเหลวอย่างน่าอนาถ สุดท้ายเลยลงเอยด้วยการเขียนไฟล์ HTML เองโดยตรง
    • ดูเหมือนว่า Nash จะช่วยให้งานของฉันง่ายขึ้น ขอบคุณ
  • เพิ่มสิ่งนี้ไว้เพื่อทำสารบัญได้ง่าย https://codepen.io/cgurski/pen/qBrNrPo