강의

멘토링

로드맵

NEW
Applied AI

/

Utilize AI

Tạo bảng tin với Vibe Coding + Đăng ký thành viên và Đăng nhập (React + FastAPI)

Tạo hệ thống đăng ký đăng nhập + bảng tin bằng React với Vibe Coding (React + FastAPI) là khóa học thực hành giúp bạn hoàn thành ứng dụng web fullstack bằng cách sử dụng AI prompt. OpenAI Codex và Claude Code Trong khóa học này, chúng ta sẽ kết nối frontend React(Typescript) với backend FastAPI để triển khai: Chức năng đăng ký & đăng nhập CRUD bảng tin (tạo, xem, sửa, xóa) Xác thực JWT và xử lý quyền hạn trong một dự án duy nhất. Đặc biệt, không chỉ dừng lại ở việc viết code, 👉 Tạo code bằng AI prompt → Chạy và sửa đổi → Test → Mở rộng thông qua phương pháp học "Vibe Coding", bạn sẽ trải nghiệm quy trình phát triển mới cùng với AI. Sau khi hoàn thành khóa học, bạn có thể tự tay hoàn thiện "dịch vụ bảng tin thành viên của riêng mình", và thậm chí có thể thử thách với các tính năng mở rộng như bình luận, thích, upload hình ảnh.

2 học viên đang tham gia khóa học này

  • Kyung-il In
바이브코딩
Reactjs
FastAPI
풀스택
인공지능
React
Node.js
TypeScript
AI

Dịch cái này sang tiếng Việt

  • Trải nghiệm phát triển dựa trên AI

  • Frontend (React + TypeScript)

  • Backend (FastAPI)

  • Phát triển CRUD với Vibe Coding

Tạo đăng ký đăng nhập thành viên + bảng tin bằng React với Vibe Coding (React + FastAPI)

Vibe Coding: Tạo Fullstack Đăng ký/Đăng nhập + Bảng tin với React + FastAPI

  • Khóa học này là một khóa học dựa trên dự án thực hiện frontend (React)backend (FastAPI) cùng nhau để xây dựng chức năng đăng ký/đăng nhập thành viênchức năng CRUD bảng tin được sử dụng nhiều nhất trong các dịch vụ thực tế.

Chúng ta sẽ học những nội dung như thế này

  1. Thiết lập môi trường phát triển

    • Node.js, Python, VS Code, GitHub và các công cụ cơ bản khác - cài đặt và sử dụng

    • Kinh nghiệm môi trường phát triển dựa trên Linux(WSL)

  2. Quy trình phát triển dựa trên AI

    • Cách sử dụng OpenAI Codex CLI

    • Cách sử dụng Claude Code

    • Viết prompt → Tự động tạo code → Sửa lỗi & cải thiện

  3. Frontend(React)

    • Tạo giao diện bảng tin (danh sách, viết bài, sửa/xóa)

    • Cấu trúc màn hình đăng ký/đăng nhập


  4. Backend (FastAPI)

    • Triển khai API CRUD cho bảng tin

    • Đăng ký/Đăng nhập API + Xác thực/Phân quyền JWT

    • Xử lý quyền hạn (chỉ sửa/xóa bài viết của chính mình)

  5. Tích hợp dự án

    • React Frontend ↔ FastAPI Backend Tích hợp

    • Hoàn thành toàn bộ luồng dịch vụ (đăng ký thành viên → đăng nhập → viết bài → sửa/xóa)

    • Kinh nghiệm xây dựng dịch vụ web fullstack thực tế


🎯 Kết quả học tập

  • Hoàn thành dịch vụ web fullstack của riêng tôi

  • Nắm vững năng lực sử dụng công cụ phát triển AI

  • Kinh nghiệm tích hợp React + FastAPI

  • Triển khai trực tiếp logic cốt lõi của dịch vụ web quản lý thành viên + CRUD bảng tin


👉 Nói một cách đơn giản, khóa học này cung cấp trải nghiệm "tạo ra một dịch vụ web cho phép đăng nhập vào dịch vụ do mình tạo ra, viết bài và quản lý nội dung"hoàn thiện fullstack bằng cách sử dụng các công cụ AI.

Người tạo ra khóa học này

Xin chào, tôi là Kyung-il In.

  • Hoàn thành chương trình Trường Kinh doanh KAIST

  • Thạc sĩ Đại học Quốc dân

  • Tiến sĩ Đại học Hanyang (đang học)

  • Phân tích dữ liệu lớn sử dụng trí tuệ nhân tạo

  • Phát triển engine chatbot AI và hệ thống chatbot

  • Phát triển hệ thống và máy chủ Android POS

    Lĩnh vực nghiên cứu

  • Nghiên cứu về cải thiện độ tin cậy của tài liệu điện tử sử dụng blockchain và hệ thống tệp phân tán

  • Nghiên cứu về hình thành và tạo ra giá trị dữ liệu sử dụng hệ thống blockchain

  • Nghiên cứu về ứng dụng công nghiệp hệ thống chatbot trí tuệ nhân tạo và việc sử dụng RPA

  • Nghiên cứu về hệ thống chatbot đối thoại đa miền

Những lưu ý trước khi học

Môi trường thực hành

  • CPU: Intel i5 (4 lõi trở lên) hoặc AMD Ryzen 5 trở lên

  • Bộ nhớ (RAM): 8GB trở lên (nếu chỉ thực hành thì 4GB cũng được, tuy nhiên sẽ có hiện tượng chậm)

  • Ổ đĩa: Dung lượng trống từ 10GB trở lên (bao gồm lưu trữ module Node, môi trường ảo Python, file DB)

  • Card đồ họa (GPU): Không bắt buộc (phát triển web phụ thuộc vào hiệu năng CPU)

Tài liệu học tập - Cách cung cấp liên kết Notion

  • Trang giới thiệu khóa học: Tổng quan khóa học, chương trình giảng dạy, chuẩn bị trước khi học

  • Tài liệu hướng dẫn thực hành: Phương pháp cài đặt, thiết lập môi trường phát triển, tổng hợp lệnh

  • Mã ví dụ/Ảnh chụp màn hình: Có thể kiểm tra ngay các ví dụ xuất hiện trong bài giảng

  • Tài liệu học tập bổ sung: Tổng hợp liên kết tài liệu chính thức, blog, video tham khảo

Kiến thức tiên quyết và lưu ý

  • Kiến thức cơ bản về phát triển web

  • Kiến thức tiên quyết được khuyến nghị

    • Bạn có thể tham gia khóa học ngay cả khi mới tiếp xúc với React lần đầu, nhưng nếu biết về khái niệm component thì tốc độ hiểu bài sẽ nhanh hơn.

    • Nếu bạn đã biết cú pháp cơ bản của Python thì việc học FastAPI sẽ dễ dàng hơn.

👉 Độ khó: Sơ cấp ~ Trung cấp
👉 Phù hợp với những người đã từng tiếp xúc với phát triển web dù chỉ một chút, hơn là những người hoàn toàn mới bắt đầu học lập trình.

Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Người mới bắt đầu học phát triển web lần đầu

  • Nhà phát triển Frontend/Backend muốn thử thách bản thân với phát triển Fullstack

  • Người học quan tâm đến phương pháp phát triển dựa trên AI (Vibe Coding)

  • Người học cần ý tưởng dự án toy project

  • Những người tìm kiếm các bài giảng ngắn gọn, tập trung vào thực hành

Cần biết trước khi bắt đầu?

  • CHAT GPT

  • React.js

  • FastAPI

Xin chào
Đây là

1,044

Học viên

29

Đánh giá

21

Trả lời

4.9

Xếp hạng

3

Các khóa học

열공

Chương trình giảng dạy

Tất cả

20 bài giảng ∙ (1giờ 44phút)

Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Chưa có đủ đánh giá.
Hãy trở thành tác giả của một đánh giá giúp mọi người!

Ưu đãi có thời hạn

35.750 ₫

35%

1.167.708 ₫

Khóa học khác của Kyung-il In

Hãy khám phá các khóa học khác của giảng viên!

Khóa học tương tự

Khám phá các khóa học khác trong cùng lĩnh vực!