飞豹客 · 课能看,资料也能带走
飞豹客前端开发 会员免费

使用 Flutter、Firebase 和 GetX 构建一个 OLX 克隆应用

如果你已经会用 Flutter 画页面,但一到「数据从哪来、用户怎么登录、状态怎么管」就卡住,这套资料值得花时间。它围绕一个二手交易类应用展开,把 Flutter 界面、Firebase 后端和 GetX 状态管理三件事绑在同一个项目里做完,而不是分开讲三个孤立的知识点。 它解决的是「拼不起来」的问

单课价¥30.90新品 上架
会员价 会员免费开通会员后本篇可直接下载套餐详情
231 人关注 更新于 2026-03-25 永久有效
发货

网盘链接 · 支付成功后自动发货

保障

永久有效 · 链接失效免费补发

客服

每日 9:00-21:00 在线客服 联系客服

会员可免费下载本篇月会员、年会员、永久会员可按日额度下载(每篇扣 1 次)。

开通会员 ›
购买本课销量 0 · 永久有效
会员价 · 单课标价 ¥30.90

会员 A · 按档位折扣

永久免费可下
年免费可下
月免费可下
周免费可下

会员 B

VIP¥6.18低至
SVIP单买¥200 内可领

游客按标价购买,不享受上表折扣。

支付成功后自动发放网盘链接,链接失效可找客服免费补

正版保障 极速发货 售后无忧

如果你已经会用 Flutter 画页面,但一到「数据从哪来、用户怎么登录、状态怎么管」就卡住,这套资料值得花时间。它围绕一个二手交易类应用展开,把 Flutter 界面、Firebase 后端和 GetX 状态管理三件事绑在同一个项目里做完,而不是分开讲三个孤立的知识点。

它解决的是「拼不起来」的问题

很多人学 Flutter 的困境不是不会写 Widget,而是不知道一个真实应用该怎么组织。这套内容把常见环节都走了一遍:Google 账号登录、首页商品流、推荐位与精选位、商品详情与我的商品、个人资料编辑、聊天列表与对话、退出登录。你会在里面看到路由跳转怎么配合状态管理、登录态怎么影响页面显示、列表数据怎么从后端取回再渲染。这些都是自己闷头写 demo 时最容易含糊过去的地方。

GetX 在这里承担的是粘合剂角色。资料开头单独有一段 GetX 的集中讲解,把控制器、依赖注入、路由和响应式更新先过一遍,后面每个业务页面再反复用到。如果你之前只用过 setState,这段是必须按顺序看的,跳过它后面的代码会看不懂为什么这么写。

适合什么基础,先看哪几块

前提是你能独立写出带跳转的多页面 Flutter 应用,懂 Dart 的基本语法和异步写法。完全零基础不建议直接上手,会一直在查语法。Firebase 部分不需要提前掌握,跟着做即可,但要能接受在控制台里配置项目和开启对应服务。

建议的观看顺序是:先看 GetX 那段集中讲解,建立状态管理和路由的基本概念;接着看导航与 Google 登录,把用户体系跑通;然后进入首页界面与商品展示,理解数据如何驱动列表;最后再看个人资料、我的商品和聊天相关部分。聊天和退出登录放在后面,是因为它们依赖前面已经建立好的登录态和用户数据结构。

学完能独立做什么,资料怎么用

跟完之后,你应该能独立搭出一个具备账号登录、商品浏览、商品发布管理、一对一聊天的多页面应用骨架,并且知道每一层该放在哪里、状态该由谁持有。这个能力可以直接迁移到分类信息、二手交易、社区集市这类产品上。

练习方式上,不建议只看不写。每看完一个模块,先自己按记忆实现一遍,再回头对照资料里的写法,重点比较状态定义的位置和页面刷新的触发点。商品展示和我的商品这两块可以自己换一套数据结构重做,聊天部分可以试着加已读状态。改动过程中遇到的报错,才是真正让你记住这套组合怎么用的部分。

课程目录

课程目录76 集
  • 📁 使用 Flutter、Firebase 和 GetX 构建一个 OLX 克隆应用  📁 12. Edit profile  📁 7. Displaying featured products  📁 4. Navigation  📁 1. Getx Crash Course  📁 11. Profile screen  📁 15. Chat contacts section  📁 16. Sign out functionality  📁 14. Chats functionality  📁 9. View products screen  📁 8. Displaying recommended products  📁 3. Authentication with Google Sign-in  📁 6. Homescreen UI  📁 10. My products screen  📁 5. Sell Products Screen  📁 2. Project and Firebase Setup  📁 13. Search products    📄 2. Getting featured products from firebase--.en.srt    📄 2. Getting featured products from firebase--.mp4
  •    📄 1. Getx home controller--.en.srt    📄 1. Getx home controller--.mp4
  •    📄 3. Showing them in UI--.en_CN.srt    📄 1. Getx home controller--.en_CN.srt    📄 2. Getting featured products from firebase--.en_merged.srt    📄 3. Showing them in UI--.mp4
  •    📄 3. Showing them in UI--.en.srt    📄 3. Showing them in UI--.en_merged.srt    📄 2. Getting featured products from firebase--.en_CN.srt    📄 1. Getx home controller--.en_merged.srt    📄 3. Edit address--.en.srt    📄 2. Edit profile image--.en.srt    📄 1. Edit name and phone number--.en_merged.srt    📄 2. Edit profile image--.en_CN.srt    📄 3. Edit address--.en_merged.srt    📄 1. Edit name and phone number--.en_CN.srt    📄 3. Edit address--.mp4
  •    📄 1. Edit name and phone number--.en.srt    📄 3. Edit address--.en_CN.srt    📄 2. Edit profile image--.mp4
  •    📄 2. Edit profile image--.en_merged.srt    📄 1. Edit name and phone number--.mp4
  •    📄 2. Adding getx state--.mp4
  •    📄 2. Adding getx state--.en_merged.srt    📄 2. Adding getx state--.en.srt    📄 1. Building bottom navigationbar--.en.srt    📄 1. Building bottom navigationbar--.mp4
  •    📄 1. Building bottom navigationbar--.en_merged.srt    📄 1. Building bottom navigationbar--.en_CN.srt    📄 2. Adding getx state--.en_CN.srt    📄 2. Getbuilder--.en.srt    📄 3. Getx and Obx--.en.srt    📄 3. Getx and Obx--.en_merged.srt    📄 1. Getx state management overview--.en.srt    📄 4. Getx navigation--.en.srt    📄 4. Getx navigation--.en_CN.srt    📄 2. Getbuilder--.en_merged.srt    📄 2. Getbuilder--.mp4
  •    📄 2. Getbuilder--.en_CN.srt    📄 4. Getx navigation--.en_merged.srt    📄 3. Getx and Obx--.en_CN.srt    📄 4. Getx navigation--.mp4
  •    📄 1. Getx state management overview--.mp4
  •    📄 1. Getx state management overview--.en_merged.srt    📄 3. Getx and Obx--.mp4
  •    📄 1. Getx state management overview--.en_CN.srt    📄 3. Streaming chat contacts from firebase--.en_CN.srt    📄 2. Chat tiles UI--.mp4
  •    📄 4. Showing chat contacts on UI--.en_merged.srt    📄 6. Chats count in profile--.en_CN.srt    📄 4. Showing chat contacts on UI--.en_CN.srt    📄 5. Navigation to view chats screen--.en.srt    📄 3. Streaming chat contacts from firebase--.mp4
  •    📄 2. Chat tiles UI--.en_CN.srt    📄 1. Chat contacts screen header--.en_CN.srt    📄 5. Navigation to view chats screen--.en_merged.srt    📄 5. Navigation to view chats screen--.mp4
  •    📄 3. Streaming chat contacts from firebase--.en.srt    📄 3. Streaming chat contacts from firebase--.en_merged.srt    📄 1. Chat contacts screen header--.mp4
  •    📄 2. Chat tiles UI--.en_merged.srt    📄 6. Chats count in profile--.en_merged.srt    📄 4. Showing chat contacts on UI--.en.srt    📄 4. Showing chat contacts on UI--.mp4
  •    📄 1. Chat contacts screen header--.en_merged.srt    📄 5. Navigation to view chats screen--.en_CN.srt    📄 6. Chats count in profile--.en.srt    📄 1. Chat contacts screen header--.en.srt    📄 6. Chats count in profile--.mp4
  •    📄 2. Chat tiles UI--.en.srt    📄 1. Profile information UI--.mp4
  •    📄 1. Profile information UI--.en_CN.srt    📄 5. Refresh ability--.mp4
  •    📄 2. Edit user, address and settings options--.en_merged.srt    📄 3. Getting current user data from firebase--.en_merged.srt    📄 5. Refresh ability--.en_CN.srt    📄 4. Getting current user address--.mp4
  •    📄 2. Edit user, address and settings options--.en_CN.srt    📄 5. Refresh ability--.en_merged.srt    📄 3. Getting current user data from firebase--.en.srt    📄 3. Getting current user data from firebase--.mp4
  •    📄 2. Edit user, address and settings options--.en.srt    📄 1. Profile information UI--.en_merged.srt    📄 1. Profile information UI--.en.srt    📄 3. Getting current user data from firebase--.en_CN.srt    📄 2. Edit user, address and settings options--.mp4
  •    📄 4. Getting current user address--.en_CN.srt    📄 4. Getting current user address--.en.srt    📄 5. Refresh ability--.en.srt    📄 4. Getting current user address--.en_merged.srt    📄 2. Conclusion of course--.mp4
  •    📄 1. Sign out functionality--.en_CN.srt    📄 1. Sign out functionality--.en.srt    📄 1. Sign out functionality--.mp4
  •    📄 2. Conclusion of course--.en.srt    📄 2. Conclusion of course--.en_merged.srt    📄 1. Sign out functionality--.en_merged.srt    📄 2. Conclusion of course--.en_CN.srt    📄 5. Streaming messages from firebase--.mp4
  •    📄 5. Streaming messages from firebase--.en.srt    📄 6. Delete message functionality--.en_merged.srt    📄 2. Chats screen UI--.en_CN.srt    📄 2. Chats screen UI--.en.srt    📄 1. Message model--.en_CN.srt    📄 3. Message keyboard--.en.srt    📄 1. Message model--.en.srt    📄 3. Message keyboard--.en_CN.srt    📄 4. Send messages to users--.en_CN.srt    📄 5. Streaming messages from firebase--.en_CN.srt    📄 3. Message keyboard--.mp4
  •    📄 4. Send messages to users--.en_merged.srt    📄 6. Delete message functionality--.mp4
  •    📄 1. Message model--.mp4
  •    📄 5. Streaming messages from firebase--.en_merged.srt    📄 1. Message model--.en_merged.srt    📄 6. Delete message functionality--.en.srt    📄 4. Send messages to users--.mp4
  •    📄 3. Message keyboard--.en_merged.srt    📄 2. Chats screen UI--.mp4
  •    📄 6. Delete message functionality--.en_CN.srt    📄 4. Send messages to users--.en.srt    📄 2. Chats screen UI--.en_merged.srt    📄 2. Show them in UI--.en_merged.srt    📄 3. Showing user location of product--.mp4
  •    📄 2. Show them in UI--.en_CN.srt    📄 2. Show them in UI--.mp4
  •    📄 1. Recommended products from firebase--.en_CN.srt    📄 1. Recommended products from firebase--.en.srt    📄 3. Showing user location of product--.en_CN.srt    📄 3. Showing user location of product--.en_merged.srt    📄 2. Show them in UI--.en.srt    📄 1. Recommended products from firebase--.en_merged.srt    📄 1. Recommended products from firebase--.mp4
  •    📄 3. Showing user location of product--.en.srt    📄 6. Authenticating the user--.en.srt    📄 2. Building register screen UI--.en.srt    📄 1. Building login screen UI--.mp4
  •    📄 2. Building register screen UI--.en_merged.srt    📄 4. Getting location of user--.en_merged.srt    📄 5. Firebase authentication setup--.en_merged.srt    📄 4. Getting location of user--.en.srt    📄 6. Authenticating the user--.en_CN.srt    📄 7. Implementing login functionality--.en.srt    📄 8. User navigation depending on authentication--.mp4
  •    📄 5. Firebase authentication setup--.en_CN.srt    📄 1. Building login screen UI--.en_CN.srt    📄 4. Getting location of user--.en_CN.srt    📄 8. User navigation depending on authentication--.en_CN.srt    📄 6. Authenticating the user--.mp4
  •    📄 6. Authenticating the user--.en_merged.srt    📄 7. Implementing login functionality--.en_merged.srt    📄 2. Building register screen UI--.en_CN.srt    📄 1. Building login screen UI--.en.srt    📄 7. Implementing login functionality--.mp4
  •    📄 5. Firebase authentication setup--.mp4
  •    📄 3. Creating authcontroller with getx--.en_merged.srt    📄 2. Building register screen UI--.mp4
  •    📄 7. Implementing login functionality--.en_CN.srt    📄 8. User navigation depending on authentication--.en_merged.srt    📄 8. User navigation depending on authentication--.en.srt    📄 1. Building login screen UI--.en_merged.srt    📄 3. Creating authcontroller with getx--.en_CN.srt    📄 5. Firebase authentication setup--.en.srt    📄 3. Creating authcontroller with getx--.mp4
  •    📄 4. Getting location of user--.mp4
  •    📄 3. Creating authcontroller with getx--.en.srt    📄 5. User information of product--.en_CN.srt    📄 2. Product description--.en_merged.srt    📄 5. User information of product--.en.srt    📄 1. Product image--(1).mp4
  •    📄 8. Report user functionality--.en.srt    📄 4. User report and message options--.en_CN.srt    📄 1. Product image--.en.srt    📄 3. Product location map--.en.srt    📄 6. Adding user data on UI--.en_CN.srt    📄 7. Address popup for location--.en_merged.srt    📄 1. Product image--.en_merged.srt    📄 8. Report user functionality--.en_CN.srt    📄 6. Adding user data on UI--.mp4
  •    📄 8. Report user functionality--.en_merged.srt    📄 6. Adding user data on UI--.en.srt    📄 1. Product image--.en_CN.srt    📄 2. Product description--.mp4
  •    📄 7. Address popup for location--.en.srt    📄 4. User report and message options--.mp4
  •    📄 3. Product location map--.mp4
  •    📄 5. User information of product--.en_merged.srt    📄 1. Product image--.mp4
  •    📄 6. Adding user data on UI--.en_merged.srt    📄 3. Product location map--.en_merged.srt    📄 3. Product location map--.en_CN.srt    📄 2. Product description--.en_CN.srt    📄 2. Product description--.en.srt    📄 8. Report user functionality--.mp4
  •    📄 4. User report and message options--.en_merged.srt    📄 5. User information of product--.mp4
  •    📄 7. Address popup for location--.en_CN.srt    📄 7. Address popup for location--.mp4
  •    📄 4. User report and message options--.en.srt    📄 1. Search bar UI--.mp4
  •    📄 3. Featured products UI--.en_CN.srt    📄 2. Categories scroller UI--.en_CN.srt    📄 4. Recommended products UI--.en_CN.srt    📄 3. Featured products UI--.en_merged.srt    📄 2. Categories scroller UI--.en.srt    📄 2. Categories scroller UI--.en_merged.srt    📄 2. Categories scroller UI--.mp4
  •    📄 1. Search bar UI--.en.srt    📄 4. Recommended products UI--.en_merged.srt    📄 3. Featured products UI--.mp4
  •    📄 4. Recommended products UI--.mp4
  •    📄 1. Search bar UI--.en_CN.srt    📄 4. Recommended products UI--.en.srt    📄 3. Featured products UI--.en.srt    📄 1. Search bar UI--.en_merged.srt    📄 4. Search bar functionality--.en.srt    📄 1. Search screen UI--.en.srt    📄 1. Search screen UI--.mp4
  •    📄 4. Search bar functionality--.en_CN.srt    📄 2. Getting products from firebase based on search--.mp4
  •    📄 1. Search screen UI--.en_merged.srt    📄 3. Products depending on categories--.en.srt    📄 2. Getting products from firebase based on search--.en.srt    📄 1. Search screen UI--.en_CN.srt    📄 3. Products depending on categories--.mp4
  •    📄 4. Search bar functionality--.en_merged.srt    📄 3. Products depending on categories--.en_merged.srt    📄 3. Products depending on categories--.en_CN.srt    📄 2. Getting products from firebase based on search--.en_CN.srt    📄 2. Getting products from firebase based on search--.en_merged.srt    📄 4. Search bar functionality--.mp4
  •    📄 2. Title and description screen UI--.mp4
  •    📄 7. Saving product to firebase--.en_merged.srt    📄 7. Saving product to firebase--.en_CN.srt    📄 3. Getx state for categories--.en_merged.srt    📄 5. Photos screen UI--.mp4
  •    📄 3. Getx state for categories--.mp4
  •    📄 3. Getx state for categories--.en_CN.srt    📄 7. Saving product to firebase--.mp4
  •    📄 2. Title and description screen UI--.en_merged.srt    📄 5. Photos screen UI--.en.srt    📄 1. Starting screen UI--.en.srt    📄 2. Title and description screen UI--.en.srt    📄 5. Photos screen UI--.en_merged.srt    📄 7. Saving product to firebase--.en.srt    📄 1. Starting screen UI--.en_CN.srt    📄 5. Photos screen UI--.en_CN.srt    📄 6. Getx state for adding photos--.mp4
  •    📄 4. Product model--.en_merged.srt    📄 4. Product model--.mp4
  •    📄 4. Product model--.en_CN.srt    📄 6. Getx state for adding photos--.en.srt    📄 4. Product model--.en.srt    📄 1. Starting screen UI--.mp4
  •    📄 1. Starting screen UI--.en_merged.srt    📄 6. Getx state for adding photos--.en_merged.srt    📄 6. Getx state for adding photos--.en_CN.srt    📄 2. Title and description screen UI--.en_CN.srt    📄 3. Getx state for categories--.en.srt    📄 2. Getx state for tab bar--.en.srt    📄 4. My product card UI--.en_merged.srt    📄 3. Getting current user products--.en_CN.srt    📄 3. Getting current user products--.mp4
  •    📄 6. Popup for deleting or changing status--.en_merged.srt    📄 6. Popup for deleting or changing status--.en_CN.srt    📄 1. Tab bar UI--.en_merged.srt    📄 1. Tab bar UI--.mp4
  •    📄 6. Popup for deleting or changing status--.en.srt    📄 6. Popup for deleting or changing status--.mp4
  •    📄 2. Getx state for tab bar--.en_CN.srt    📄 5. Showing products depending on state--.mp4
  •    📄 1. Tab bar UI--.en_CN.srt    📄 2. Getx state for tab bar--.mp4
  •    📄 4. My product card UI--.en_CN.srt    📄 4. My product card UI--.en.srt    📄 2. Getx state for tab bar--.en_merged.srt    📄 5. Showing products depending on state--.en_merged.srt    📄 5. Showing products depending on state--.en_CN.srt    📄 4. My product card UI--.mp4
  •    📄 5. Showing products depending on state--.en.srt    📄 3. Getting current user products--.en_merged.srt    📄 3. Getting current user products--.en.srt    📄 1. Tab bar UI--.en.srt    📄 2. Firebase setup--.en.srt    📄 2. Firebase setup--.mp4
  •    📄 1. Getting the packages--.mp4
  •    📄 3. Configuration of files--.en_CN.srt    📄 1. Getting the packages--.en.srt    📄 3. Configuration of files--.en_merged.srt    📄 2. Firebase setup--.en_merged.srt    📄 1. Getting the packages--.en_merged.srt    📄 1. Getting the packages--.en_CN.srt    📄 3. Configuration of files--.en.srt    📄 3. Configuration of files--.mp4
  •    📄 2. Firebase setup--.en_CN.srt