Dựng MCP server từ đầu mà không tự viết code

Dựng một MCP app theo dõi chi tiêu bằng Opus 5 trong Cursor với mcp-use và Supabase, test bằng Inspector, deploy lên Manufact rồi gắn vào Claude.

Đã duyệt độc lập · cập nhật 20/10/2026 · 28 min

1. Mục tiêu: một MCP app dựng và deploy hoàn toàn bằng AI

Astro K Joseph mở đầu bằng lời hứa của cả video: anh sẽ cho thấy cách tạo một MCP app và deploy nó, tất cả trong khoảng dưới 30 phút, chỉ dùng AI. Cụ thể, anh dùng mcp-use để build chính cái MCP app, rồi deploy nó lên Manufact chỉ với vài cú click.

Astro K Joseph nói trước camera, phía sau là tường xanh và tranh động lực
Astro K Joseph giới thiệu nội dung video trước khi chuyển sang màn hình.

Điểm hay nhất, theo anh, là bạn không phải viết một dòng code nào. AI sẽ build toàn bộ MCP app từ đầu tới cuối. Và anh không chỉ dừng ở chuyện build: anh còn sẽ chỉ cách deploy, cách gắn một custom domain, rồi cách kết nối app đó vào Claude hoặc ChatGPT, kèm một demo thật để thấy nó chạy ra sao.

2. mcp-use và Manufact: như Next.js và Vercel, nhưng cho MCP

Để build và deploy một MCP app, anh dùng hai thứ: mcp-use và Manufact. mcp-use được anh mô tả là một framework full stack để tạo ra những MCP app đẹp, có giao diện trực quan (visual UI) và những thứ tương tự. Trên màn hình, anh mở repo GitHub của project: dòng tiêu đề ghi "The TypeScript framework for MCP", tức framework TypeScript cho MCP. Đây là framework anh sẽ dùng để build MCP app.

README của repo mcp-use trên GitHub với dòng The TypeScript framework for MCP
README của repo mcp-use: "The TypeScript framework for MCP", dòng phụ "Build, test, and ship MCP servers, ChatGPT plugins, Claude connectors", và các liên kết Documentation, Inspector, Examples, Deploy.

Sau khi build xong MCP app, anh dùng Manufact để deploy. Trang chủ Manufact ghi "Build and deploy MCP apps and servers", tức nơi build và deploy MCP app và MCP server. Anh đưa ra một phép so sánh dễ nhớ: hãy coi Manufact như Vercel dành cho MCP app, còn mcp-use thì như Next.js. Bạn build web app bằng Next.js rồi deploy lên Vercel; theo cùng cách đó, bạn dùng mcp-use để build một MCP app full stack, rồi dùng Manufact để deploy nó, đưa nó lên internet, và gắn custom domain cho nó.

Theo video ngày 19/09/2026, Manufact có cả một gói miễn phí (free plan). Việc đầu tiên anh bảo người xem làm là vào Manufact và đăng ký một tài khoản mới; anh đã có sẵn tài khoản rồi. Tiếp theo, ai muốn tìm hiểu thêm về mcp-use thì vào repo GitHub của nó.

3. Công cụ: Opus 5 trong Cursor và một prompt dài

Anh nhấn mạnh rằng trong cả quá trình, bạn gần như không phải đụng vào phần code nào, cũng không phải đi qua những buổi code phức tạp, vì mọi thứ sẽ do AI lo. Cụ thể trong video này, anh dùng model Opus 5 thông qua Cursor. Anh đã chuẩn bị sẵn một prompt rất dài để AI dựng app, và hứa sẽ đi qua toàn bộ prompt đó trong video.

Promptmô tả app CursorOpus 5, plan mode mcp-useSupabase Manufactdeploy, domain ClaudeChatGPT mcp-use dựng server + widget; Supabase lo database, auth, lưu file
Hình 3.1Bộ công cụ trong video: một prompt chi tiết đưa vào Cursor chạy Opus 5, AI dựng app bằng mcp-use với Supabase phía sau, Manufact deploy, rồi app được gắn vào Claude hoặc ChatGPT.

Nhưng trước khi chỉ cách build và deploy, anh cho xem một demo thật của MCP app mà anh vừa làm xong, để người xem biết sản phẩm cuối trông ra sao.

4. Demo Pocket Ledger trong Claude: bảng chi tiêu theo tháng

App anh làm tên là Pocket Ledger: một MCP giúp người dùng quản lý tài chính cá nhân. Sau khi thêm MCP này, họ chỉ cần bảo AI thêm một giao dịch, xem bảng phân tích chi tiêu theo tháng, hoặc upload ảnh hoá đơn rồi bảo AI thêm khoản đó vào chi tiêu, và những việc tương tự.

Vì Pocket Ledger đã được cấu hình sẵn trong tài khoản Claude của anh, anh hỏi luôn: "can you please give me a monthly breakdown of my expenses for the month of August and September?" (cho tôi bảng chi tiêu theo tháng của tháng Tám và tháng Chín), rồi bấm Enter. Để chứng minh Pocket Ledger đã được thêm vào Claude, anh mở Customize, vào Connectors, cuộn xuống và chỉ ra Pocket Ledger nằm trong danh sách.

Widget Monthly Spending của Pocket Ledger trong Claude, tháng Chín 2026
Widget do Pocket Ledger vẽ ngay trong khung chat Claude (tool get-monthly-expenses): tổng chi tháng 09/2026 là $6,983.35, tháng trước $40,069.20, trung bình mỗi khoản $634.85, và thanh chia theo nhóm Shopping, Health, Subscriptions, Transport, Food & Dining, Entertainment.

Đợi Claude kéo dữ liệu về, kết quả là Claude render ra một widget đẹp ngay trong chat, hiển thị các giao dịch của tháng Chín và cả tháng Tám. Theo số trong demo (video ngày 19/09/2026), tháng Chín anh tiêu khoảng 6.983 đô; widget còn ghi con số của tháng trước và mức chi trung bình mỗi khoản. Bên dưới là tất cả các nhóm (category), rồi danh sách giao dịch gần đây kèm tên nhóm, ngày và số tiền. Mọi con số và chi tiết đều nằm trong widget đó.

Trên màn hình, phần "Where it went" chia khoản tháng Chín theo sáu nhóm: Shopping khoảng $4,550 (65.2%), Health khoảng $1,133 (16.2%), Subscriptions khoảng $656 (9.4%), Transport khoảng $389 (5.6%), Food & Dining khoảng $243 (3.5%) và Entertainment $12 (0.2%). Phía trên có dòng nhỏ cho biết tổng chi giảm 82.6% so với tháng trước, và góc phải ghi tháng này có 11 khoản chi. Đây là dữ liệu demo của chính anh trong video ngày 19/09/2026.

5. Thêm chi tiêu bằng một câu nói và bằng ảnh hoá đơn

Muốn thêm một khoản mới, anh chỉ cần nói với AI. Anh gõ: "I just spent 12 on a YouTube subscription today, so can you please add that" (hôm nay tôi vừa tiêu 12 cho gói YouTube, thêm giúp tôi), rồi Enter. AI dùng MCP để thêm khoản đó, và trả lời rằng khoản 12 đô cho YouTube hôm nay đã được thêm vào nhóm Subscriptions.

Tiếp theo là trường hợp bạn vừa mua hàng và có hoá đơn trong tay. Bạn chỉ việc lấy hoá đơn, upload nó lên Claude và hỏi "can you please add this as well". Anh tả cảnh dùng thật: bạn bước ra khỏi siêu thị với tờ hoá đơn, chụp một tấm ảnh, đưa cho Claude và bảo nó làm hết, lưu vào sổ chi tiêu của bạn. Phía sau, nó sẽ phân tích hoá đơn, trích ra toàn bộ thông tin rồi lưu lại.

Claude xác nhận đã thêm 32.12 đô ở FreshWay Market và liệt kê 5 khoản chi trong ngày
Claude xác nhận đã thêm $32.12 ở FreshWay Market vào nhóm Groceries (gồm cả $2.38 thuế); rồi với câu hỏi về giao dịch trong ngày, tool list-transactions trả về widget "5 expenses" của ngày 1/9, tổng $298.85.

Kết quả trên màn hình: đã thêm $32.12 ở FreshWay Market, hôm nay, vào nhóm Groceries. Trên màn hình Claude còn ghi thêm rằng nó xếp cả hoá đơn vào Groceries dù nước rửa chén và dầu gội thật ra là đồ gia dụng, và đề nghị tách thành hai khoản nếu người dùng muốn. Cuối cùng anh hỏi "can you please list all the transactions for today?" (liệt kê giúp tất cả giao dịch hôm nay), và nhận về năm khoản chi trong ngày, đủ mọi chi tiết.

Anh hứa sẽ chỉ chính xác cách build một thứ như vậy, hoặc bất cứ thứ gì hợp với nhu cầu riêng của bạn, rồi chuyển sang phần làm thật.

6. Đọc qua prompt dựng Pocket Ledger

Prompt anh dùng trong video để build toàn bộ MCP app nằm trong một Google Doc tên "MCP Prompt". Kế hoạch của anh là one-shot cả app bằng Fable 5 hoặc Opus 5, tức cho model làm một lượt là xong. Vì thế anh viết một prompt khá công phu và chi tiết. Đoạn mở đầu, như hiện trên màn hình:

You are building a production-quality MCP App called PocketLedger, a personal expense tracker that users can connect to ChatGPT, Claude, and other MCP-compatible clients.

IMPORTANT: Before writing implementation code, read and follow the CURRENT versions of these resources. Do not rely on deprecated MCP or mcp-use APIs:

- https://manufact.com/prompt.md
- https://docs.mcp-use.com/v2/typescript/getting-started/welcome
- https://docs.mcp-use.com/v2/typescript/getting-started/quickstart
- https://github.com/mcp-use/mcp-use
- https://github.com/mcp-use/mcp-oauth-supabase-template

Use mcp-use v2 and TypeScript.

Tức là: bạn đang build một MCP App chất lượng production tên PocketLedger, một app theo dõi chi tiêu cá nhân mà người dùng có thể kết nối vào ChatGPT, Claude và các client tương thích MCP khác. Anh đã thêm vào prompt mấy đường link tới các trang tài liệu, và yêu cầu AI đọc bản HIỆN TẠI của chúng trước khi viết code, không dựa vào API cũ đã bị bỏ.

Sau đó prompt nêu rõ mục tiêu (Objective): build một MCP App cho phép người dùng đã đăng nhập quản lý chi tiêu cá nhân từ các AI client như ChatGPT và Claude. Danh sách việc người dùng phải làm được:

Google Doc MCP Prompt, phần Objective với chín khả năng và Step 1 Scaffold correctly
Phần Objective của prompt: chín việc người dùng làm được, câu "The final application will be deployed on Manufact Cloud from GitHub." và "Do NOT deploy it yet. Build and test the project locally first.", rồi bắt đầu Step 1 (Scaffold correctly).
Build an MCP App that lets authenticated users manage their personal expenses from AI clients such as ChatGPT and Claude.

Users should be able to:

1. Manually add transactions.
2. Upload receipt images.
3. Extract structured receipt information using a vision-capable AI model.
4. Review extracted receipt information before saving it.
5. List/search/filter their transactions.
6. See monthly spending.
7. See category breakdowns.
8. Delete transactions.
9. Interact with visual MCP App interfaces rendered inside compatible AI clients.

The final application will be deployed on Manufact Cloud from GitHub.

Do NOT deploy it yet. Build and test the project locally first.

Anh đọc lướt từng phần: thêm giao dịch thủ công, upload ảnh hoá đơn, trích thông tin có cấu trúc từ hoá đơn bằng một model có khả năng nhìn ảnh (vision), xem lại thông tin đã trích trước khi lưu, rồi liệt kê, tìm kiếm, lọc giao dịch, xem chi tiêu theo tháng, xem phân tích theo nhóm, xoá giao dịch, và tương tác với giao diện MCP App trực quan được render bên trong các AI client tương thích.

Sau phần mục tiêu là hướng dẫn scaffold đúng cách (Step 1: dùng starter MCP Apps hiện tại của mcp-use), thông tin về kiến trúc, cấu hình authentication. Anh định dùng Supabase làm tầng database, authentication và lưu file. Rồi tới cấu trúc database, chẳng hạn phần Database (Step 4) trên màn hình:

For normal transaction CRUD, DO NOT use SUPABASE_SERVICE_ROLE_KEY.

Database calls must execute as the authenticated user wherever possible so that Supabase RLS based on auth.uid() is enforced.

Never expose Supabase service credentials or OpenAI credentials to MCP App Views/browser code.

Create:

supabase/migrations/001_initial_schema.sql

Create a public.transactions table with:

- id: uuid primary key
- user_id: uuid referencing auth.users.id
- merchant: text
- amount: numeric(12,2), must be > 0
- currency: 3-letter currency code, default INR
- category: text
- transaction_date: date
- source: manual | receipt
- receipt_path: nullable text
- notes: nullable text
- metadata: jsonb
- created_at: timestamptz

Tiếp theo là danh sách MCP tool cần có, như add transaction, list transactions, get monthly expenses, cùng với việc mỗi tool phải trả về gì, nhận input hay tham số (argument) gì. Anh nói anh đã viết một prompt rất chi tiết, và sẽ để link Google Doc đó trong phần mô tả video. Anh gợi ý một cách dùng: đưa prompt này cho AI agent của bạn, hoặc bất kỳ công cụ AI coding nào, rồi bảo nó chỉnh prompt cho hợp với thứ bạn muốn build. Làm vậy bạn sẽ có một prompt rất chi tiết cho đúng trường hợp của mình.

7. Dán prompt vào Cursor, bật plan mode và trả lời hai câu hỏi

Bước kế tiếp, anh copy prompt, mở Cursor. Anh đã tạo sẵn một thư mục tên pocketledger, và dán toàn bộ prompt vào đó. Về model, anh định dùng Opus 5, nên chọn Claude Opus 5. Anh nói Fable 5 có lẽ hơi quá tay (overkill) cho việc này, nên chọn Claude Opus 5. Rồi anh bật luôn plan mode: AI sẽ lập plan trước rồi mới implement. Anh bấm nút gửi.

Anh tin rằng một khi đã có plan, Opus 5 gần như one-shot được MCP server. (Lúc đầu anh lỡ nói "Fable 5" rồi sửa lại là Opus 5.) Anh nhắc lại cách chia: mcp-use để build MCP server, Manufact để deploy, còn Supabase lo database, authentication và lưu file. Trên màn hình, agent mở đầu bằng câu sẽ tìm hiểu tài liệu mcp-use hiện tại và kiểm tra môi trường trước khi lập plan, và đang tải trang repo mcp-oauth-supabase-template. Khi plan xong, anh sẽ bảo Cursor build toàn bộ app.

Giữa chừng, Cursor hỏi anh hai câu. Câu thứ nhất: muốn scaffold project ở đâu? Dĩ nhiên là ngay tại thư mục gốc của workspace này, nên anh chọn phương án đầu tiên. Câu thứ hai về các cách đăng nhập (sign-in methods): anh để mặc định, gồm magic link qua email, Google và GitHub, thấy ổn rồi bấm Continue.

Cursor hiển thị plan PocketLedger MCP App với Step 1 Environment + scaffold và Step 2 Data layer
Bên trái là hai câu trả lời của anh (scaffold vào thư mục gốc workspace; magic link qua email cùng nút Google/GitHub), bên phải là plan "PocketLedger MCP App" với Step 1 (Environment + scaffold), Step 2 (Data layer) và Step 3 (Server modules), model Claude Opus 5 1M High.

Theo phần Step 1 của plan trên màn hình, bước dựng môi trường gồm hai lệnh: cài skill mcp-apps-builder của mcp-use cho Cursor, Claude Code và Codex rồi đọc file SKILL.md của skill đó, sau đó tạo app từ template mcp-apps:

npx --yes skills add mcp-use/mcp-use#main --yes --skill mcp-apps-builder -a cursor -a claude-code -a codex
npx -y create-mcp-use-app@latest pocketledger --template mcp-apps

8. Plan 10 việc, build 37 phút và bản xem trước của widget

Plan "PocketLedger MCP App" hoàn thành, và anh lướt qua: có gần như mọi thứ, từ môi trường và scaffold, data layer, các skill cần thêm, cách khởi tạo project mới, template sẽ dùng, tất cả biến môi trường. Có schema, tức những gì phải có trong bảng database, các module phía server, toàn bộ file và cấu trúc thư mục. Có mọi tool như add transaction, list transactions, get monthly expense: mọi tool sẽ thuộc về MCP đều nằm trong plan. Rồi đến luồng xử lý hoá đơn (receipt flow), tức việc phân tích hoá đơn diễn ra thế nào, rồi các view, tất cả biến môi trường cần thêm, và tất cả widget tương tác sẽ được render.

Cursor lập ra 10 việc to-do. Theo anh, làm xong 10 việc đó thì MCP app sẽ sẵn sàng. Anh bấm nút Build và chờ. Việc này mất thời gian, vì AI đang one-shot cả app; anh đoán sẽ mất ít nhất 30 đến 45 phút.

Kết quả: mất khoảng 37 phút, và phiên bản đầu tiên đã xong. Anh còn thấy được bản xem trước (preview) của widget, tức giao diện sẽ hiện ra khi bắt đầu dùng MCP server. Có hai ảnh chụp màn hình: theo anh, Cursor đã tự chạy thử, cho trích thông tin từ một ảnh hoá đơn và chụp lại kết quả.

Widget Check the details của PocketLedger với các trường đã đọc từ hoá đơn
Ảnh preview widget mà Cursor tự chụp khi kiểm thử: "Check the details", độ tin cậy 91%, merchant Whole Foods Market, $84.12 USD, ngày 28/08/2026, nhóm Groceries, ghi chú "Weekly grocery run", và hai nút Discard / Add expense.

Còn vài việc phải làm tay. Thứ nhất là thêm một số biến môi trường. Thứ hai là tạo một project Supabase, chạy migration và cấu hình một loạt thiết lập authentication.

9. File .env và project Supabase

Trong project có file .env.example chứa tất cả biến môi trường. Anh tạo một file .env mới, copy toàn bộ nội dung từ file mẫu dán vào, rồi thay vài giá trị.

Đầu tiên là project ID của Supabase. Anh vào Supabase và đăng nhập; ai chưa có tài khoản thì đăng ký, và theo video ngày 19/09/2026 Supabase cũng có gói miễn phí. Sau khi vào, anh tạo một project mới, đặt tên pocketledger. Tới ô mật khẩu database, anh đùa "ai quan tâm đâu", điền đại cho xong. Mọi thứ khác để mặc định, bấm Create new project. Project được tạo xong, anh vào Project Settings, mục General để lấy project ID, copy và thay vào file.

Tiếp theo là publishable key, nằm trong Project Settings, mục API Keys. Ở đó có default publishable key; anh copy và dán vào. Biến site URL của OAuth Supabase cho mcp-use đang là localhost:3000; vì đang test nên giữ nguyên là được. Tiếp đến là OpenAI API key, dùng để phân tích hoá đơn; model nhận diện hoá đơn trong file là gpt-4o-mini. Đơn vị tiền tệ mặc định ổn, MCP URL cũng ổn.

Biến trong .envLấy từ đâu, trong video MCP_USE_OAUTH_SUPABASE_PROJECT_IDSupabase, Project Settings, General MCP_USE_OAUTH_SUPABASE_PUBLISHABLE_KEYSupabase, Project Settings, API Keys MCP_USE_OAUTH_SUPABASE_SITE_URLlocalhost:3000 khi test, sau đổi sang domain OPENAI_API_KEYtrang API keys của OpenAI, tạo secret key mới RECEIPT_MODELgpt-4o-mini, giữ nguyên DEFAULT_CURRENCYgiữ nguyên MCP_URLlocalhost:3000 khi test, sau đổi sang domain
Hình 9.1Các biến môi trường mà Cursor liệt kê trong mục "What you must do manually" và nơi anh lấy từng giá trị.

Để lấy OpenAI API key, anh vào trang platform của OpenAI, đăng nhập, bấm mục API keys và tạo một secret key mới, đặt cho nó một cái tên ngẫu nhiên, bấm Create key rồi copy. Quay lại file, anh thay key vào và lưu. Thế là tất cả biến môi trường đã được thêm.

10. Chạy migration và chỉnh phần authentication

Việc tiếp theo là chạy file SQL, tức chạy migration trên Supabase. Cursor đã viết sẵn file migration, nên chỉ cần copy nội dung và chạy trong SQL editor. File nằm trong thư mục supabase, phần migrations; bên trong là SQL thô. Anh copy, quay lại Supabase, mở SQL Editor, dán vào và bấm Run. Kết quả báo thành công, không có dòng nào trả về (Success. No rows returned).

Vào Table Editor, anh thấy bảng mới được tạo, đủ mọi cột. Vào Storage, anh thấy storage bucket dành cho hoá đơn (receipts). Phần này xong.

SQL Editordán migration,Run Kiểm trabảng transactions,bucket receipts Sign-inchỉ bật Email,bỏ magic link Confirm emailtắt, để testbằng email bất kỳ OAuth Serverbật cả haicông tắc bước quan trọng nhất theo anh: OAuth Server phải được bật
Hình 10.1Thứ tự các bước anh làm trong Supabase sau khi có file migration.

Kế đến là một loạt thiết lập liên quan tới authentication. Theo hướng dẫn, ở trang cài đặt authentication anh phải bật Google và GitHub, thêm callback URL này, và bật OAuth server. Nhưng có một điểm: lúc này app đang dùng magic link cùng Google và GitHub, còn anh chỉ muốn đăng nhập đơn giản bằng email và mật khẩu, tạm thời không làm Google và GitHub. Vậy nên anh viết một prompt bảo AI sửa lại cho đúng ý, và AI làm xong các thay đổi đó.

Sau đó anh vào Sign In / Providers. Đầu tiên anh tắt tuỳ chọn Confirm email. Tạm thời chỉ có Email là được bật. Nếu bạn muốn thêm Google, GitHub hay bất kỳ lựa chọn nào khác, các lựa chọn đều có ở đây: bấm vào, bật lên, điền client ID và client secret là xong. Nhưng có một việc rất quan trọng bắt buộc phải làm: bấm vào phần OAuth Server settings và đảm bảo nó được bật, cả hai công tắc đều bật. Anh đã bật sẵn từ trước nên phần này ổn. Đến đây anh tin là đã đủ để chạy thử.

11. npm run dev, MCP Inspector và bảy tool

Anh khởi động dev server bằng lệnh:

npm run dev

Màn hình báo đang kết nối tới MCP, rồi MCP Inspector của mcp-use mở ra. Ý tưởng ở đây là bạn có thể test MCP mà chưa cần thêm nó vào ChatGPT hay Claude. Trong ô chọn server, server đã được chọn sẵn, nhưng trước hết anh phải xác thực (authenticate).

Anh bấm nút Authenticate, và được đưa tới trang đăng nhập "Sign in to PocketLedger". Vì đã tắt xác nhận email, anh có thể điền đại một email và mật khẩu bất kỳ. Nhưng trước hết anh phải tạo tài khoản mới. Tạo xong, anh bấm Authorize, và giờ đã được cấp quyền. Lúc này anh thấy toàn bộ tool.

MCP của anh có bảy tool khác nhau: add transaction, list transactions, get monthly expenses, get category breakdown, delete transaction, create receipt upload, và upload receipt. Bấm vào một tool sẽ thấy chi tiết của nó. Chẳng hạn với add transaction, bạn phải nhập merchant, số tiền, đơn vị tiền, nhóm, ngày giao dịch và các trường khác.

Giao diện Inspector có một cột bên trái gồm Server Metadata, Chat, Tools, Prompts, Resources, Skills, Sampling và Elicitation; mục Tools ghi số 7, mục Resources ghi số 4. Thanh trên cùng hiện tên server pocketledger, địa chỉ localhost:3000/mcp, nút Start Tunnel, cùng hai nút Add to Client và Deploy. Mỗi tool trong danh sách kèm một dòng mô tả và số tham số: add-transaction có 8 tham số ("Record one expense in the user's ledger"), list-transactions có 5 (tìm các khoản đã ghi, mới nhất trước, lọc theo khoảng ngày), get-monthly-expenses có 3 (tóm tắt một tháng: tổng chi và so với tháng trước), get-category-breakdown có 2, delete-transaction có 1 (xoá vĩnh viễn một khoản cùng ảnh hoá đơn nếu có), và create-receipt-upload có 2 (tạo một URL dùng một lần để upload ảnh hoá đơn thẳng vào storage riêng).

MCP Inspector của mcp-use chạy tool add-transaction và nhận về JSON giao dịch Google 12 USD
MCP Inspector với bảy tool ở cột trái; tool add-transaction vừa chạy cho ngày 2026-09-01, phản hồi JSON ghi merchant "Google", amount 12, nhóm "Subscriptions", và thông điệp "Saved USD 12.00 at Google on 2026-09-01 under Subscriptions."

Anh điền thử một giao dịch mẫu: một khoản Google 12 đô, nhóm Subscriptions, ngày 2026-09-01. Bấm Execute, màn hình báo đang chạy, và có vẻ đã chạy xong: phản hồi trả về đầy đủ, có cả ID. Anh mở Table Editor của Supabase, vào bảng transactions và thấy ngay dòng vừa thêm. Như vậy xác thực đã chạy, và khoản Google mẫu mà anh vừa nhập thật sự được ghi vào database. Nó đang hoạt động.

12. Chat thử trong Inspector: thêm, liệt kê, xoá và quét hoá đơn

Inspector còn có mục Chat. Anh chuyển sang đó, gõ "hi", và được báo phải cấu hình API key. Anh copy key, dán vào, chọn model (trên màn hình là gpt-5.6-luna) rồi bấm Save Configuration.

Anh gõ: "So I just booked a movie ticket and it costed me $12, please add the same" (tôi vừa đặt một vé xem phim hết 12 đô, thêm giúp). AI hỏi lại merchant và ngày mua; anh trả lời merchant là Book My Show, ngày mua là hôm nay, tức 1 tháng 9 năm 2026. Tool được gọi và khoản chi được thêm. Anh vào bảng transactions, refresh, và thấy khoản 12 đô Book My Show mới thêm.

Tiếp theo anh hỏi "can you please list all the transactions for this month" để xem MCP có liệt kê được hết không. Kết quả hiện ra là một component UI tuỳ biến được render ngay trong chat, liệt kê hai khoản ngày 1/9: Book My Show và Google, mỗi khoản 12 đô. Theo anh, gần như mọi thứ đã chạy, MCP server hoạt động.

Rồi anh thử tool xoá: "Can you please delete that Google transaction, please?". AI báo việc xoá là vĩnh viễn và xin xác nhận; anh trả lời "yes". Tool delete-transaction được gọi, và có vẻ đã xoá. Anh kiểm tra thẳng trong database bằng cách refresh: dòng giao dịch đó đã biến mất.

Bước kế tiếp là gửi một ảnh hoá đơn cho AI. Anh đã mở ChatGPT và cho nó tạo vài ảnh hoá đơn mẫu bằng một prompt. Anh mở một ảnh, tải về, rồi quay lại Inspector để thêm ảnh vào. Trên màn hình ChatGPT là mấy tấm ảnh hoá đơn giả trông như chụp thật, của những cửa hàng như GreenMart Supermarket, Value Basket Mart và Neighborhood Foods, có cả mã QR và dòng cảm ơn ở cuối. Kéo thả không được nên anh chọn file bằng tay, rồi gõ "please add this to my expense".

Lúc này luồng xử lý như sau: MCP sẽ gọi OpenAI. Nhưng hoá ra phải hỏi trước, rồi mới upload file ngay trong giao diện mà widget mở ra. Kéo thả trong giao diện này cũng không chạy, không sao, anh bấm Open và chọn file. MCP gửi ảnh tới model vision của GPT mà app đang dùng, trích toàn bộ nội dung, lấy ra merchant và mọi chi tiết.

Widget quét hoá đơn trong Inspector điền sẵn GreenMart Supermarket 666 INR
Widget quét hoá đơn trong Inspector đã điền sẵn từ ảnh: GreenMart Supermarket, 666.00 INR, ngày 28/08/2026, nhóm Groceries, ghi chú về thực phẩm và đồ chăm sóc cá nhân, cùng nút "Add expense · ₹666.00".

Kết quả: tên merchant GreenMart Supermarket, số tiền, đơn vị tiền, ngày và mọi chi tiết đều được điền sẵn. Anh chỉ cần bấm nút Add expense, và khoản chi được thêm vào sổ. Mở database kiểm tra tay, dòng mới cũng có mặt, đơn vị tiền và các trường khác đều đúng.

Vậy là chỉ thế thôi, anh đã có một MCP server theo dõi tài chính cá nhân, tất cả trong 37 phút, đó là thời gian AI cần để build cả thứ này. Thực tế là Opus 5 đã one-shot cả MCP app; anh chỉ đưa một prompt thật chi tiết ở đầu. Trong Inspector có đủ tool, có mục prompt để bạn nhập vào, có các resource như category breakdown. Anh thử hỏi xin một bản hình ảnh trực quan: "can you please give me like a breakdown of all the transactions that I have within my account?", rồi nghĩ có lẽ nên thêm vài giao dịch giả trước để nó có dữ liệu mà vẽ. Dữ liệu hiện ra. MCP server đã sẵn sàng, gần như mọi thứ đều chạy, và anh đã kiểm tra hết bằng cách dùng thật trong Inspector.

13. Đẩy code lên một repo GitHub private

Việc quan trọng tiếp theo, dĩ nhiên, là đưa code lên GitHub: tạo một repo trên GitHub và push mọi thứ lên, sau đó mới dùng Manufact để deploy. Máy anh đã đăng nhập sẵn GitHub, nên anh bảo AI:

So can you please go ahead and commit and push everything to GitHub? You will have to create a new private repo on GitHub and give it the name "Pocket Ledger", then push everything. And then give me the instructions to deploy it to a Manufact.

Rồi anh tự nhận ra không cần xin hướng dẫn deploy: khi repo đã có, anh chỉ việc đăng nhập dashboard Manufact, kết nối tài khoản GitHub, chọn repo và deploy chỉ trong một cú bấm. Anh chờ AI tạo repo và push.

Project localđã test bằng Inspector Repo GitHub privateAI tạo và push Manufactkết nối GitHub, chọn repo AI commit + push; anh chỉ chọn repo trên dashboard và bấm Deploy
Hình 13.1Đường đi của code sau khi test xong ở máy local.

AI tạo xong một repo private mới và push mọi thứ lên. Repo GitHub đã sẵn sàng.

14. Deploy trên Manufact từ repo GitHub

Bây giờ đến lúc deploy trên Manufact. Anh vào dashboard Manufact; tài khoản chưa có gì, đây là một khởi đầu sạch. Anh bấm New Server. Việc đầu tiên là kết nối tài khoản GitHub: bấm Connect GitHub, trang cấp quyền mở ra, anh chọn tài khoản của mình, cho phép truy cập repo Pocket Ledger, rồi bấm Install & Authorize. Anh còn phải xác thực bằng app một lần nữa và làm nhanh bước đó. Giờ repo đã hiện ra trong danh sách, anh chỉ việc chọn.

Màn hình Configure Deployment của Manufact với build command npm run build, start command npm start, port 3000
Màn hình Configure Deployment của Manufact cho repo Pocket-Ledger nhánh main: build command npm run build, start command npm start, port 3000, Region chọn Auto, và ô Environment Variables có dòng "Paste the .env contents above to autofill".

Build command, start command, port và các thiết lập khác đều ổn. Region anh chọn Auto. Tiếp theo phải điền các biến môi trường. Cursor đã đưa cho anh một danh sách những thứ cần thêm. Anh nghĩ có lẽ chỉ cần mở file .env, copy tất cả rồi dán vào đây, liệu có chạy không? Có, nó chạy. Nhưng MCP URL phải đổi. Phần còn lại như OpenAI API key, publishable key, receipt model đều ổn, chỉ trừ MCP URL, hiện vẫn là localhost:3000. Anh để lát nữa đổi.

Mục Environment Variables có sẵn dòng hướng dẫn dán cả nội dung file .env vào để tự điền; anh làm đúng như vậy, và các cặp key, value được tách ra thành từng dòng. Anh bấm Deploy và chờ. Anh đoán mất vài phút. Màn hình cho thấy các bước sẽ đi qua: Cloning, Analyzing, Building, Deploying, Health Checks và Complete. Kết quả mất khoảng 2 phút 12 giây, và lượt deploy hoàn tất, mọi bước đều xong.

Trong lúc chạy, một bảng bên phải hiện "Deployment #1" ở trạng thái Building trên nhánh main, với hai tab Build Logs và Runtime Logs, các nút Refresh Logs, Download Logs, và nút "Promote to production" ở góc trên. Từng bước Cloning, Analyzing, Building, Deploying, Health Checks, Complete được đánh dấu dần khi xong.

15. Gắn custom domain, sửa biến môi trường và redeploy

Việc đầu tiên sau deploy là đổi biến môi trường, cụ thể là MCP URL. Nhưng trước đó anh muốn chỉ cách gắn custom domain. Lúc này server đang có một URL ngẫu nhiên. Anh cuộn xuống, chọn mục Domains, và nhập domain vào đó.

Mục Domains trên Manufact với ô nhập custom domain
Mục Domains của Manufact: nhập một slug để có subdomain dạng slug.run.mcp-use.com, hoặc nhập domain riêng như mcp.acme.com và làm theo hướng dẫn CNAME; ghi chú bên dưới nói custom domain phải là subdomain, apex domain chưa được hỗ trợ.

Anh đã có sẵn domain astrokjoseph.com, và muốn đặt server dưới một subdomain là mcp.astrokjoseph.com. Anh bấm nút dấu cộng, và phải cấu hình DNS. Việc cần làm chỉ là tạo một record mới: anh bấm Add record, chọn type là CNAME, điền name, rồi lấy giá trị target từ Manufact dán vào, có lẽ tắt proxy đi, và bấm Save. Sau đó phải chờ vài phút cho việc xác minh.

Cấu hình domain đã xong. Giờ cần redeploy, nhưng trước đó phải đổi biến môi trường. Anh copy subdomain, vào mục Environment Variables. MCP URL đang là localhost:3000, anh thay bằng custom domain. Tương tự, site URL của Supabase cũng đổi từ localhost sang custom domain, rồi bấm Save.

Tiếp theo anh quay lại Supabase, vào cài đặt Authentication, phần URL Configuration, đổi localhost:3000 thành mcp.astrokjoseph.com. Ổn rồi. Phần OAuth Server cũng đã được cập nhật. Đó là toàn bộ phần cấu hình anh phải làm.

Anh quay lại mục Domains và bấm redeploy. Lượt deploy này mất hai, ba phút. Khi xong, MCP server sẽ chạy hoàn toàn trên web, cụ thể là trên Manufact, có custom domain, và sẵn sàng để thêm vào ChatGPT hay Claude.

Redeploy hoàn tất và domain đã live. Để chắc chắn mọi thứ chạy, anh bấm Authenticate ngay trên đó, đăng nhập bằng email giả đã chuẩn bị. Anh quên mật khẩu, phải tìm lại một chút, rồi bấm Authorize và đã được xác thực. Vào mục Tools, anh thử thêm một giao dịch mới: mua đôi giày Nike giá 259 đô, đơn vị USD, nhóm Shopping, một ngày bất kỳ, ghi chú "bought sneakers". Bấm Execute, kết quả trả về thành công kèm ID. Quay lại database và refresh, dòng Nike đã có ở đó. MCP server bản deploy đã chạy, giờ có thể thêm nó vào bất kỳ MCP client nào và bắt đầu dùng.

16. Thêm Pocket Ledger vào Claude làm connector và dùng thật

Anh copy URL của server, mở Claude, bấm Customize, vào Connectors, bấm Add để thêm custom connector. Anh dán URL vào, đặt tên Pocket Ledger, bấm Continue. Giờ phải xác thực: bấm Add, rồi nút Connect hiện ra. Anh bấm vào, và được chuyển tới trang cấp quyền, nơi phải bấm Authorize; anh lưu ý trang này chạy dưới chính domain của anh. Bấm Authorize xong, Claude báo đã kết nối với Pocket Ledger, và anh quay lại để dùng.

Anh hỏi: "what all expenses do I have for the month of September" (tháng Chín tôi có những khoản chi nào), rồi Enter. Trên màn hình, Claude lần lượt hiện các bước: cân nhắc có bỏ qua gợi ý connector không, tìm thấy tool (Found tools), tra danh mục connector (Searched connector directory), rồi xin quyền dùng tool get-monthly-expenses của Pocket Ledger với tham số tháng 9, năm 2026; anh bấm Always allow. Kết quả là một bản hình ảnh trực quan đẹp, hiển thị giao dịch của tháng Chín. Nó chạy.

Tiếp theo, anh tải một ảnh hoá đơn mẫu đã tạo từ trước, kéo thả vào chat và gõ "can you please add the following to my expense list", Enter, rồi bấm Always allow. Anh chỉ việc đưa hoá đơn vào chat, và nó tự động thêm khoản chi. Anh kiểm tra trong Supabase, refresh, và dòng mới có ở đó: Value Basket Mart.

Claude liệt kê 5 khoản chi từ Pocket Ledger và cảnh báo cộng lẫn INR với USD
Claude liệt kê năm khoản từ Pocket Ledger (Book My Show, Prime, GreenMart Supermarket, Value Basket Mart, Nike). Bên dưới, trên màn hình Claude tự lưu ý rằng tổng 1,853 USD đang cộng lẫn INR với USD; con số đúng là 371 USD cộng 1,482 INR.

Cuối cùng anh hỏi "can you please list all the expenses from my account". Chỉ như vậy, anh đã tạo một MCP server bằng mcp-use, deploy nó lên Manufact, thêm vào Claude, và gần như mọi thứ đều chạy, mà chỉ trong khoảng một giờ. Thứ duy nhất anh có lúc đầu là một ý tưởng. Trong một giờ, anh đã tạo được toàn bộ MCP server, tạo database, authentication và những thứ liên quan, test nó, deploy, và giờ có một bản chạy thật trên Claude, render được những giao diện đẹp ngay trên màn hình. Theo anh, nó dễ như vậy.

17. Bảng theo dõi trên Manufact và lời kết

Quay lại Manufact, anh chỉ ra rất nhiều lựa chọn khác: xem analytics như có bao nhiêu lượt gọi tool, bao nhiêu lỗi, độ trễ trung bình (average latency). Mục Sessions cho xem chi tiết từng phiên; có cả phần feedback nếu có, các network request, và mục resources để xem lại mọi tool, mọi prompt. Gần như mọi thứ đều quản lý được từ giao diện Manufact.

Trên trang tổng quan (Overview) của server Pocket-Ledger có bốn ô số: Tools 7, Prompts 0, Resources 4 và Gateway Requests (số sự kiện trong 7 ngày qua). Cột Server Information ghi tiêu đề PocketLedger, region AUTO, phiên bản 1.0.0, repository trên GitHub, lượt deploy đang hoạt động và trạng thái kết nối Connected. Mục Feedback ghi rằng có thể thu feedback từ người dùng và agent qua một tool send_feedback do gateway chèn vào, báo cáo hiện ngay trên Manufact mà không đi tới server của bạn; muốn dùng thì bấm Enable.

Ý tưởngPrompt+ planBuild37 phútSupabase+ InspectorDeploy+ domainClaudeChatGPT theo anh: tổng cộng khoảng một giờ, không tự viết dòng code nào
Hình 17.1Toàn bộ quy trình trong video, từ một ý tưởng tới MCP app chạy trong Claude.

Anh tóm lại: trong chưa đầy một giờ, họ đã tạo được một MCP app, deploy nó và đưa nó lên internet. Giờ bất kỳ ai cũng có thể thêm nó chỉ bằng cách dán URL vào Claude, ChatGPT hay bất kỳ MCP client tương thích nào, rồi dùng ngay.

Anh nói sẽ để trong phần mô tả các tài nguyên đã nhắc tới, gồm repo GitHub của mcp-use và prompt, để người xem dùng tạo MCP server của riêng mình. Anh mong video hữu ích, mời người xem bấm đăng ký kênh, và hẹn gặp lại ở video sau.

Nguồn và liên kết 10 nguồn

  1. Tên gốc: How to Build an MCP Server From Scratch in 2026 (Zero Coding)
  2. Sự kiện: YouTube
  3. Video gốc: https://www.youtube.com/watch?v=NjNGFu6lQCA youtube.com
  4. Kênh YouTube Astro K Joseph (Astro K Joseph): youtube.com/channel/UCpWS2Gmt0N31th-vdIizPJQ youtube.com
  5. mcp-use, framework full stack để làm MCP App cho ChatGPT / Claude và MCP server cho AI agent: github.com/mcp-use/mcp-use github.com
  6. Tài liệu mcp-use: docs.mcp-use.com docs.mcp-use.com
  7. Manufact, nơi deploy, test và theo dõi MCP server, do nhóm làm mcp-use phát triển: manufact.com manufact.com
  8. Supabase (database, authentication, storage dùng trong video): supabase.com supabase.com
  9. Cursor: cursor.com cursor.com
  10. Model Context Protocol: modelcontextprotocol.io modelcontextprotocol.io