Tự tay làm ứng dụng chia tiền "Splitup" chỉ với các công cụ AI miễn phí: Bạn cũng làm được!
Lê Lân0
Splitup: Ứng Dụng Chia Tiền Đơn Giản Được Phát Triển Bằng Các Công Cụ AI Miễn Phí
Mở Đầu
Bạn đã bao giờ cảm thấy bực mình khi phải chia tiền nhóm với bạn bè và tìm kiếm một ứng dụng vừa đơn giản, vừa hiệu quả nhưng lại không bị rối rắm? Splitup chính là câu trả lời!
Trong bài viết này, tôi sẽ chia sẻ từng bước phát triển ứng dụng Splitup — một app chia tiền nhóm thiết kế tối giản, giúp bạn dễ dàng chia sẻ chi phí, gửi nhắc nhở và thanh toán nhanh chóng. Đặc biệt, toàn bộ ứng dụng được xây dựng chỉ sử dụng các công cụ AI miễn phí. Qua trải nghiệm thực tế, tôi cũng sẽ bật mí cách tận dụng sức mạnh của AI để đơn giản hóa quá trình lập trình, từ khâu tạo cấu trúc ứng dụng, thiết kế giao diện, đến lập trình backend và debug. Nếu bạn là lập trình viên độc lập hoặc người mới muốn thử sức với AI trong phát triển app, đây sẽ là hướng dẫn chân thực và hữu ích dành cho bạn.
What I Wanted to Build — Mục Tiêu Phát Triển Ứng Dụng
Tôi từng thử qua nhiều ứng dụng chia tiền khác nhau nhưng cảm thấy đa số đều quá phức tạp hoặc rối rắm, không tối ưu cho nhóm nhỏ hoặc dùng hằng ngày. Vì vậy, mục tiêu của Splitup được xác định rõ ràng:
- Chia sẻ chi phí một cách liền mạch, chính xác
- Gửi nhắc nhở tự động đến những người bạn trong nhóm
- Tối giản việc thanh toán và kết sổ dễ dàng, nhanh chóng
Với mục tiêu này, tôi quyết định sử dụng các công cụ AI miễn phí để phát triển ứng dụng, tận dụng điểm mạnh của từng công cụ để đẩy nhanh tiến độ và tối ưu chất lượng sản phẩm.
Step 1: Set Up Your App's Foundation — Thiết Lập Nền Tảng Ứng Dụng
Công Cụ Sử Dụng: Cursor + GitHub Copilot (phiên bản miễn phí)
Cách Tiến Hành
- Dùng Cursor AI để tạo khung sườn dự án Flutter, bao gồm cấu trúc thư mục, routing (điều hướng màn hình) và các đoạn mã mẫu cơ bản.
- Kết hợp GitHub Copilot để hoàn thiện các đoạn code nhỏ lẻ, ví dụ như tạo màn Login với Google và Apple, hoặc tạo Controller quản lý trạng thái bằng Riverpod.
Mẹo
Sử dụng các câu lệnh yêu cầu nhỏ, rõ ràng khi tương tác với AI. Ví dụ:
- "Generate a Login Screen with Google and Apple login buttons"
- "Create a Controller using Riverpod 2.0, separate UI from business logic"
Phân chia app thành từng module để AI dễ dàng xử lý, đồng thời giảm lỗi và tăng tính ổn định.
Step 2: Build a Robust Backend — Xây Dựng Backend Vững Chắc
Công Cụ Sử Dụng: Supabase AI
Cách Tiến Hành
- Supabase hỗ trợ cực tốt cho người mới với các tính năng AI để thiết kế cơ sở dữ liệu.
- Tôi mô tả bằng ngôn ngữ tự nhiên kiểu "a table for expense transactions with foreign key constraints to group table (group_id)" để AI tự động tạo schema phù hợp.
- Tiếp đó, tôi sử dụng AI Supabase để soạn các chính sách bảo mật Row-Level Security (RLS), và tạo webhook nhằm hỗ trợ tính năng cập nhật thời gian thực.
Mẹo
Kiểm thử và chỉnh sửa lại đoạn SQL mà AI tạo ra để đảm bảo chính xác và phù hợp với nghiệp vụ bạn cần.
Nghiên cứu kỹ RLS và webhook nếu muốn backend của app vừa an toàn, vừa linh hoạt.
Step 3: Design a User-Friendly Interface — Thiết Kế Giao Diện Thân Thiện
Công Cụ Sử Dụng: ChatGPT
Cách Tiến Hành
- ChatGPT giúp gợi ý ý tưởng thiết kế UI hiện đại, đơn giản, phù hợp với mục đích app tài chính cá nhân.
- Từ việc đề xuất bảng màu, bố cục màn hình cho đến icon app và phần mô tả trên app store, tôi đều dựa trên những prompt chi tiết gửi cho ChatGPT.
- Hiện tại tôi sẽ sử dụng thêm công cụ Stitch của Google để có giao diện đẹp và chuyên nghiệp hơn trong các dự án sau.
Mẹo
Đặt câu hỏi cụ thể về:
- Tông màu chủ đạo
- Cách bố trí các nút/chức năng
- Phong cách UI (đơn giản, tối ưu trải nghiệm)
Đừng quên tùy chỉnh lại ý tưởng AI cung cấp để phù hợp với bản sắc riêng của ứng dụng.
Step 4: Debugging, Optimizations, and Core App Features — Gỡ Lỗi, Tối Ưu và Logic Cốt Lõi
Công Cụ Sử Dụng: Grok
Cách Tiến Hành
- Sử dụng Grok để phân tích lỗi chi tiết qua logs và nhận đề xuất sửa chữa từng bước.
- Nhờ Grok viết các edge function cho Supabase, xử lý nghiệp vụ phức tạp như logic tính toán công nợ, việc thanh toán cuối cùng.
- Ngoài ra, Grok tư vấn thêm các chiến lược kiếm tiền (monetization) phù hợp cho app.
Mẹo
Khi gặp lỗi hoặc cần tính năng nâng cao:
- Cung cấp cho Grok đoạn mã lỗi hoặc mô tả chi tiết nghiệp vụ
- Yêu cầu giải thích từng bước xử lý
- Tinh chỉnh, thử nghiệm lại mã nhiều lần để đạt hiệu quả tối ưu.
Key Takeaways for Building with AI — Bài Học Kinh Nghiệm Khi Phát Triển Ứng Dụng Bằng AI
- Phân nhỏ công việc: Không thể dựa vào một câu lệnh AI để hoàn thành toàn bộ app, hãy chia nhỏ thành các task cụ thể.
- Rõ ràng trong ý tưởng: Mục tiêu sản phẩm càng rõ ràng, prompt gửi tới AI càng chính xác và kết quả càng sát với yêu cầu.
- Luôn lặp lại chỉnh sửa: Mã và thiết kế do AI tạo ra cần test, sửa đổi liên tục, không thể hoàn hảo ngay lần đầu.
- AI là trợ thủ đắc lực: Việc dùng AI giúp tiết kiệm thời gian, tăng tính sáng tạo và làm việc hiệu quả hơn rất nhiều.
The Result — Kết Quả
Splitup hiện đã chính thức có mặt trên cả App Store và Play Store. Tôi rất hài lòng với thành quả đạt được, chứng minh sức mạnh và tính khả thi của các công cụ AI miễn phí dành cho các nhà phát triển indie như tôi.
Try It Yourself — Tự Thử Với Ý Tưởng Riêng Của Bạn
- Bắt đầu từ một ý tưởng đơn giản
- Chọn một hoặc hai công cụ AI phù hợp với kỹ năng và nhu cầu
- Thử nghiệm, học hỏi và dần hoàn thiện dự án
Bạn đang dùng công cụ AI nào trong phát triển? Bạn định xây ứng dụng gì tiếp theo? Chia sẻ ngay bên dưới để cùng nhau phát triển cộng đồng lập trình viên sáng tạo!
Tham Khảo
- Supabase Documentation – https://supabase.com/docs
- GitHub Copilot – https://github.com/features/copilot
- Cursor AI – https://cursor.so
- ChatGPT (OpenAI) – https://chat.openai.com
- Grok AI – https://grok.openai.com
- Stitch by Google – https://stitch.withgoogle.com
June 5, 2024
1
100%
Loading...