用 AI,自己做店里的工具
Vibe Coding Workshop · a proposal for your team · by APEX Corporate Systems
课前准备
SELF-SETUP HANDBOOK
- 1照 APEX 课前准备手册,自己在家装好Set up at home with the APEX pre-class handbook.
- 2三步:开账号 → 安装工具 → 检查(Windows / Mac 都有)Three steps: create accounts → install the tools → check. Guides for both Windows and Mac.
- 3所有账号都用同一个 EmailUse the same email for every account.
3 天学什么
WHAT YOU'LL LEARN
认识 vibe coding,做一个落地页
Day 1 · Landing page
- 什么是 vibe coding、用哪些工具What vibe coding is, and which tools you will use.
- 用 Claude Code 做一个电脑店落地页Build a computer-shop landing page with Claude Code.
- 存进 GitHub,上线 VercelSave it to GitHub and go live on Vercel.
笔记本维修与保修工单
Day 2 · Laptop Repair & Warranty Job Card
- 维修看板:收机 → 检测 → 维修 → 质检 → 可取机 → 完成A repair board: received → inspected → in repair → quality check → ready for pickup → done.
- Serial No. 维修记录、保修到期自动计算Serial No. repair history, and automatic warranty expiry.
- WhatsApp 取机通知;资料存 Supabase,上线 VercelWhatsApp pickup notices; data stored in Supabase and published on Vercel.
选一个,自己做
Day 3 · Pick your own build
- 从选单挑一个:例如维修进度查询、预约送修、上门服务派工Choose from a menu — for example a repair-status page, drop-off booking, or on-site dispatch.
- 或带你自己的想法来Or bring your own idea.
- 在课堂上做完,导师在旁边帮Finish it in class, with the trainer beside you.
DAY 3 MENU EXAMPLES
你会带走什么
WHAT YOU WALK AWAY WITH
- 12 个上线的工具,店里马上可以试用Two live tools the shop can start trying out right away.
- 2一套方法:写 prompt → 先看样子 → 让它动起来 → 上线A method you can repeat: write a prompt → check the look → make it work → go live.
- 3以后想到新点子,自己就能做When a new idea comes up later, the team can build it themselves.
要带什么
WHAT TO BRING
- 笔记本电脑(已照手册装好)A laptop, already set up with the handbook.
- 充电器A charger.
- 手机(收登入验证码)A phone, for login verification codes.
- 所有账号密码(同一个 Email)All account passwords, on the same email.
- 店的资料:logo、地址、营业时间、照片Shop details: logo, address, opening hours, and photos.
- 一个想法:店里最想改善的事One idea: the thing the shop most wants to improve.
过往作品
LIVE EXAMPLES WE CAN OPEN TOGETHER
- 1以下都是已上线的网站,简报时可以直接打开查看。These are live sites. We can open them together during the briefing.
需登入 · LOGIN
Contractor 仪表板
CONTRACTOR DASHBOARD
承包商业务仪表板,含总览、报价单与收款。打开链接后需登入才能查看系统内部。
A contractor operations dashboard with an overview, quotations / invoices (报价单), and payments (收款). Login is required to view the app itself.
contractor-ten-ochre.vercel.app/login ↗
需登入 · LOGIN
Apex 仪表板
APEX DASHBOARD
APEX 业务仪表板,含客户、报价、发票、收款、支出、对账单与报表。打开链接后需登入才能查看系统内部。
The APEX business dashboard: customers, quotations, invoices, payments, expenses, statements, and reports. Login is required to view the app itself.
apex-dashboard-smoky.vercel.app/login ↗
Apex 公司网站
COMPANY WEBSITE
APEX Corporate Systems 的官方网站,展示正版 Microsoft 授权产品与 WhatsApp 订购流程。
The official website of APEX Corporate Systems, with genuine Microsoft licences and WhatsApp ordering.
apexcorp.com.my ↗
Golden Well Auto
GOLDEN WELL AUTO
Golden Well Auto 的宣传网站:Kapar(雪兰莪)的行车记录仪与隔热膜服务、示例价格、WhatsApp 询价与店铺资料。
A live marketing site for Golden Well Auto: dash cams and window tint in Kapar, Selangor, with sample prices, WhatsApp quotes, and shop details.
golden-well.vercel.app ↗联系我们
LET'S TALK AFTER THE BRIEFING
Business Development Director
Kelvin Tay
APEX Corporate Systems
欢迎在简报后继续讨论课程安排与人数。Happy to continue after the briefing on dates and class size.