ข้ามไปยังเนื้อหา
โปรเจกต์ทั้งหมด

เผยแพร่แล้วแนะนำ

กล่องเครื่องมือนักพัฒนาแบบออฟไลน์

กล่องเครื่องมือนักพัฒนาสองภาษาที่ติดตั้งได้ รวมเครื่องมือ 109 ตัวและ cheat sheet 47 ชุด ทำงานในเบราว์เซอร์ล้วน รวมถึงส่วนฝึกเขียนโค้ดที่รัน JavaScript, SQL และ Python ได้โดยไม่ต้องมีเซิร์ฟเวอร์

  • Next.js
  • React
  • TypeScript
  • Tailwind CSS
  • WebAssembly
  • Pyodide
  • Vitest
  • Playwright

ภาพรวม

นักพัฒนาทุกคนมีโฟลเดอร์บุ๊กมาร์กไว้ถอดโทเคน จัดรูปแบบคิวรี และเทียบ JSON สองก้อน เว็บพวกนั้นส่วนใหญ่อัปโหลดสิ่งที่เราวางลงไป เว็บนี้ไม่มีเซิร์ฟเวอร์ให้อัปโหลด ทุกอย่างทำงานในแท็บ ซึ่งแปลว่าใช้บนเครื่องบินได้ และติดตั้งเป็นแอปได้ด้วย

มันโตเกินกว่าเครื่องมือไปแล้ว มีทั้ง cheat sheet ที่มีไดอะแกรมโต้ตอบได้ แบบทดสอบ และส่วนฝึกเขียนโค้ดที่รันโค้ดจริงแล้วตรวจผลให้

ส่วนที่ท้าทายในการสร้าง

การรันโค้ดของคนแปลกหน้าอย่างปลอดภัยโดยไม่มีเซิร์ฟเวอร์แซนด์บ็อกซ์ ส่วนฝึกเขียนโค้ดรันอะไรก็ตามที่ผู้ใช้เขียน ทั้ง JavaScript, SQL และ Python การกักกันไม่ได้ทำด้วยการลบตัวแปรกลาง ซึ่งรั่วได้ เพราะ dynamic import เป็นไวยากรณ์ ไม่ใช่ฟังก์ชันที่ลบทิ้งได้ แต่ทำที่ชั้น HTTP แทน worker จะรับนโยบายความปลอดภัยจาก response ที่เสิร์ฟสคริปต์ของมัน แต่ละ worker จึงมานโยบายเป็นของตัวเอง ตัวตรวจ JavaScript เสิร์ฟมาพร้อมนโยบายที่อนุญาตให้ประมวลผลได้แต่ไม่ระบุ host ใดเลย การเรียกเน็ต การเปิด socket และ dynamic import จึงถูกปฏิเสธโดยตัวแพลตฟอร์มเอง ไม่ใช่โดยโค้ดที่หลบเลี่ยงได้ ส่วน worker ของ SQL และ Python ได้สิทธิ์เพิ่มเท่าที่รันไทม์ของมันต้องใช้โหลด WebAssembly ของตัวเอง ไม่มากไปกว่านั้น ส่วนลูปที่ไม่จบถูกจัดการแยกด้วยการปิด worker เมื่อหมดเวลา

โครงสร้างระบบ

แอปเดียว ไม่มีหลังบ้าน ไม่มีฐานข้อมูล ไม่มี API route ทุกเครื่องมือและ cheat sheet ถูกเรนเดอร์ล่วงหน้าทั้งสองภาษาตั้งแต่ตอน build เว็บจึงเป็น static ล้วน และการโต้ตอบทั้งหมดเกิดฝั่งเบราว์เซอร์ ส่วนงานหนักอย่างรันไทม์ Python เอนจิน SQLite และไลบรารี PDF กับการเข้ารหัส เป็น WebAssembly ที่เตรียมไว้ในตัว build

ขนาด

  • เครื่องมือ 109 ตัว · cheat sheet 47 ชุด · แบบฝึก 9 ชุด · แบบทดสอบ 6 ชุด · สูตร 4 รายการ
  • สองภาษา · unit test ราว 480 รายการ พร้อมการทดสอบแบบ end-to-end
  • ไม่มีเซิร์ฟเวอร์ให้ดูแล และไม่มีข้อมูลให้รั่ว
สถานะ
เผยแพร่แล้ว
เผยแพร่เมื่อ
12 ก.ย. 2026
เทคโนโลยี
Next.js · React · TypeScript · Tailwind CSS · WebAssembly · Pyodide · Vitest · Playwright

ดูต่อ

โปรเจกต์อื่น ๆ

โปรเจกต์ทั้งหมด