HƯỚNG DẪN CHI TIẾT DỰ ÁN FPTU CAREERRISE AI
VIBE CODING VÀ NỘP BÀI THAM GIA AI RISER VIETNAM 2026

Tác giả dự án: Nguyễn Minh Triết

Đơn vị tổ chức: GDGoC FPT University Ho Chi Minh City

Nền tảng thực thi: Google AI Studio (Build Mode) & Google Cloud Run

Tech Stack: React (TypeScript) + TailwindCSS + Google Gemini 3.6 Flash

Đối tượng: Sinh viên mọi ngành nghề (Non-Tech & Tech)

1 / 19

🗺️ Lộ Trình 4 Bước Hoàn Thành Dự Án (Roadmap)

  • Bước 1: Chuẩn bị Môi trường (2 phút)
    • Đăng nhập Google AI Studio bằng Gmail cá nhân.
    • Mở tính năng + New app (Build Mode) & Lấy Gemini API Key.
  • Bước 2: Cấu hình Bộ não AI (3 phút)
    • Nạp System Instruction quy định vai trò Chuyên gia HR FPTU.
  • Bước 3: Dựng Giao diện Web App (5 phút)
    • Dán Master Prompt React TSX để AI dựng giao diện hoàn chỉnh.
  • Bước 4: Publish & Nộp bài (5 phút)
    • Bấm Publish xuất bản Web App lên Cloud Run (Lấy trọn 10đ Bonus).
    • Quay Video Demo YouTube & Đăng bài LinkedIn.
2 / 19

BƯỚC 1 Chuẩn Bị Tài Khoản & Môi Trường AI Studio

  • 1. Lưu ý quan trọng về Tài khoản Google:
    • Bắt buộc dùng Gmail cá nhân (@gmail.com) để kích hoạt gói miễn phí Starter Tier (Tự động cấp Google Cloud Run mà không cần Thẻ tín dụng).
    • Cảnh báo: Không dùng Email trường (@fpt.edu.vn) vì sẽ bị khóa tính năng Cloud Run do chính sách doanh nghiệp.
  • 2. Thao tác trên giao diện Google AI Studio:
    • Truy cập aistudio.google.com.
    • Nhìn thanh menu bên trái (Mục BUILD), bấm vào nút + New app (hoặc nút Start building).
    • Bấm biểu tượng 🔑 (Góc dưới bên trái) → Chọn Create API Key → Lưu lại chìa khóa này.
3 / 19

BƯỚC 2 Cấu Hình Bộ Não AI (System Instruction)

  • Mục đích: Huấn luyện Gemini đóng vai trò Chuyên gia Tuyển dụng dành riêng cho sinh viên FPTU.
  • Thao tác:
    • Nhìn sang cột Run settings (bên phải màn hình).
    • Dán toàn bộ đoạn văn bản bên cạnh vào ô System instructions.
Bạn là FPTU CareerRise AI — Chuyên gia Tuyển dụng và Trợ lý Hướng nghiệp dành cho sinh viên FPT University. Nhiệm vụ: Khi nhận được CV (file PDF/hình ảnh) và Mô tả công việc (JD): 1. Match Score (%): Đánh giá độ phù hợp của CV với JD trên thang điểm 100%. 2. Phân tích chi tiết: - ✅ 3 Điểm mạnh: Kỹ năng/kinh nghiệm nổi bật phù hợp với JD. - ⚠️ 3 Điểm thiếu (Skill Gap): Kỹ năng còn thiếu trong CV mà JD yêu cầu. - 💡 Lời khuyên sửa CV: Gợi ý cách viết lại 2-3 câu trong CV để chuẩn ATS. 3. Luyện phỏng vấn: Đưa ra câu hỏi phỏng vấn đầu tiên liên quan trực tiếp đến CV và JD theo phương pháp STAR để sinh viên bắt đầu luyện tập. Giọng văn: Thân thiện, chuyên nghiệp, mang tính động viên sinh viên FPTU.
4 / 19

BƯỚC 3.1 Cấu Trúc Đạt Chuẩn Của Master Prompt (Spec-Driven)

  • Khái niệm Spec-Driven Master Prompt: Một bản mô tả đặc tả toàn bộ kiến trúc giao diện Web (React TSX, TailwindCSS, Icons, SDK API) bằng ngôn ngữ tự nhiên.
  • Bố cục 4 Phần Bắt Buộc Trong Master Prompt Chuẩn:
    • Phần 1 - Thư viện Imports: Định nghĩa React, TailwindCSS, Icon set (`lucide-react`) và SDK chính thức `@google/genai`.
    • Phần 2 - State Management (`useState`): Quản lý API Key, File CV (Base64/MIME), Text JD, trạng thái Spinner loading, thông báo lỗi.
    • Phần 3 - Layout & Styling: Header thiết kế chuẩn Google/FPTU màu cam nổi bật, bo góc rounded-2xl.
    • Phần 4 - Logic Flow & Handler: Gọi `client.models.generateContent` model `gemini-3.6-flash`, đóng gói `types.Part.fromBytes` và render Markdown kết quả.
5 / 19

BƯỚC 3.2 Master Prompt React TSX & Hướng Dẫn Dán Lệnh

Bạn là một Chuyên gia Lập trình React (TypeScript) và UI/UX Designer cấp cao. Hãy giúp tôi tạo toàn bộ mã nguồn cho ứng dụng Web "FPTU CareerRise AI" trong file App.tsx bằng React, TailwindCSS, thư viện icon lucide-react và SDK chính thức @google/genai của Google. Mã nguồn phải đạt chuẩn Production, hoàn chỉnh 100%, KHÔNG chứa mã giả (pseudo-code), KHÔNG cắt ngắn hay để lại nhận xét TODO. --- THÔNG TIN CẤU TRÚC VÀ GIAO DIỆN HỆ THỐNG --- 1. Imports: React, { useState }, lucide-react (Rocket, FileText, Target, Key, Upload, AlertCircle, CheckCircle2, Sparkles, Copy, Check), { genai, types } từ @google/genai. 2. State: apiKey, jdText, file, fileBase64, fileMimeType, loading, warning, error, success, analysisResult, copied. 3. Header: Khung max-w-2xl mx-auto, Card trắng rounded-2xl, icon Rocket màu cam, Title "🚀 FPTU CareerRise AI", Caption "Trợ lý Hướng nghiệp & Luyện Phỏng vấn 360° | Built with Google Gemini 3.6 Flash". 4. Logic Flow: - Bước 1: Ô input password "🔑 Nhập Gemini API Key của bạn:". Hiện Banner sky-50 "💡 Bạn cần nhập Gemini API Key để bắt đầu sử dụng app." nếu chưa nhập key. - Bước 2: Form Upload file CV (.pdf,.png,.jpg) đọc FileReader dạng Base64 + Textarea "🎯 Dán Mô tả công việc (JD)". Nút "🔥 Phân tích CV & Bắt đầu" (Màu cam, hiện Spinner khi loading). - Bước 3: Hàm handleAnalyze khởi tạo new genai.Client({ apiKey }), nạp System Instruction tuyển dụng FPTU, đóng gói file CV dạng types.Part.fromBytes và gọi client.models.generateContent model 'gemini-3.6-flash'. - Bước 4: Hiển thị kết quả Markdown trong Card trắng kèm nút Copy kết quả.
  • 📍 Hướng Dẫn Vị Trí Dán Master Prompt:
    • 1. Bấm nút + New app ở thanh Menu bên trái (Mục BUILD).
    • 2. Màn hình mở giao diện Build Mode với khung chat bên dưới chứa gợi ý "Make changes, add new features...".
    • 3. Copy toàn bộ ô bên trái → Dán vào khung chat này → Bấm Enter.
    • 4. AI Studio tự động tạo file App.tsx và hiển thị Live Preview bên phải!
6 / 19

KẾT QUẢ 1 Giao Diện Khởi Tạo & Kiểm Tra API Key

  • Đặc điểm Giao diện Khởi tạo:
    • Title chính màu sắc nổi bật: 🚀 FPTU CareerRise AI.
    • Ô nhập password bảo mật API Key kèm link lấy key miễn phí tại aistudio.google.com.
    • Banner thông báo thông minh: Nền xanh Sky mượt mà nhắc nhở "💡 Bạn cần nhập Gemini API Key để bắt đầu sử dụng app." khi user chưa nhập key.
🚀 FPTU CareerRise AI [Live Preview State 1]
🚀 FPTU CareerRise AI
Trợ lý Hướng nghiệp & Luyện Phỏng vấn 360° | Built with Google Gemini 3.6 Flash
Lấy API Key miễn phí tại aistudio.google.com ↗
💡 Bạn cần nhập Gemini API Key để bắt đầu sử dụng app.
7 / 19

KẾT QUẢ 2 Form Upload CV & Dán Mô Tả Công Việc (JD)

  • Tính năng Form Nhập Liệu:
    • Khu vực Upload CV: Khung nét đứt xanh ngọc, tự động xác nhận file đã sẵn sàng (Ví dụ: CV_TrietNguyen_AI_Engineer.pdf - 0.10 MB).
    • Khung nhập JD FPT: Ô Textarea dán Mô tả công việc chi tiết.
    • Nút bấm Phân tích: Nút bấm màu cam nổi bật 🔥 Phân tích CV & Bắt đầu.
📄 Form Tải CV & Dán JD [Sẵn sàng]
✓ CV_TrietNguyen_AI_Engineer.pdf
0.10 MB • Sẵn sàng phân tích
Hợp tác với đồng nghiệp là các chuyên gia IT và phòng ban khác trong công ty... Bảo mật thông tin dữ liệu khách hàng với các biện pháp mã hóa...
8 / 19

KẾT QUẢ 3 Kết Quả Match Score & Đánh Giá Tổng Quan

  • Đầu Ra Trực Quan Từ Gemini 3.6 Flash:
    • Banner thông báo xanh lá ✓ Phân tích hoàn tất!.
    • Nút Sao chép nhanh kết quả ở góc phải.
    • Chấm điểm Match Score: Đạt 55% so với vị trí Chuyên viên IT Support.
    • Nhận xét cá nhân hóa: Chào đích danh ("Chào Triết!"), phân tích lý do điểm ở mức trung bình do sự lệch hướng giữa AI Engineer và IT Helpdesk.
📊 Kết quả Phân tích 360° [Match Score: 55%]
✓ Phân tích hoàn tất!

Chào Triết! Mình là FPTU CareerRise AI — Trợ lý Tuyển dụng sinh viên FPTU.

1. Match Score: 55%

Đánh giá chung: CV của Triết thể hiện bạn là một Machine Learning Engineer xuất sắc. Tuy nhiên, JD này lại thiên về IT Helpdesk, Quản trị Hạ tầng IT Nội bộ...

9 / 19

KẾT QUẢ 4 PHÂN TÍCH 3 ĐIỂM MẠNH & 3 ĐIỂM THIẾU (SKILL GAP)

  • Phân Tích Chi Tiết Chuẩn ATS:
    • ✅ 3 Điểm Mạnh: Khai thác kinh nghiệm làm TA tại VinUni (hỗ trợ Lab cho 300 sinh viên), năng lực Hạ tầng GCP/Docker và GDG Chapter Lead.
    • ⚠️ 3 Điểm Thiếu (Skill Gaps): Chỉ ra thiếu sót về Phần cứng/Thiết bị Văn phòng (PC, Router), Bảo mật dữ liệu và Quy trình IT Service.
✅ 3 Điểm mạnh (Strengths phù hợp với JD):
  • VinUni TA Support: Hỗ trợ Lab Observability xử lý sự cố cho 300 sinh viên.
  • Hạ tầng Cloud (GCP, Docker, CI/CD): Nền tảng phần mềm vững chắc.
  • GDG Chapter Lead: Khả năng hợp tác liên phòng ban & đào tạo.
⚠️ 3 Điểm thiếu (Skill Gaps so với JD):
  • Thiết bị Văn phòng: Chưa đề cập lắp đặt PC, Laptop, Printer, Router.
  • An ninh Mạng Nội bộ: Thiếu tư duy Security trong hệ thống IT.
  • Helpdesk Management: Thiếu từ khóa quy trình ITIL, SLA hỗ trợ người dùng.
10 / 19

KẾT QUẢ 5 Phòng Phỏng Vấn Giả Lập Theo Phương Pháp STAR

  • Luyện Phỏng Vấn Tương Tác 360°:
    • Đặt câu hỏi phỏng vấn tình huống sát thực tế CV: "Em hãy kể lại một sự cố hệ thống phức tạp nhất tại VinUni mà em đã phân tích và giải quyết...".
    • Khung Gợi Ý Trả Lời STAR: Hướng dẫn chia rõ 4 phần S (Situation), T (Task), A (Action) và R (Result).
    • Mời gọi user gõ câu trả lời trực tiếp bên dưới để AI chỉnh sửa.
🎯 Phòng Phỏng Vấn STAR [Interactive Practice]
🎯 Câu hỏi phỏng vấn:
"Trong CV, em có ghi nhận kinh nghiệm hỗ trợ kỹ thuật cho hơn 300 sinh viên tại VinUni. Em hãy kể lại một sự cố hệ thống phức tạp nhất mà em từng gặp? Em đã phân tích, giải quyết ra sao..."
💡 Gợi ý trả lời theo cấu trúc STAR:
S (Situation): Bối cảnh sự cố hệ thống.
T (Task): Mục tiêu khẩn cấp cần phục hồi.
A (Action): Các bước xử lý Root Cause Analysis.
R (Result): Kết quả hệ thống hoạt động ổn định trở lại.
11 / 19

BƯỚC 4.1 Bắt Đầu Quy Trình Publish (Popup Mới)

  • Khởi Động Popup Xuất Bản:
    • Nhìn lên thanh công cụ trên cùng, bấm nút • Publish.
    • AI Studio mở cửa sổ Popup: "What does publishing look like?".
    • 2 Đặc tính cốt lõi từ Google:
      • 🔒 Chat history & code will stay private: Bảo mật mã nguồn và lịch sử chat.
      • 🔗 Your app will be accessible via a public URL: Ứng dụng sẽ sẵn sàng truy cập qua một đường link công khai.
    • Bấm nút Get started để tiếp tục.
What does publishing look like?
Your app
🌐
🔒 Chat history & code will stay private
🔗 Your app will be accessible via a public URL
12 / 19

BƯỚC 4.2 Điền Thông Tin & Cấu Hình Đường Dẫn URL

  • Cấu Hình Thông Tin Ứng Dụng:
    • Title: Nhập FPTU CareerRise AI.
    • Description: Nhập Trợ lý Hướng nghiệp & Luyện Phỏng vấn 360° dành cho sinh viên FPT University.
    • App URL: Nhập định danh URL (Ví dụ: fptu-careerrise-ai). Hiện chữ xanh Disponible (Khả dụng).
    • Chính sách đi kèm: Starter Tier Additional Terms of Service.
    • Bấm nút Publish your app để kích hoạt.
Publish your app ⓘ
F
FPTU CareerRise AI
fptu-careerrise-ai-1001756470594.asia-southeast1.run.app
FPTU CareerRise AI
Trợ lý Hướng nghiệp & Luyện Phỏng vấn 360° dành cho sinh viên FPT University
Trợ lý Hướng nghiệp & Luyện Phỏng vấn 360° dành cho sinh viên FPT University
fptu-careerrise-ai .ai.studio
Disponible
13 / 19

BƯỚC 4.3 Màn Hình Đóng Gói & Tiến Trình Deploy

  • Tiến Trình Đóng Gói Tự Động (2 phút):
    • Màn hình hiện icon 🚀 Tên lửa kèm dòng chữ "Publishing your app".
    • Các bước xử lý ngầm trên Google Infrastructure:
      • ✔ Gathering your app details (Thu thập thông số hệ thống).
      • ⏳ Preparing your Google Cloud Project (Khởi tạo Cloud Project).
    • Sinh viên chỉ cần giữ nguyên màn hình, không tắt trình duyệt!
Publish your app ⓘ
Publishing your app
Gathering your app details
Preparing your Google Cloud Project
14 / 19

BƯỚC 4.4 Màn Hình Xuất Bản Thành Công & Quản Lý Link

  • Thông Số Xuất Bản Thành Công:
    • Thông báo: FPTU CareerRise AI is published!.
    • Trạng thái: ● Status: Ready.
    • App URL chính thức:
      https://fptu-careerrise-ai.ai.studio (hoặc đường link Google Cloud Run `.run.app`).
    • 2 Thao tác quan trọng:
      • 🌐 Visit: Mở ngay Web App công khai trên tab mới.
      • 🔄 Republish: Cập nhật khi có thay đổi code mới.
F
FPTU CareerRise AI is published!
There are unpublished changes. Click republish to update the app.
🌐 Visit
🔄 Republish
Status
● Ready
Last published
1 august 2026, 21:19:13
App URL
Gemini API
API Key ...cURQ
👁️ 📋
Advanced settings
Unpublish app
15 / 19

KẾT QUẢ TỐI THƯỢNG Trải Nghiệm Web App Trên Internet

  • Trải Nghiệm Public Web App:
    • Đường dẫn truy cập trực tiếp: fptu-careerrise-ai.ai.studio.
    • Cấu trúc giao diện Web chuẩn Production:
      • Header: Đính kèm nhãn FPTU EDITION và Badge Gemini 3.6 Flash.
      • Alert Banner: Xác nhận "Đã hoàn tất phân tích CV & khởi tạo lộ trình...".
      • Bộ 3 Chỉ số ATS: Match Score (52%), Technical Grade (B), ATS Readiness (Medium).
      • Báo cáo AI & Nút thao tác: Nút Tải báo cáo và Sao chép tiện lợi.
🌐 https://fptu-careerrise-ai.ai.studio FPTU EDITION
🚀
FPTU CareerRise AI FPTU EDITION
Trợ lý Hướng nghiệp & Luyện Phỏng vấn 360° dành cho sinh viên FPT University
✨ Built with Google Gemini 3.6 Flash
✓ Đã hoàn tất phân tích CV & khởi tạo lộ trình luyện phỏng vấn!
🚀 PHÂN TÍCH CV & BẮT ĐẦU PHỎNG VẤN
● KẾT QUẢ PHÂN TÍCH & BÁO CÁO FPTU AI
🎯 ĐÁNH GIÁ MỨC ĐỘ PHÙ HỢP
MATCH SCORE
52% / 100%
TECHNICAL GRADE
B
Xếp hạng kỹ năng chuyên môn
ATS READINESS
Medium
Độ tương thích bộ lọc HR
💬 Nhận xét tổng quan từ FPTU AI:

Chào Triết! CV của bạn rất ấn tượng với nền tảng AI/ML, kinh nghiệm Google Cloud và khả năng lãnh đạo cộng đồng tại FPTU. Tuy nhiên, JD này hướng tới vị trí Data Analyst chuyên sâu về phân tích vận hành hệ thống trạm sạc EV/IoT và yêu cầu 3–5 năm kinh nghiệm cùng công cụ Power BI/Tableau. Bạn có thể nhấn mạnh hơn vào tư duy xử lý dữ liệu BigQuery, SQL và ETL để gia tăng cơ hội nhé!

16 / 19

🔥 Chiến Lược Bứt Phá Top 50 Hạng Vàng (Real Traction)

  • Quy định từ Ban Tổ Chức: "Các hồ sơ có lượng tương tác người dùng thực tế tích cực sẽ có lợi thế lớn khi xét Hạng Vàng (Top 50) và Hạng Bạch Kim (Top 10)."
  • Chiến thuật 3 bước tích lũy người dùng thực tế trước khi nộp bài:
    • Bước A (Gửi bài nhóm): Chia sẻ đường link .ai.studio / .run.app vừa tạo vào các nhóm Zalo/Facebook lớp học, nhờ 10 - 20 bạn học cùng tải CV vào test thử.
    • Bước B (Thu thập bằng chứng): Chụp lại màn hình số lượt sử dụng, feedback phản hồi tích cực từ bạn bè hoặc bảng ghi nhận trải nghiệm.
    • Bước C (Đính kèm Form): Tải các hình ảnh bằng chứng này lên Google Drive và dán link vào ô bằng chứng thực tế trong Form hoàn thành bài nộp.
17 / 19

📋 Checklist Hoàn Thiện & Nộp Bài AI Riser Vietnam 2026

  • Bộ 4 Hạng Mục Cần Điền Vào Form Nộp Bài:
    • [x] AI Studio Link: Copy link dự án.
      • Bấm Share
      • Chọn Public: Anyone with the link can view
      • Chọn Include your Gemini chat history
      • Copy Link
    • [x] App Link: Link dạng https://...ai.studio hoặc .run.app.
    • [x] A Demo Video (< 2 phút): Quay màn hình thao tác.
    • [x] LinkedIn Post: Đăng Video kèm cảm nghĩ + Hashtag: #AIRiserVietnam #BuildWithGoogleAI #GDGoCFPTUHCMC.

🏆 Tương ứng Hạng Giải Thưởng:

    🥉 Hạng Đồng: Nộp đủ Link + Video + LinkedIn (Chứng nhận Online).

    🥈 Hạng Bạc (Top 500): Đạt Hạng Đồng + 10đ Bonus Cloud Run (Swag Kit Bạc).

    🥇 Hạng Vàng (Top 50): Đạt Hạng Bạc + Bằng chứng Real Traction (Swag Kit Vàng + Mentoring).

    🏆 Hạng Bạch Kim (Top 10): Đạt Hạng Vàng + Xuất Sắc Nhất (Swag Kit Platium + Cup vinh danh).

18 / 19

CẢM ƠN CÁC BẠN ĐÃ XEM!

Chúc các bạn tạo được project của chính mình!

📌 Link tham khảo:

• Link to Google AI Studio: https://ai.studio/apps/b074d642-3df0-4af2-924c-eff613858339

• Link Web app: https://fptu-careerrise-ai.ai.studio/

🤝 Link hỗ trợ (GDGoC FPTU HCMC):

• Link Facebook: https://www.facebook.com/gdg.fptu.hcmc/

• Link Discord: https://discord.gg/dh4RS5Cud6

🤝 Link Author (TRIET NGUYEN MINH):

• Link LinkedIn: https://www.linkedin.com/in/minh-triet-nguyen-sonny/

19 / 19