[Renewal] Tạo ứng dụng bản đồ quán ăn ngon (React Native & NestJS)

Bạn sẽ được học quy trình phát triển và phát hành ứng dụng ghi chép quán ăn ngon của riêng mình bằng cách sử dụng React Native. Tôi đã chuẩn bị toàn bộ quá trình từ thiết kế đến phát triển Front-end, Back-end và triển khai.

(4.9) 101 đánh giá

1,470 học viên

Độ khó Trung cấp trở lên

Thời gian Không giới hạn

React Native
React Native
TypeScript
TypeScript
NestJS
NestJS
react-query
react-query
zustand
zustand
React Native
React Native
TypeScript
TypeScript
NestJS
NestJS
react-query
react-query
zustand
zustand

Đánh giá từ những học viên đầu tiên

4.9

5.0

Ryan Kim

82% đã tham gia

Tôi đã học khoảng ba bài giảng RN từ nhiều giảng viên khác nhau, nhưng tôi cảm thấy bài giảng của giảng viên Kyo là hay nhất. (Tôi là nhà phát triển back-end nên tôi không tham gia khóa học này về phía máy chủ NestJS.) 1. Xây dựng dự án trải nghiệm nhiều yêu cầu khác nhau Bạn có thể theo dõi dự án từ đầu đến cuối và sử dụng nhiều yêu cầu, thành phần và thư viện thực tế khác nhau, vì vậy ngay cả khi chỉ tham gia khóa học này, bạn sẽ có thể có đủ thông tin để tạo ứng dụng mà bạn muốn. Đây là khóa học cho phép bạn phát triển một ứng dụng không giống như một dự án đồ chơi và có các chức năng phức tạp và đa dạng ở mức độ có thể phục vụ được trên thực tế. (Chất lượng bài giảng tổng thể ở mức tương đối và tuyệt đối cao trong số các bài giảng RN tôi đã nghe) 2. Kỹ năng giải thích của người hướng dẫn rất xuất sắc. Tôi nghĩ rằng biết, giỏi một thứ gì đó và có thể dạy nó cho ai đó là hai khả năng riêng biệt. Điều tôi cảm nhận được khi tham gia khóa học là người hướng dẫn Kyo không chỉ có trình độ cao về RN mà còn có khả năng giải thích cho người khác một cách dễ hiểu. Nhờ đó tôi đã có thể hoàn thành bài giảng một cách dễ dàng. 3. Môi trường lớp học dễ chịu (4K) Thông thường, các bài giảng khác được tải lên ở định dạng 1K, nhưng bài giảng này được quay ở định dạng 4K, vì vậy tôi có thể tham gia bài giảng trong khi cảm thấy như mắt mình đang được thanh lọc. Xem xét không chỉ nội dung khóa học mà còn cả môi trường tham gia các khóa học này, tôi nghĩ rằng chất lượng tổng thể của khóa học chắc chắn sẽ tốt. Những điều tôi đặc biệt thích - Chất lượng video bài giảng (4K) - Nội dung bài giảng bổ sung (sửa đổi thư viện trực tiếp, tối ưu hóa hình ảnh, v.v.) - Cấp độ ứng dụng được phát triển cùng nhau trong lớp (các ứng dụng phản ánh các yêu cầu phức tạp và thực tế ở cấp độ sản phẩm) Phải mất một thời gian dài vì tôi đã dành thời gian để nghe nó sau giờ làm việc, nhưng đó thực sự là một bài giảng thú vị và hữu ích. Cảm ơn! Nếu bạn tổ chức một khóa học RN khác với chủ đề khó hơn, tôi chắc chắn sẽ tham gia khóa học đó!

5.0

HyeJung

100% đã tham gia

Tôi đã có rất nhiều câu hỏi khi nghe bài giảng, và tôi rất biết ơn vì bạn đã trả lời tất cả!! Tôi rất vui vì đã đến nghe bài giảng của React Native và hiểu được nhiều điều hơn. Mỗi lần xem qua bài giảng, tôi đều nghe với vẻ ngưỡng mộ. Tôi luôn để lại lời cảm ơn trong câu hỏi, nhưng bây giờ tôi' tôi để nó trong phần ôn tập bài giảng. Tôi còn thiếu kiến ​​thức về TypeScript, nhưng khi nghe bài giảng, tôi cảm thấy như những kiến ​​thức còn thiếu của mình đã được lấp đầy từng chút một!! Vì tôi đã học TypeScript nên tôi sẽ nghe lại bài giảng này. Cảm ơn bạn một lần nữa!

5.0

호갱

39% đã tham gia

Tôi muốn thêm lời khen ngợi sau khi nghe tất cả các bài giảng, nhưng Tôi không thể cưỡng lại và để lại một đánh giá. Next.js có thực sự đơn giản không? Tôi đã tạo một trang web. (Tôi chỉ biết cú pháp phản ứng cơ bản.) Tôi đang làm nhà phát triển back-end (spring, c#), vì vậy tôi cũng quan tâm đến giao diện người dùng. Tôi cũng đã tham gia một bài giảng về phản ứng. Tôi nghĩ đây là lần đầu tiên tôi được nghe một bài giảng chất lượng cao như vậy. Có vẻ như chất lượng nguồn đủ tốt để có thể áp dụng vào thực tế ngay. (Tôi nghĩ đây là lợi thế lớn nhất.) Có nhiều bài giảng mà bạn phải quay lại cấp độ tiếp theo. Đó là một bài giảng có rất nhiều điều để học hỏi. Tôi thực sự đã trở thành một người hâm mộ. Vì vậy, tôi đã hoàn thành bài giảng hiện tại và muốn học thêm các bài giảng khác. Tính đến thời điểm hiện tại, bài giảng duy nhất có sẵn là bài giảng hiện tại. Bạn có kế hoạch bài giảng nào trong tương lai không? Tôi cũng muốn hỏi liệu bạn có quan tâm đến việc tạo ra một bài giảng tiếp theo không.

Bạn sẽ nhận được điều này sau khi học.

  • React Native

  • React Query

  • Zustand

  • TypeScript

  • Nest.js

  • TypeORM

[Trung cấp] Tạo ứng dụng bản đồ quán ăn ngon với React Native & NestJS

Thông báo cập nhật khóa học

Đây là bài giảng đã hoàn tất việc làm mới vào ngày 24 tháng 8 năm 2025.

Giới thiệu khóa học

Hãy tạo dịch vụ bản đồ quán ăn của riêng bạn bằng cách sử dụng công nghệ mới nhất! Tôi đã chuẩn bị toàn bộ quá trình từ phát triển Front-end và Back-end, thiết kế cho đến triển khai. Chúng ta sẽ phát triển ứng dụng dựa trên hệ thống thiết kế được xây dựng bằng Figma.

Chúng tôi sẽ chia sẻ nhiều bí quyết khác nhau, từ việc phát triển ứng dụng bằng React Native cho đến khi phát hành trên cả App Store và Play Store. Về stack công nghệ, chúng tôi sử dụng React Native, TypeScript, NestJS, react-query, zustand.

Bạn sẽ phát triển cả Front-end/Back-end để hoàn thiện một dịch vụ từ đầu đến cuối.
Thời lượng bài giảng bao gồm 12 giờ Front-end + 3 giờ Back-end, và cung cấp mã nguồn cho tất cả các buổi học.

Đây là khóa học trung cấp sử dụng React Native CLI. Vui lòng lưu ý điều này trước khi đăng ký khóa học. Để phát triển bằng Expo, vui lòng tham khảo các khóa học bên dưới!

Nội dung bao gồm

  • React Navigation


  • TypeScript

  • Tanstack Query (React Query)

  • Zustand

  • Quản lý trạng thái máy chủ & trạng thái toàn cục

  • Xác thực dựa trên JWT

  • Đăng nhập Kakao / Đăng nhập Apple


  • Phát triển các thành phần (component) dùng chung

  • Mô hình Compound Component

  • Mẫu Custom Hook

  • Suspense, ErrorBoundary

  • Triển khai ứng dụng

  • Liên kết Google Maps API, Kakao Maps API

  • Hiển thị dấu mốc và gom cụm

  • Cuộn vô hạn


  • Triển khai lịch


  • Chế độ tối

  • Tải lên hình ảnh

  • Xử lý quyền ứng dụng

  • Xử lý hàm ngày tháng

  • Chỉnh sửa thư viện

  • WebView


  • NestJS & TypeORM

  • PostgreSQL

📚 Ngôn ngữ và công nghệ trong khóa học

Phần Frontend dựa trên React Native(CLI), TypeScript và tích cực sử dụng TanStack Query(React Query), đồng thời sử dụng Zustand làm công cụ quản lý trạng thái toàn cục. Phần Backend được phát triển bằng bộ công nghệ NestJS, TypeORM, PostgresQL. Ngoài ra, dự án còn kết hợp phát triển với nhiều API khác nhau như Google API, Kakao API.

⭐ Các tính năng chính được triển khai

Đăng ký/Đăng nhập/Đăng nhập mạng xã hội

Tích hợp Bản đồ/Vị trí

Cuộn vô hạn/Yêu thích

Tìm kiếm/Đăng ký địa điểm

Tính năng lịch

Cài đặt và Chế độ tối

⚠ Vui lòng kiểm tra lộ trình học tập để biết chi tiết triển khai cụ thể!

💫 Điểm khác biệt của bài giảng này

1. Phát triển đồng thời Android và iOS

Phát triển đồng thời trên cả hai nền tảng, xây dựng các thành phần dùng chung (common components) có khả năng tái sử dụng cho nhiều nền tảng và màn hình khác nhau. Tôi cũng sẽ hướng dẫn bạn về sự khác biệt giữa các nền tảng và cách xử lý tương ứng.

2. Thiết kế Component & Custom Hook

Thay vì chỉ triển khai đơn thuần hay sử dụng thư viện, chúng ta sẽ học cách phát triển có tính đến khả năng tái sử dụng và tính linh hoạt, chẳng hạn như mẫu thành phần hỗn hợp (Compound Component Pattern) và mẫu Hook tùy chỉnh (Custom Hook Pattern).

3. Phát triển dựa trên thiết kế Figma

Cung cấp hệ thống thiết kế được xây dựng bằng Figma và thiết kế cho tất cả các màn hình, giúp bạn dễ dàng kiểm tra xem cần triển khai thành phần (component) hay màn hình nào.

4. Tối thiểu hóa việc sử dụng thư viện

Tối thiểu hóa việc sử dụng thư viện và trực tiếp triển khai hầu hết các tính năng để nâng cao khả năng lập trình và kỹ năng giải quyết vấn đề. Bạn sẽ trực tiếp xây dựng khoảng 20 custom hooks, 40 components và các hàm tiện ích (util functions) khác nhau.

5. Cung cấp mã nguồn

Chúng tôi cung cấp không chỉ mã nguồn backend đã hoàn thiện mà còn cả mã nguồn cho tất cả các buổi học từ khi bắt đầu đến khi kết thúc dự án. Ngoài ra, chúng tôi cũng cung cấp các tài liệu cần thiết để phát triển và hiểu rõ dịch vụ như blog, bài viết, v.v.

Kiến thức tiên quyết cần thiết

Đây là bài giảng có độ khó sử dụng CLI dành cho trình độ trung cấp trở lên (nâng cao tính chuyên môn). Nó có thể không phù hợp với người mới bắt đầu hoặc trình độ sơ cấp. Vui lòng lưu ý điều này trước khi đăng ký khóa học. (Để phát triển bằng Expo, vui lòng tham khảo bài giảng Tạo ứng dụng cộng đồng Avatar.).)

  • Cần có kiến thức về JavaScript/CSS. Các cú pháp ES6 như map, filter sẽ không được giải thích.

  • Kiến thức về React là cần thiết. Khóa học sẽ không giải thích về state, props và các Hooks cơ bản (useState, useEffect).


Lưu ý

  • Khóa học sẽ được tiến hành bằng ReactNative CLI. Không sử dụng Expo.

  • Môi trường phát triển của bài giảng là Mac OS. (Người dùng Windows chỉ có thể phát triển Android. Để phát triển ứng dụng iOS, cần có môi trường Mac.)

  • Khóa học này được sản xuất với độ phân giải 3840 × 2160 (4K), vì vậy bạn có thể học với chất lượng hình ảnh tốt hơn nếu chọn độ phân giải cao.


* Đây là bài giảng đã hoàn tất việc làm mới vào ngày 24 tháng 8 năm 2025.

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

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

  • Những người muốn ra mắt ứng dụng của riêng mình

  • Những người đã từng học qua cơ bản về JavaScript/React

  • Những ai muốn sở hữu một danh mục hồ sơ năng lực (portfolio) đặc biệt được vận hành thực tế.

  • Những người muốn tạo ra một ứng dụng với độ hoàn thiện cao.

  • Những người muốn phát triển cả front-end và back-end bằng JavaScript

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

  • Cần có kiến thức về React.

  • Cần có kiến thức về JavaScript/CSS.

  • Sẽ rất tốt nếu bạn có kinh nghiệm về Node.js và Express. (Khi phát triển backend)

Xin chào
Đây là Kyo

2,279

Học viên

187

Đánh giá

351

Trả lời

4.9

Xếp hạng

4

Các khóa học

Tôi bắt đầu với vai trò là nhà phát triển Frontend cho dịch vụ cộng đồng và hiện đang làm việc với tư cách là nhà phát triển Full-stack cho nền tảng thương mại điện tử.

Tại Inflearn, tôi đang thực hiện các bài giảng nhằm tạo ra những sản phẩm có độ hoàn thiện cao.

 

  • inkyo.dev@gmail.com

Thêm

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

Tất cả

119 bài giảng ∙ (14giờ 59phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

101 đánh giá

4.9

101 đánh giá

  • kms920106님의 프로필 이미지
    kms920106

    Đánh giá 24

    Đánh giá trung bình 4.6

    5

    99% đã tham gia

    가장 친한 친구에게 소개팅을 정말 괜찮은 사람으로 소개해준다면 가장 친한 친구에게 RN은 무조건 이 강의를 소개시켜주고싶네요 장점 1) 질문하면 AI보다 더 빠르게 답변해주신다 2) 강의 챕터마다 깃헙에 올라와 있어서 참고하기가 너무 편하다 3) 목소리가 나긋하다....(살짝 성시경이라고 해야되나..ㄷㄷ) 4) 리팩토링 과정도 포함되어 있다

    • koy
      Giảng viên

      Bạn đã đăng nhiều câu hỏi/chia sẻ trong cộng đồng và cảm ơn bạn đã viết đánh giá về khóa học 🙂 Thật vui khi bạn muốn giới thiệu bài giảng này👍👍 Nếu bạn có bất kỳ vấn đề nào trong tương lai, vui lòng cho tôi biết bất cứ lúc nào!!

  • swi81387993님의 프로필 이미지
    swi81387993

    Đánh giá 2

    Đánh giá trung bình 5.0

    5

    24% đã tham gia

    Tôi là một người bình thường chỉ học JAVA, JS, CSS như một sở thích. Từ trước đến nay, tôi đã có ước mơ "muốn tự tay tạo ra một ứng dụng!", nhưng vì không chuyên nên tôi đã không dễ dàng thử sức, mãi đến bây giờ tôi mới có cơ hội. Tôi bắt đầu quan tâm đến React Native, vì nó có thể phát triển ứng dụng đa nền tảng, nên sau khi tự học những kiến thức cơ bản về React, tôi đã tham gia khóa học của Kyo. Kết quả là, tôi nghĩ rằng mình đã thực sự làm rất tốt khi tham gia khóa học này! Lúc đầu, nó không hề dễ dàng vì đây là một khóa học trung cấp, nhưng trong quá trình học, có rất nhiều khoảnh khắc tôi tự hỏi "Ồ, cũng có chức năng này sao?", và tôi đã có thể học cách sử dụng những thứ mà tôi chỉ biết khái niệm một cách thực tế, điều đó thực sự rất hữu ích. Đặc biệt, tôi rất vui vì đã học được cách sử dụng các chức năng mà tôi đã biết một cách hiệu quả hơn, và tôi cảm thấy mình ngày càng quen thuộc hơn khi ôn tập và làm theo. Nhờ đó, tôi đã có thêm tự tin vào React Native, và giờ đây tôi có kỳ vọng lớn rằng mình có thể tự tạo ra ứng dụng của riêng mình! Ngay cả một người không chuyên như tôi cũng đã thử sức sau khi nắm vững những kiến thức cơ bản về React, vì vậy tôi nghĩ rằng những người khác cũng có thể theo kịp. Cảm ơn bạn vì một bài giảng hay! 😊 Cố lên! 🚀

    • koy
      Giảng viên

      Cảm ơn bạn vì những đánh giá tốt về khóa học!

  • lody님의 프로필 이미지
    lody

    Đánh giá 1

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    12% đã tham gia

    Trước đây tôi chuyên phát triển ứng dụng native, nhưng lần này tôi muốn học chuyên sâu về RN nên đã tham gia khóa học này. Thực ra, lúc đầu tôi cũng lo lắng "Nghe nói bao gồm cả client lẫn server, liệu có tốn thời gian mà không hiệu quả không?". Nhưng không ngờ nội dung được cấu trúc bài bản hơn tôi nghĩ rất nhiều, và tôi học được rất nhiều kiến thức hữu ích trong mỗi buổi học. Điều tôi thích nhất là có thể nắm bắt toàn bộ quy trình dịch vụ một cách tổng quan. Từ việc thiết kế bằng Figma, xây dựng giao diện bằng React Native, đến việc kết nối với backend NestJS đều được trình bày từng bước một, nên tôi luôn nhận ra "À, nó kết nối như thế này đây" trong mọi khoảnh khắc. Tôi cũng thích việc khóa học đề cập đến cả việc triển khai trên AWS. React Native tuy còn xa lạ với tôi, nhưng tôi vẫn hào hứng theo dõi vì khóa học đề cập đến nhiều tính năng thực tế, có thể áp dụng được ngay chứ không chỉ ở mức độ ví dụ. Khóa học cũng chỉ ra chi tiết những điểm đặc biệt mà chỉ gặp phải trong RN, nên tôi, người đã từng phát triển native, cũng có thể dễ dàng vượt qua. Tôi đang rất hài lòng với khóa học này và đã bắt đầu tò mò về các khóa học khác như "Xây dựng ứng dụng cộng đồng Avatar". Tôi thực sự khuyên dùng khóa học này cho những ai muốn tạo ra một ứng dụng di động thực thụ! Tôi đã có thể theo kịp nội dung bài giảng một cách đầy đủ mà không cần đặt câu hỏi nào. Mong rằng trong tương lai sẽ có nhiều khóa học chất lượng như thế này nữa. Cảm ơn!

    • koy
      Giảng viên

      Cảm ơn bạn vì những đánh giá tốt!

  • sysryan09027861님의 프로필 이미지
    sysryan09027861

    Đánh giá 1

    Đánh giá trung bình 5.0

    5

    82% đã tham gia

    Tôi đã học khoảng ba bài giảng RN từ nhiều giảng viên khác nhau, nhưng tôi cảm thấy bài giảng của giảng viên Kyo là hay nhất. (Tôi là nhà phát triển back-end nên tôi không tham gia khóa học này về phía máy chủ NestJS.) 1. Xây dựng dự án trải nghiệm nhiều yêu cầu khác nhau Bạn có thể theo dõi dự án từ đầu đến cuối và sử dụng nhiều yêu cầu, thành phần và thư viện thực tế khác nhau, vì vậy ngay cả khi chỉ tham gia khóa học này, bạn sẽ có thể có đủ thông tin để tạo ứng dụng mà bạn muốn. Đây là khóa học cho phép bạn phát triển một ứng dụng không giống như một dự án đồ chơi và có các chức năng phức tạp và đa dạng ở mức độ có thể phục vụ được trên thực tế. (Chất lượng bài giảng tổng thể ở mức tương đối và tuyệt đối cao trong số các bài giảng RN tôi đã nghe) 2. Kỹ năng giải thích của người hướng dẫn rất xuất sắc. Tôi nghĩ rằng biết, giỏi một thứ gì đó và có thể dạy nó cho ai đó là hai khả năng riêng biệt. Điều tôi cảm nhận được khi tham gia khóa học là người hướng dẫn Kyo không chỉ có trình độ cao về RN mà còn có khả năng giải thích cho người khác một cách dễ hiểu. Nhờ đó tôi đã có thể hoàn thành bài giảng một cách dễ dàng. 3. Môi trường lớp học dễ chịu (4K) Thông thường, các bài giảng khác được tải lên ở định dạng 1K, nhưng bài giảng này được quay ở định dạng 4K, vì vậy tôi có thể tham gia bài giảng trong khi cảm thấy như mắt mình đang được thanh lọc. Xem xét không chỉ nội dung khóa học mà còn cả môi trường tham gia các khóa học này, tôi nghĩ rằng chất lượng tổng thể của khóa học chắc chắn sẽ tốt. Những điều tôi đặc biệt thích - Chất lượng video bài giảng (4K) - Nội dung bài giảng bổ sung (sửa đổi thư viện trực tiếp, tối ưu hóa hình ảnh, v.v.) - Cấp độ ứng dụng được phát triển cùng nhau trong lớp (các ứng dụng phản ánh các yêu cầu phức tạp và thực tế ở cấp độ sản phẩm) Phải mất một thời gian dài vì tôi đã dành thời gian để nghe nó sau giờ làm việc, nhưng đó thực sự là một bài giảng thú vị và hữu ích. Cảm ơn! Nếu bạn tổ chức một khóa học RN khác với chủ đề khó hơn, tôi chắc chắn sẽ tham gia khóa học đó!

    • koy
      Giảng viên

      Trong bài giảng này, mục tiêu là tạo ra một ứng dụng hoàn chỉnh có thể phục vụ được chứ không phải là một dự án đơn giản như bạn đã nói. Mặc dù thời gian giảng dài hơn nhưng tôi rất vui vì bạn đã thích thú với bài giảng. Cảm ơn bạn đã để lại đánh giá rất chi tiết :)

  • dlwhdans987791님의 프로필 이미지
    dlwhdans987791

    Đánh giá 1

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    100% đã tham gia

    Thật tuyệt khi được xây dựng một ứng dụng bằng React Native từ đầu đến cuối. Tôi đã có kinh nghiệm cả về front-end và back-end, và việc hoàn thành cả quá trình triển khai thực tế đã đủ để tôi rèn luyện kỹ năng thực chiến. Sử dụng các công nghệ mới nhất như React Query, Zustand, NestJS, TypeORM cũng giúp ích cho việc học về bộ kỹ năng công nghệ, và các tính năng thực tế như đăng nhập Kakao/Apple, API bản đồ, cuộn vô hạn cũng được đề cập đầy đủ. Code được tổ chức tốt và giải thích rõ ràng nên rất dễ theo dõi. Việc được tự tay thực hiện toàn bộ quá trình từ phát triển đến xuất bản lên App Store/Play Store khiến tôi nghĩ đây là một khóa học có độ hoàn thiện cao.

    • koy
      Giảng viên

      Bạn đã học hết tất cả các bài rồi! Cảm ơn vì đã nhận xét khóa học có chất lượng tốt.

Khóa học khác của Kyo

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!