메뉴
Run Next.js dev server and expose it via localtunnel for live preview sharing. Returns a public URL the user can send to clients or view on mobile. Activated after scaffold to let user see their site before deploy.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Single entrypoint for taw-kit. User types `/taw <anything in VN or EN>` — this skill classifies the intent (BUILD / FIX / SHIP / MAINTAIN / ADVISOR) and loads the matching branch file to execute. Replaces the old one-command-per-task model (/taw-new, /taw-add, /taw-fix, /taw-deploy, /taw-security) with a single unified command. Supports dev workflows out of the box: test, upgrade, clean, perf, rollback, refactor, types, seed, review, stack-swap, status, and ADVISOR group (analyze, suggest, coverage, adversarial, scope-check) for opinionated review of existing code. User-visible strings match the user's input language (Vietnamese by default for VN users). Two modes: SAFE (default — clarify + approval, max 1 round-trip) and YOLO (skip gates, smart defaults — for demos/power users). YOLO triggers: prose contains `yolo`, `nhanh nha`, `lam luon`, `khoi hoi`, `auto`, or args start with `yolo`. Trigger phrases (EN + VN) — broad match so user can keep typing plain prose without re-invoking /taw every turn. Grouped by
Safe dependency upgrade reference: breaking-change notes for common taw-kit deps (Next.js, React, Supabase, Tailwind, TypeScript, shadcn), codemod commands, and a standard safety protocol. Used by branches/maintain/upgrade.md. Trigger phrases (EN + VN): "breaking change", "codemod", "upgrade next", "upgrade react", "nang cap an toan", "cap nhat deps", "migration guide".
taw-kit's unified commit skill: stages files, scans for secrets/env/build-artefact leaks, generates a conventional commit message by READING the actual diff (not guessing), then commits. Two modes: CONTEXT mode (called by taw orchestrator — uses .taw/checkpoint.json phase info, writes strict [P<n>] format) and SMART mode (ad-hoc — infers type+scope+subject from diff content). Replaces the old git-auto-commit + commit-message-smart skills (merged). User never types git commands. Always prefixes output with "taw:" so you know which tool did it.
taw-kit's advanced git skill: create branches, open pull requests with auto-generated body (reads diff + commits + existing PR template), merge (fast-forward only), and recover from common mistakes. Replaces the old git-pro + pr-description skills (merged). Complements taw-commit (single commits) and taw-trace (history lookup). User-visible strings in user's language; raw git/gh commands verbatim so power users can learn. Every output prefixed "taw:" for branding.
Look up taw-kit git history without needing to know git. Find which commit added a feature, changed a file, or ran during which phase. Reads the strict format written by `taw-commit` (type(scope): subject [P<n>]). Every output prefixed "taw:" for branding. Replaces the old git-trace skill (rename only). Trigger phrases (VN + EN): "xem lich su", "ai sua cai nay", "khi nao them", "commit nao lam hong", "tra lai phase", "show git history", "blame".
ast-grep (sg) pattern cookbook for safe structural refactors in TypeScript / TSX projects. Covers rename, extract, find-and-replace with code context. Used by branches/maintain/refactor.md when ast-grep is available. Trigger phrases (EN + VN): "ast-grep", "structural replace", "rename symbol", "codemod tsx", "tim cau truc", "thay the theo pattern".
| name | preview-tunnel |
| description | Run Next.js dev server and expose it via localtunnel for live preview sharing. Returns a public URL the user can send to clients or view on mobile. Activated after scaffold to let user see their site before deploy. |
| argument-hint | [port hoac 'start'] |
Give non-dev users a shareable preview URL for their locally running Next.js app without needing to deploy. Useful for client reviews and mobile testing.
npm run dev
# Runs on http://localhost:3000 by default
npx localtunnel --port 3000
# Returns: your url is: https://random-name.loca.lt
Or with a fixed subdomain (not guaranteed, best effort):
npx localtunnel --port 3000 --subdomain ten-cua-hang
# Returns: https://ten-cua-hang.loca.lt
Provide user with the tunnel URL and this note in Vietnamese:
Link xem thu: https://ten-cua-hang.loca.lt
(Link nay chi hoat dong khi may tinh ban dang bat.
De co link thuong tru, dung /taw-deploy)
# Terminal 1
npm run dev
# Terminal 2
npx localtunnel --port 3000
Or with a single command using concurrently:
npm install --save-dev concurrently
Add to package.json:
{
"scripts": {
"preview": "concurrently \"npm run dev\" \"npx localtunnel --port 3000\""
}
}
Then: npm run preview
| Issue | Fix |
|---|---|
| "localtunnel: command not found" | Run npx localtunnel (no global install needed) |
| Tunnel URL shows password prompt | Enter any text — it's loca.lt's anti-abuse gate |
| Port 3000 already in use | Kill with lsof -ti:3000 | xargs kill -9 or use port 3001 |
| Slow tunnel | Normal for loca.lt; for faster preview use Vercel deploy |
If localtunnel is unreliable, deploy a preview branch instead:
vercel deploy --prebuilt
# Returns a preview URL like: https://project-abc123.vercel.app
Supabase auth redirect URLs must include the tunnel URL for magic-link auth to
work during preview. Add https://*.loca.lt to allowed redirect URLs in
Supabase dashboard → Auth → URL Configuration.