OTTO — home

ผลงานทั้งหมดIndex

ผลงานทั้งหมดAll projects

กรองตาม layer หรือสถานะ แล้วกดเพื่ออ่านรายละเอียดFilter by layer or status, then open one for the details.

Filter projects

แสดง 23 จาก 23 ผลงานShowing 23 of 23

รายการผลงานProject list

ระบบใบเสนอราคา ใบแจ้งหนี้ และใบเสร็จQuotations, Invoices & ReceiptsApp

ระบบเอกสารขายสำหรับธุรกิจขนาดเล็ก — เสนอราคา → แปลงเป็นใบแจ้งหนี้ → รับชำระ → ออกใบเสร็จ คิด VAT 7% และหัก ณ ที่จ่าย ติดตามลูกหนี้ พิมพ์ PDF พร้อม QRSales paperwork for small businesses — quote → invoice → payment → receipt, with 7% VAT, withholding tax, receivables aging and printable PDFs with PromptPay QR.

บทบาทRole ทำคนเดียว — ออกแบบระบบ logic, UI และ testSolo — system design, logic, UI and tests

Frontend · Backend / APIFrontend · Backend / API
เสร็จแล้วShipped2026

TypeScript · React · REST API · EMVCo QR

เปิดใช้งานOpen app — Quotations, Invoices & Receipts

ระบบสต็อกสินค้า + สั่งซื้อInventory & PurchasingApp

คุมสต็อกร้าน/คลังวัตถุดิบ — รับเข้า เบิกออก ต้นทุนถัวเฉลี่ย แจ้งเตือนของใกล้หมด สร้างใบสั่งซื้อแยกตามผู้ขายอัตโนมัติ รับของบางส่วน ตรวจนับ และบัตรสต็อกStock control for shops and stock rooms — in/out, moving-average cost, low-stock alerts, auto-drafted POs per supplier, partial receiving, stock counts and stock cards.

บทบาทRole ทำคนเดียว — ออกแบบระบบ logic, UI และ testSolo — system design, logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · Print CSS · Vitest

เปิดใช้งานOpen app — Inventory & Purchasing

OTTO API — Backend ระบบเอกสารขายOTTO API — Billing backend

REST API ที่ทำให้ระบบใบเสนอราคา/ใบแจ้งหนี้ใช้ได้หลายเครื่องและหลายคน — บัญชีผู้ใช้ สิทธิ์ในร้าน เลขที่เอกสารไม่ซ้ำแม้สร้างพร้อมกัน รับชำระแบบกันซ้ำ และ test กับ Postgres จริงA REST API that takes the billing app multi-device and multi-user — accounts, per-business roles, gap-free document numbers under concurrency, idempotent payments, tested against real Postgres.

บทบาทRole ทำคนเดียว — ออกแบบ API ฐานข้อมูล ระบบยืนยันตัวตน test และ deploySolo — API & schema design, auth, tests and deployment

Backend / API · Database · Deploy & InfraBackend / API · Database · Deploy & Infra
เสร็จแล้วShipped2026

Node.js · TypeScript · Fastify · PostgreSQL

ลองใช้งานจริงTry the live app — OTTO API — Billing backend (opens in new tab)

หารบิล + QR พร้อมเพย์Bill Splitter + PromptPay QRApp

หารค่าอาหารตามที่แต่ละคนกินจริง คิดค่าบริการและ VAT ให้ แล้วสร้าง QR พร้อมเพย์ยอดของแต่ละคน สแกนจ่ายได้ทุกธนาคารSplit a restaurant bill by who ate what, with service charge and VAT, then get a PromptPay QR with each person's exact amount.

บทบาทRole ทำคนเดียว — ออกแบบ logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · EMVCo QR · Vitest

เปิดใช้งานOpen app — Bill Splitter + PromptPay QR

ระบบขายหน้าร้าน (POS)Point of Sale (POS)App

ระบบขายหน้าร้านครบวงจร — ขาย ตัดสต็อก รับเงินสด/QR พร้อมเพย์ พิมพ์ใบเสร็จ ดูยอดขายรายชั่วโมง/7 วัน และสินค้าขายดี ใช้บนแท็บเล็ตได้A complete shop till — sell, track stock, take cash or PromptPay QR, print receipts, and see hourly/7-day sales and best sellers. Tablet-friendly.

บทบาทRole ทำคนเดียว — ออกแบบระบบ logic, UI และ testSolo — system design, logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · EMVCo QR · Print CSS

เปิดใช้งานOpen app — Point of Sale (POS)

ระบบจัดการหอพักDorm & Apartment ManagerApp

จัดการห้องและผู้เช่า จดมิเตอร์น้ำ-ไฟ ออกบิลทุกห้องในคลิกเดียวพร้อม QR พร้อมเพย์ พิมพ์ใบแจ้งหนี้ ติดตามค้างชำระ และสรุปรายรับรายเดือนRooms and tenants, water/electric meter readings, one-click monthly invoices with PromptPay QR, printable bills, overdue tracking and monthly income.

บทบาทRole ทำคนเดียว — ออกแบบระบบ logic, UI และ testSolo — system design, logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · EMVCo QR · Print CSS

เปิดใช้งานOpen app — Dorm & Apartment Manager

คำนวณเกรด GPA / GPAXGPA / GPAX CalculatorApp

คำนวณเกรดรายเทอมและเกรดเฉลี่ยสะสมแบบมหาวิทยาลัยไทย พร้อมบอกว่าต้องได้เกรดเท่าไหร่ถึงจะถึงเป้าหรือเกียรตินิยมTerm GPA and cumulative GPAX the Thai-university way, plus a planner that tells you what you need to hit your target or honours.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · Vitest

เปิดใช้งานOpen app — GPA / GPAX Calculator

บอร์ดจัดการงาน (Kanban)Kanban Task BoardApp

บอร์ดงานแบบ Trello — หลายบอร์ด ลากวางการ์ด (หรือใช้คีย์บอร์ด) ป้ายกำกับ กำหนดส่ง เช็กลิสต์ จำกัดงานพร้อมกัน (WIP) ตัวกรอง และส่งออก/นำเข้าบอร์ดA Trello-style board — multiple boards, drag-and-drop (or keyboard) cards, labels, due dates, checklists, WIP limits, filters, and board import/export.

บทบาทRole ทำคนเดียว — logic, UI, การเข้าถึง และ testSolo — logic, UI, accessibility and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · HTML5 Drag & Drop · WAI-ARIA

เปิดใช้งานOpen app — Kanban Task Board

จดรายรับรายจ่ายMoney DiaryApp

จดรายรับรายจ่ายได้ในไม่กี่วินาที เห็นว่าเงินหมดไปกับอะไร ตั้งงบแต่ละหมวด และส่งออกเป็น CSV เปิดใน Excel ได้ — ไม่ต้องสมัครสมาชิกLog income and spending in seconds, see where the money goes, set category budgets and export to CSV for Excel — no sign-up.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · CSV · Vitest

เปิดใช้งานOpen app — Money Diary

บัตรคำทวนสอบ (Spaced Repetition)Flashcards with Spaced RepetitionApp

ท่องศัพท์/สูตรด้วยอัลกอริทึม SM-2 — ระบบเลือกบัตรที่ใกล้ลืมมาให้ทบทวนทุกวัน วางคำศัพท์จาก Excel ได้ มีโหมดเลือกตอบ คีย์ลัด และสถิติLearn vocab or formulas with SM-2 — cards return right before you'd forget. Paste from a spreadsheet, multiple-choice mode, shortcuts and stats.

บทบาทRole ทำคนเดียว — อัลกอริทึม, UI และ testSolo — algorithm, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · SM-2 · Vitest

เปิดใช้งานOpen app — Flashcards with Spaced Repetition

ตารางเรียน + ส่งเข้าปฏิทินClass Timetable + Calendar ExportApp

จัดตารางเรียนรายสัปดาห์ เตือนเมื่อเวลาชนกัน บอกคาบถัดไป และส่งออกไฟล์ .ics ให้ทุกคาบขึ้นในปฏิทินมือถือซ้ำทุกสัปดาห์จนปิดเทอมBuild your weekly timetable, catch clashes, see your next class, and export an .ics file so every class repeats in your phone calendar.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · iCalendar (RFC 5545) · Vitest

เปิดใช้งานOpen app — Class Timetable + Calendar Export

คำนวณผ่อน รถ บ้าน สินค้าLoan & Instalment CalculatorApp

คำนวณค่างวดแบบดอกเบี้ยคงที่ (ผ่อนรถ/สินค้า) และลดต้นลดดอก (บ้าน) พร้อมแปลงเป็นดอกเบี้ยที่แท้จริงต่อปี จะได้รู้ว่าสัญญาไหนถูกกว่าMonthly payments for flat-rate (cars, gadgets) and reducing-balance (homes) loans, plus the real annual rate so you can compare offers.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · Numerical methods · Vitest

เปิดใช้งานOpen app — Loan & Instalment Calculator

จับเวลาโฟกัส (Pomodoro)Focus Timer (Pomodoro)App

จับเวลาอ่านหนังสือ 25 นาที พัก 5 นาที ผูกกับรายการงาน นับว่าแต่ละงานใช้กี่รอบ และดูสถิติการโฟกัส 7 วัน25-minute focus / 5-minute break cycles tied to a task list, with rounds per task and a 7-day focus history.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · Web Audio · Notifications API

เปิดใช้งานOpen app — Focus Timer (Pomodoro)

สุ่มแบ่งกลุ่ม / สุ่มชื่อGroup Maker & Name PickerApp

วางรายชื่อแล้วสุ่มแบ่งกลุ่มให้ขนาดเท่ากัน ตั้งคู่ที่ห้ามอยู่กลุ่มเดียวกันได้ มีรหัสการสุ่มให้ตรวจสอบได้ว่ายุติธรรม และสุ่มเลือกคนตอบคำถามPaste a class list to make even groups, keep certain pairs apart, share a shuffle code that proves the draw was fair, or pick someone at random.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · Seeded PRNG · Vitest

เปิดใช้งานOpen app — Group Maker & Name Picker

อ่านจำนวนเงิน & วันที่ไทยThai Baht Text & DatesApp

แปลงตัวเลขเป็นคำอ่านเงินบาทแบบ BAHTTEXT และภาษาอังกฤษสำหรับใบเสร็จ/ใบแจ้งหนี้ แปลงวันที่แบบไทย พ.ศ.↔ค.ศ. เลขไทย และนับวัน/คำนวณอายุBaht amounts in Thai words (like Excel BAHTTEXT) and English for invoices, Thai date formats, BE↔CE years, Thai numerals, and day/age counting.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · Vitest

เปิดใช้งานOpen app — Thai Baht Text & Dates

ระบบจองที่พักรีสอร์ทResort Booking System

ระบบจองห้องพักครบวงจร แยกพอร์ทัลลูกค้าและพนักงาน มี OTP login แจ้งเตือนทางอีเมล และอัปโหลดรูปห้องพักขึ้น cloudEnd-to-end room booking with separate guest and staff portals, OTP login, email notifications and cloud image uploads.

บทบาทRole Full-stack Developer

Frontend · Backend / API · Database · Deploy & InfraFrontend · Backend / API · Database · Deploy & Infra
เสร็จแล้วShipped2026

Node.js · Express · PostgreSQL · JWT

ลองใช้งานจริงTry the live app — Resort Booking System (opens in new tab)

Boardgame Everyday

เว็บจองโต๊ะและเกมสำหรับร้านบอร์ดเกมคาเฟ่ งานกลุ่ม 6 คน — ผมดูแลฝั่ง backend ส่วน collection, plays, reviews และสถิติTable and game booking web app for a board game café. Team of 6 — I own the collection, plays, reviews and stats backend modules.

บทบาทRole Backend — collection, plays, reviews, stats (business logic, aggregation, CRUD)

Backend / API · DatabaseBackend / API · Database
กำลังพัฒนาIn progress2026

Node.js · Express · MongoDB · Mongoose

ระบบจัดการพอร์ตลงทุนInvestment Portfolio Manager

ระบบติดตามพอร์ตลงทุนคล้าย Google Finance — สัดส่วนสินทรัพย์ แนวรับแนวต้าน แจ้งเตือนราคา และ rebalancing ด้วยราคาจริงจาก Yahoo FinanceA Google Finance–style portfolio tracker — allocation, support/resistance, price alerts and rebalancing with live Yahoo Finance prices.

บทบาทRole Full-stack Developer (โปรเจกต์วิชา CP353002)Full-stack Developer (CP353002 course project)

Frontend · Backend / API · DatabaseFrontend · Backend / API · Database
กำลังพัฒนาIn progress2026

Java · Spring Boot · React · Yahoo Finance API

Secure Code Judge Sandbox

ตัวรันโค้ดแบบ online judge ที่คอมไพล์และรันโค้ดที่ไม่น่าไว้ใจอย่างปลอดภัย จำกัดเวลา/หน่วยความจำ และบล็อก system call อันตรายAn online-judge style runner that compiles and runs untrusted code safely — time/memory limits and dangerous syscalls blocked.

บทบาทRole สมาชิกทีม — วิชา Operating Systems and System Calls ProgrammingTeam member — Operating Systems and System Calls Programming

Systems / OSSystems / OS
กำลังพัฒนาIn progress2026

C · Linux · fork/execve · setrlimit

เว็บ Portfolio นี้This portfolio site

Monorepo Next.js + TypeScript ที่ตรวจข้อมูลผลงานด้วย Zod ตอน build และ deploy อัตโนมัติขึ้น GitHub Pages ผ่าน GitHub ActionsA Next.js + TypeScript monorepo that validates project content with Zod at build time and ships to GitHub Pages via GitHub Actions.

บทบาทRole ทำคนเดียวทั้งหมดSolo — design, code, CI/CD

Frontend · Deploy & InfraFrontend · Deploy & Infra
กำลังพัฒนาIn progress2026

Next.js · TypeScript · Zod · pnpm workspaces

Syscall Sandbox VisualizerLab

ดูทีละขั้นว่า online judge ใช้ fork, setrlimit, seccomp และ execve กันโค้ดอันตรายอย่างไร ลองส่งลูปไม่รู้จบหรือ fork bomb แล้วดูผลได้เลยStep through how an online judge uses fork, setrlimit, seccomp and execve to contain hostile code — try an infinite loop or a fork bomb.

บทบาทRole ทำคนเดียว — ออกแบบ แอนิเมชัน และตัวจำลองSolo — design, animation and the simulator

Frontend · Systems / OSFrontend · Systems / OS
เสร็จแล้วShipped2026

TypeScript · React · Linux syscalls · Vitest

ลองใช้งานTry it — Syscall Sandbox Visualizer

เครื่องคำนวณปรับสมดุลพอร์ตPortfolio RebalancerLab

ใส่สินทรัพย์ที่ถือกับสัดส่วนเป้าหมาย แล้วดูว่าต้องซื้อหรือขายเท่าไหร่ — มีโหมด 'ซื้ออย่างเดียว' ใช้เงินที่เติมเข้ามาโดยไม่ต้องขายEnter your holdings and target mix to see exactly what to buy or sell — including a buy-only mode that rebalances with new cash.

บทบาทRole ทำคนเดียว — logic, UI และ testSolo — logic, UI and tests

FrontendFrontend
เสร็จแล้วShipped2026

TypeScript · React · Vitest

ลองใช้งานTry it — Portfolio Rebalancer

Aggregation PlaygroundLab

ลองเขียน MongoDB aggregation pipeline กับข้อมูลการเล่นบอร์ดเกม แล้วดูข้อมูลเปลี่ยนไปทีละ stage — engine เขียนเองทั้งหมด รันในเบราว์เซอร์Write a MongoDB aggregation pipeline against board-game play data and watch the documents change stage by stage — a hand-written engine that runs in the browser.

บทบาทRole ทำคนเดียว — query engine, UI และ testSolo — query engine, UI and tests

Frontend · DatabaseFrontend · Database
เสร็จแล้วShipped2026

TypeScript · React · MongoDB · Vitest

ลองใช้งานTry it — Aggregation Playground