# 485Tech.com

485Tech.com คือแพลตฟอร์ม **Free Online Tools แบบ local-first/privacy-first** สำหรับงานข้อความ, JSON, developer utilities, file/PDF/Office/image/audio/video และ workflow ที่ทำได้ใน browser. เป้าหมายคือให้ผู้ใช้ทำงานได้จริงโดยไม่ต้องอัปโหลด input เป็นค่าเริ่มต้น พร้อม UI ที่ responsive, keyboard-accessible และมี disclosure เรื่อง storage/network อย่างตรงไปตรงมา.

> **Current boundary:** เครื่องมือส่วนใหญ่ประมวลผลใน browser และไม่ส่ง input ไป server โดยค่าเริ่มต้น. `bg-remover`, `diagram` และ `excel-chat` อาจดาวน์โหลด model/library เมื่อใช้ครั้งแรก จึงไม่ถูกประกาศว่า fully offline.

## Current status

Local source และ generated release assets ผ่าน release gate สำหรับ catalog 159 live tools. Named local snapshots, capability metadata schema v2, shared capability details panel และ immutable-ASSETS Worker regression มี focused QA แล้ว. Code baseline `4656cf4` ผ่าน Cloudflare Workers Build `35a95605-6ebe-4365-aede-e98f9b6381e3`; latest docs HEAD `b63aa65` ผ่าน GitHub Actions run `33092071834` และ Cloudflare docs-only Build `6631647b-8ee9-41b6-8c11-b1d432178d73`. Live probe หลัง latest build ยืนยัน routes, Worker security headers, CSP nonce parity และ HTML `no-store` โดยไม่พบ `1101`. Workers Builds เป็น production deploy source of truth; active version/rollback record ยังเป็น owner follow-up เพราะ API metadata คืน `deployment_id` ว่าง.

รายละเอียดตัวเลขและหลักฐานอยู่ใน [release-gate-final.md](docs/release-gate-final.md) และ [cloudflare-deployment-audit.md](docs/cloudflare-deployment-audit.md).

## Quick start

ต้องใช้ Node.js ที่รองรับ ES modules และ dependencies ใน `package-lock.json`.

```bash
npm ci
npm run build
PORT=8788 npm run preview
```

เปิด `http://localhost:8788/`, `http://localhost:8788/tools` หรือ `http://localhost:8788/tools/json`. Preview server rebuilds source pages เมื่อ request HTML-like route เพื่อให้เห็น generated output ล่าสุด.

## Repository structure

| Path | หน้าที่ |
|---|---|
| `src/` | source templates, page metadata, i18n, capability contract และ Worker source |
| `public/scripts/tools/apps/` | tool modules/adapters และ tool-specific CSS/assets |
| `public/scripts/tools/tools-core.js` | shared DOM/i18n/download/clipboard/pin/history/workspace runtime |
| `public/scripts/tools/tools-app.js` | standalone studio bootstrap และ shared details renderer |
| `public/scripts/tools/mega-tools.js`, `pro-tools*.js` | shared runtime ของกลุ่ม tool เดิม/ขั้นสูง |
| `scripts/build.mjs` | build, catalog, capability injection, standalone pages, canonical/sitemap |
| `scripts/*.mjs` | validators, unit/browser/worker/functional tests และ QA |
| `.github/workflows/ci.yml` | automatic build, docs/contract, Worker และ browser validation on push/PR; validation-only |
| `src/worker/index.js` | Cloudflare Worker routing, security headers และ API handlers |
| `wrangler.toml` | Worker `home`, ASSETS binding และ environment variables |
| `migrations/` | D1 migrations เมื่อ D1 binding ถูกเปิดใช้งาน |
| `docs/` | architecture, commenting standard, tool authoring, release evidence และ roadmap |

อ่าน [docs/project-architecture.md](docs/project-architecture.md) สำหรับ data flow และ lifecycle แบบเต็ม.

## Development model

Tool แต่ละรายการมี stable id และถูกสร้างเป็น standalone page จาก `src/app-layout.html`. `scripts/build.mjs` อ่าน catalog/manifests และ `src/tool-capabilities.json`, แล้วสร้าง `public/tools/<id>/index.html` พร้อม injected capability payload. Runtime bootstrap โหลด app module และเรียก registration/mount contract; shared shellจัดการ top bar, i18n, pin/history, ads slot และ details disclosure.

Draft และ named snapshots อยู่ใน browser IndexedDB ผ่าน `Tools.workspace`; snapshot schema v2 มี cap 5 MB ต่อ value และ 25 MB รวม. Local workspace ไม่ใช่ account sync. การเพิ่ม network/upload/sync ต้องมี threat model, consent, encryption/data-retention design และแก้ privacy/capability/tests พร้อมกัน.

## Commands

| Command | ใช้ทำอะไร |
|---|---|
| `npm run build` | สร้าง public pages, catalog, standalone tools และ sitemap |
| `npm run preview` | เปิด local preview server |
| `npm run validate:tools` | ตรวจ catalog และ capability contract |
| `node scripts/validate_syntax.mjs` | ตรวจ JSON parse และ JS syntax |
| `node scripts/unit-app-test.mjs` | ตรวจ representative unit app/core behavior |
| `node scripts/worker-smoke.mjs` | ตรวจ Worker route/security/auth/API behavior |
| `node scripts/smoke_all_tools.mjs` | mount smoke ของ live tools ทั้งหมด |
| `node scripts/functional_extra.mjs` | functional audit ของ file/PDF/Office/ZIP/image/audio |
| `node scripts/functional-matrix.mjs` | all-tool readiness/interactive/console matrix |
| `node scripts/deep-tool-sweep.mjs` | broad input/select/file/action sweep |
| `node scripts/ui-regression.mjs` | desktop/mobile user journeys and persistence |
| `node scripts/qa-json-snapshots.mjs` | snapshot, locale, mobile overflow และ overlay QA |
| `node scripts/qa-capability-details.mjs` | shared details/privacy/network disclosure QA |
| `CI=1 npx --yes wrangler@4.127.0 deploy --dry-run --env production` | ตรวจ package/bindings โดยไม่ deploy |

## Standards and handoff

- [AGENTS.md](AGENTS.md) — AI engineering handoff, safety boundaries และ change protocol
- [CONTRIBUTING.md](CONTRIBUTING.md) — workflow สำหรับมนุษย์/AI, review, commit และ release
- [docs/project-architecture.md](docs/project-architecture.md) — system map, build/runtime/storage/security flow
- [docs/code-commenting-standard.md](docs/code-commenting-standard.md) — comment/JSDoc/data-boundary standard
- [docs/tool-authoring-standard.md](docs/tool-authoring-standard.md) — tool contract, accessibility, file/privacy/test rules
- [docs/release-checklist.md](docs/release-checklist.md) — production release and automated build checklist
- [docs/next-phase-roadmap.md](docs/next-phase-roadmap.md) — ลำดับการพัฒนาต่อ
- [docs/release-gate-final.md](docs/release-gate-final.md) — ผล validation และ deployment status ล่าสุด
- [docs/cloudflare-deployment-audit.md](docs/cloudflare-deployment-audit.md) — Cloudflare API/live route audit

## Commenting rule of thumb

เขียน comment เมื่อจำเป็นต้องอธิบาย **why, contract, invariant, lifecycle, side effect, privacy boundary หรือ failure mode**. ไม่เขียน comment ซ้ำ syntax. ถ้า comment บอกว่า feature ทำงานแบบใด ต้องตรวจให้ตรงกับ source, test, capability metadata และ UI copy. ดูรายละเอียดใน [code-commenting-standard.md](docs/code-commenting-standard.md).

## Production deployment

GitHub push ไม่เท่ากับ Cloudflare production deploy. ต้องเลือก Workers Builds หรือ GitHub Actions เป็น deployment source of truth เพียงหนึ่งทาง และตรวจ build/deployment record ของ commit ล่าสุด. หาก live route ตอบ 500/1101 ให้ถือเป็น deployment blocker ไม่ใช่แก้ข้อความเพื่อซ่อนปัญหา. ห้ามเก็บ Cloudflare credentials ใน repository; ใช้ provider secret store.

## License and ownership

ตรวจ license ของ dependency/vendor และกำหนด project license ก่อนเผยแพร่เป็น open source อย่างเป็นทางการ. ไฟล์นี้ไม่ประกาศ license แทนเจ้าของ repository.