|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/react-native-food-app/
课程评论:没有评论
课程名称:React Native食品应用 概述:本课程以基于React Native的Foodly食品外卖应用为例,重点介绍前端用户部分的开发。该应用的动态后端使用Node.js和Express构建,为高性能操作提供了坚实的基础;使用MongoDB进行高效的数据处理,并无缝集成Firebase Admin,以增强后端管理能力。该课程仅覆盖前端内容,后端API已经提供,但不涉及任何管理面板。 前端使用最新版本的React Native和Expo开发,具有时尚、现代的用户界面。课程巧妙地集成了Google地图API,为用户和餐厅提供精准的位置服务,包括路线、方向和地理编码。这种地理定位的准确性使得个性化推荐和准确的配送定价得以实现。此外,课程还利用了距离矩阵API来准确计算配送成本、距离和时间估计,确保用户在食品外卖应用中的流畅高效体验。 基本应用功能包括: - 获取Google API密钥 - 将Context Providers链接到应用 - 使用expo-location获取用户位置,使用useContext钩子访问数据 - 创建主页头部 - 反向地理编码坐标以获取位置和时间功能 - 使用Flatlist和Image组件展示类别列表 - 使用Flatlist和Text组件选择餐厅列表 - 可重用的标题组件 - 附近餐厅推荐 - 新食品推荐及快速送达组件 - 食品栈导航器及数据传递讲解 - 创建食品页面按钮、文本组件及样式 - 食品标签的Flatlist及良好添加物的Bounce CheckBox计数功能 - 购物车和订单功能及数据准备 - 处理添加物和价格自增逻辑 - TabView在React Native中的应用 - 餐厅页面的图片、按钮及评分展示 - 餐厅评价页面 - 使用Google距离矩阵展示配送时间、费用和距离 - 在TabView中使用useContext钩子传递数据 - Google地图和本地地图的链接 - 通过Google方向API获取路线 - 地图上显示多条线和标记 - 餐厅食品菜单 - 登录及Login Context的数据传递 - 使用CartCount Context持久化购物车数量 - 分类食品组件 后台系统概述: 1. 身份验证与授权:与Firebase Admin集成,管理用户、角色和权限,定义四种不同角色:管理员、商家、客户和司机;创建中间件函数以验证用户角色并强制访问控制。 2. 用户管理:用户角色注册与管理、JWT安全验证、密码加密用户凭证、用户CRUD操作及地址管理功能。 3. 商家特定功能:商家注册及相关信息收集、商家中间件和食品管理端点开发。 4. 推荐与动态内容:基于位置的餐厅推荐、动态食品推荐和配送时间建议功能。 5. 购物车与订单处理:购物车管理及订单创建与状态更新功能。 6. 分类与推荐:管理员分类管理及基于聚合管道的随机类别推荐。 7. 司机特定功能:司机注册及相关任务的中间件限制。 本课程通过实践项目帮助学员掌握React Native开发技能,适合希望深入了解食品外卖应用开发的学习者。
Foodly food delivery app based on react native boasts a dynamic backend crafted with Node.js and Express, providing a solid foundation for high-performance operations. MongoDB is employed for efficient data handling, and Firebase Admin is seamlessly integrated to enhance backend management capabilities.This tutorial only covers frontend user section. Backend api is given but we did not cover any admin panelThe frontend, developed with the latest version of React Native and Expo, features a sleek, cutting-edge user interface. Google Maps APIs are deftly incorporated for location-based services such as routes, directions, and geocoding, ensuring precise localization of users and restaurants. This geolocation accuracy allows for personalized recommendations and accurate delivery pricing. Additionally, the Distance Matrix is utilized to accurately calculate delivery costs, distances, and time estimates, ensuring a smooth and efficient user experience in our food delivery app.Basic App FeaturesGetting Google Api KeyHooking Context Providers to the appGetting user location with expo-location, accessing data using useContext hookCreating Home HeaderReverse Geocode coordinates to get location and time functionCategory List using Flatlist and Image ComponentPick Restaurant List Using Flatlist and Text ComponentReusable Heading ComponentNearby Restaurant RecommendationsNew foods recommendations and fastest near you componentFood Stack NavigatorExplanation on passing data to a screen inside of a stackCreating Food Page Buttons, Text Components and stylingFoodTags flatlist and good additives list with BounceCheckBoxCount for increasing the quantityCart and orders functions and data prepHandle additives and price increment according to changes in additivesTabView in react nativeRestaurant Page Image, Buttons and rating using rating packageRestaurant rating pageDelivery time, cost and distance using google distance matrixPassing data to page inside TabView using useContext hookGoogle maps and linking app to native mapsFetch directions using the Google direction apiDisplaying polyLines and markers on the mapRestaurant food menuLogin and passing data to Login ContextPersistent CartCount using CartCount ContextCategory Food ComponentBackend System Overview1. Authentication and AuthorizationIntegration with Firebase Admin: Implement backend services using Firebase Admin SDK to manage users, roles, and permissions.Role-Based Authentication: Define four distinct roles: Admin, Vendor, Client, and Driver.Advanced Middleware: Create middleware functions to verify user roles and enforce access control for protected routes.2. User ManagementRegistration and Profiles: Enable registration for different user roles, each with a unique set of data fields and validation rules.Implement JSON Web Tokens (JWT) for secure, token-based user authentication.Use password encryption techniques (such as bcrypt) to ensure the safety of user credentials.User CRUD Operations: Allow for adding, updating, and retrieving user information.Address Management: Provide functionality for users to add, update, and retrieve addresses.Implement logic to maintain a single default address per user, with the ability to change the default setting.3. Vendor-Specific FeaturesVendor Registration: Set up a registration process for vendors, including the collection of necessary information and validation.Vendor Middleware: Ensure that only vendors can access routes for managing their restaurant and food items.Food Management: Develop endpoints for vendors to upload and manage their food items.4. Recommendations and Dynamic ContentLocation-Based Restaurant Recommendations: Create endpoints that suggest restaurants to clients based on their current location.Dynamic Food Recommendations: Develop algorithms to recommend food items to users also based on user location.Preparation and Delivery Time: Introduce logic to recommend food that can be prepared and delivered in the shortest possible time, considering user location.5. Shopping Cart and Order ProcessingCart Management: Allow users to add and remove items from the cart.Enable users to adjust the quantity of cart items.Update and return the cart count whenever changes are made to the cart.Order Creation and Management: Provide functionality for users to create orders and customize them with add-ons.Update orders based on payment and delivery status.6. Categories and RecommendationsCategory Management: Allow admins to add, update, and delete categories of food.Category Recommendations: Use aggregation pipelines to offer random category recommendations to users.7. Driver-Specific FunctionalityDriver Registration and Restrictions: Establish registration for drivers and ensure middleware restricts them to driver-related tasks.