这门课能帮你解决什么
做跨平台移动端应用时，同一套代码要同时跑在 iOS 和 Android 上，维护两份原生代码的成本太高。React Native 让你用 JavaScript 或 TypeScript 写界面，编译后能接近原生性能。本课程围绕这个核心场景展开：从项目结构搭建、组件通信机制、导航路由配置，到列表性能优化、平台差异化处理，再到最终的上线打包流程，覆盖了开发一个完整 React Native 应用所需的关键环节。学完你可以独立完成一个能同时上架双端的移动应用，不再因为"这个效果 iOS 有、Android 没有"而反复返工，也不再被原生开发的复杂度劝退。
适合什么基础，建议先看哪几块
课程面向有一定前端基础的学习者。你至少应该熟悉 React 的核心概念——组件、Props、State、Hooks，知道 JSX 是什么，能用 useEffect 处理副作用，对 JavaScript 异步编程（Promise、async/await）要有实际使用经验。如果你还没写过 React，建议先补 React 基础，再回头来刷这门课，否则进度会很吃力。
建议学习顺序如下：先跟着**项目初始化与环境配置**部分走一遍，搞清楚工具链怎么搭，Expo 和 CLI 两条路线的区别，选哪条更贴合你后续的项目需求。然后是**组件与样式体系**，理解 View、Text、Image 等基础组件，以及 StyleSheet 的工作原理，避免把 CSS 习惯直接套过来踩坑。**列表与性能**这块最容易遇到滑动卡顿的问题，FlatList 的 renderItem 怎么写、keyExtractor 要注意什么，建议多看几遍示例代码。**导航与路由**是项目结构的骨架，React Navigation 的 Stack 和 Tab 两种模式怎么搭配使用，要弄明白。**平台差异化处理**部分教你用 Platform.OS 写出真正"跨平台"的代码。**状态管理与网络请求**则是项目做大后的必选项，fetch 和 axios 在 RN 里的用法要结合课程例子练习。
学完能独立做什么，资料怎么配合练习
完成课程并配合资料练习后，你应该能独立完成以下工作：搭建一个包含多页面导航的 React Native 项目；用 TypeScript 编写可维护的组件；处理 FlatList 的性能问题，实现流畅的长列表；针对不同平台写出差异化逻辑；完成项目的调试、打包和上架流程。
课程资料包里通常有对应每个模块的示例代码和练习题。建议先跟着示例走一遍，理解每一块代码的作用，然后再动手写自己的项目。练习过程中遇到问题，先对照示例代码排查，不要急着查网络教程。React Native 的问题往往出在环境配置和版本兼容上，耐心一点，按步骤来。
the-best-react-native-course
本课程隶属 会员库 · 其他机构课程，完整课程目录与配套资料如下。
课程目录
01 - Getting Started/ 001 Course prerequisites.mp4 001 Course prerequisites_en.srt 002 What is React Native.mp4 002 What is React Native_en.srt 003 Expo vs React Native.mp4 003 Expo vs React Native_en.srt 004 Introduction to Expo Snack.mp4 004 Introduction to Expo Snack_en.srt 005 Set up environment.mp4 005 Set up environment_en.srt 006 Create Your First App.mp4 006 Create Your First App_en.srt 007 iOS Simulator (MacOS).mp4 007 iOS Simulator (MacOS)_en.srt 008 Run App on Real Device.mp4 008 Run App on Real Device_en.srt 009 Android Emulator (MacOS).mp4 009 Android Emulator (MacOS)_en.srt 010 Setup Environment Windows.mp4 010 Setup Environment Windows_en.srt 02 - UI & Core Components/ 011 Explain Init Code.mp4 011 Explain Init Code_en.srt 012 SafeAreaView.mp4 012 SafeAreaView_en.srt 013 Text.mp4 013 Text_en.srt 014 StyleSheet.mp4 014 StyleSheet_en.srt 015 Images.mp4 015 Images_en.srt 016 Buttons & Pressable & Touchable.mp4 016 Buttons & Pressable & Touchable_en.srt 017 ScrollView.mp4 017 ScrollView_en.srt 018 Platfrom.mp4 018 Platfrom_en.srt 019 Loaders.mp4 019 Loaders_en.srt 020 Views.mp4 020 Views_en.srt 021 Margin & Padding.mp4 021 Margin & Padding_en.srt 022 Flex.mp4 022 Flex_en.srt 023 flex-direction.mp4 023 flex-direction_en.srt 024 flexWrap.mp4 024 flexWrap_en.srt 025 Positions.mp4 025 Positions_en.srt 026 Dimensions.mp4 026 Dimensions_en.srt 027 Responsive UI.mp4 027 Responsive UI_en.srt 028 useState Hook.mp4 028 useState Hook_en.srt 029 Modal.mp4 029 Modal_en.srt 030 Expo Icons.mp4 030 Expo Icons_en.srt 031 ImageBackground.mp4 031 ImageBackground_en.srt 032 TextInput.mp4 032 TextInput_en.srt 033 Create React Component.mp4 033 Create React Component_en.srt 03 - UI Mastering Practice/ 034 UI Mastring Introduction.mp4 034 UI Mastring Introduction_en.srt 035 Figma Design.mp4 035 Figma Design_en.srt 035 Figma-Design-Link.url 035 code.zip 036 PNG vs SVG.mp4 036 PNG vs SVG_en.srt 036 code.zip 037 Intro Screen.mp4 037 Intro Screen_en.srt 037 code.zip 038 User Avatar.mp4 038 User Avatar_en.srt 038 code.zip 039 Header Component.mp4 039 Header Component_en.srt 039 code.zip 040 Social Section.mp4 040 Social Section_en.srt 040 code.zip 041 Social Container.mp4 041 Social Container_en.srt 041 code.zip 042 Finish Contact Us Screen.mp4 042 Finish Contact Us Screen_en.srt 042 code.zip 043 Home Screen Header.mp4 043 Home Screen Header_en.srt 043 code.zip 044 Top Tabs.mp4 044 Top Tabs_en.srt 044 code.zip 045 Card Component with Dark Overlay.mp4 045 Card Component with Dark Overlay_en.srt 045 code.zip 046 FlatList with 2 Rows.mp4 046 FlatList with 2 Rows_en.srt 046 code.zip 046 data.ts 047 FlatList with Props.mp4 047 FlatList with Props_en.srt 047 code.zip 048 Payment Screen Header.mp4 048 Payment Screen Header_en.srt 049 Payment Method.mp4 049 Payment Method_en.srt 049 code.zip 050 Payment Method Selected.mp4 050 Payment Method Selected_en.srt 050 code.zip 051 Payment List.mp4 051 Payment List_en.srt 051 code.zip 052 Bank Card Box.mp4 052 Bank Card Box_en.srt 052 code.zip 053 Add Button.mp4 053 Add Button_en.srt 053 code.zip 054 Adding Animations.mp4 054 Adding Animations_en.srt 054 code.zip 055 Task Time.mp4 055 Task Time_en.srt external-links.txt 04 - Navigation & Bottom Tabs/ 056 Builds Screens.mp4 056 Builds Screens_en.srt 056 code.zip 057 Stack Navigation.mp4 057 Stack Navigation_en.srt 057 code.zip 058 Recap & Screen Options.mp4 058 Recap & Screen Options_en.srt 058 code.zip 059 code.zip 059 useRoute.mp4 059 useRoute_en.srt 060 BottomTabs.mp4 060 BottomTabs_en.srt 060 Code.zip 05 - Working with APIs/ 061 Create New App.mp4 061 Create New App_en.srt 061 code.zip 062 Create Custom API ( Mock Api ).mp4 062 Create Custom API ( Mock Api )_en.srt 063 Axios.mp4 063 Axios_en.srt 063 code.zip 064 Get Request & FlatList.mp4 064 Get Request & FlatList_en.srt 064 code.zip 065 Get By Id Request.mp4 065 Get By Id Request_en.srt 065 code.zip 066 Try Catch.mp4 066 Try Catch_en.srt 066 code.zip 067 Delete Request.mp4 067 Delete Request_en.srt 067 code.zip 068 Post Request.mp4 068 Post Request_en.srt 068 code.zip 069 Put Request.mp4 069 Put Request_en.srt 069 code.zip 070 Refactor And Create Home Screen For New Project.mp4 070 Refactor And Create Home Screen For New Project_en.srt 070 code.zip 071 Book Card.mp4 071 Book Card_en.srt 071 code.zip 072 Props.mp4 072 Props_en.srt 072 code.zip 073 APIs Functions.mp4 073 APIs Functions_en.srt 073 code.zip 074 Render Data In Flatlist.mp4 074 Render Data In Flatlist_en.srt 074 code.zip 075 Delete Book.mp4 075 Delete Book_en.srt 075 code.zip 076 Add Button UI & Modal.mp4 076 Add Button UI & Modal_en.srt 076 code.zip 077 CustomTextInput.mp4 077 CustomTextInput_en.srt 077 code.zip 078 Save Button.mp4 078 Save Button_en.srt 078 code.zip 079 Create Book.mp4 079 Create Book_en.srt 079 code.zip 080 Edit Book.mp4 080 Edit Book_en.srt 080 code.zip 081 Bug Fix.mp4 081 Bug Fix_en.srt 06 - Redux & Redux Toolkit/ 082 Redux is not that hard.mp4 082 Redux is not that hard_en.srt 083 Why Redux Useful.mp4 083 Why Redux Useful_en.srt 083 code.zip 084 Reducer Explained.mp4 084 Reducer Explained_en.srt 084 code.zip 085 Create Store and Get Data From Global State.mp4 085 Create Store and Get Data From Global State_en.srt 085 code.zip 086 actions & useDispatch.mp4 086 actions & useDispatch_en.srt 086 code.zip 087 Payload.mp4 087 Payload_en.srt 087 code.zip 088 Combine Reducers.mp4 088 Combine Reducers_en.srt 088 code.zip 089 RootState.mp4 089 RootState_en.srt 089 code.zip 090 Recap Redux & Task.mp4 090 Recap Redux & Task_en.srt 090 code.zip 091 Redux toolkit Store.mp4 091 Redux toolkit Store_en.srt 091 code.zip 092 Redux Toolkit Reducer & Actions.mp4 092 Redux Toolkit Reducer & Actions_en.srt 092 code.zip 07 - Smart E-Commerce App UI Part 1/ 093 Create Project.mp4 093 Create Project_en.srt 093 code.zip 094 Folder Structure.mp4 094 Folder Structure_en.srt 094 code.zip 095 AppText.mp4 095 AppText_en.srt 095 code.zip 096 App Colors.mp4 096 App Colors_en.srt 096 code.zip 097 AppSafeView.mp4 097 AppSafeView_en.srt 097 code.zip 098 Flash Message.mp4 098 Flash Message_en.srt 098 code.zip 099 AppButton.mp4 099 AppButton_en.srt 099 code.zip 100 AppTextInput.mp4 100 AppTextInput_en.srt 100 code.zip 101 Sign In Screen.mp4 101 Sign In Screen_en.srt 101 app-logo.png 101 code.zip 102 Sign Up Screen.mp4 102 Sign Up Screen_en.srt 102 app-logo.png 102 code.zip 103 Stack Navigation.mp4 103 Stack Navigation_en.srt 103 code.zip 104 Bottom Tabs & Main App Stack.mp4 104 Bottom Tabs & Main App Stack_en.srt 104 code.zip 105 Style Bottom Tabs.mp4 105 Style Bottom Tabs_en.srt 105 code.zip 106 App Header.mp4 106 App Header_en.srt 106 code.zip 107 App Custom Fonts.mp4 107 App Custom Fonts_en.srt 107 code.zip 108 Prepare Data.mp4 108 Prepare Data_en.srt 108 products.ts 109 Product Card.mp4 109 Product Card_en.srt 109 code.zip 110 Add To Cart Button.mp4 110 Add To Cart Button_en.srt 110 code.zip 111 Shadow.mp4 111 Shadow_en.srt 111 code.zip 112 Props.mp4 112 Props_en.srt 112 code.zip 113 Render Data in FlatList.mp4 113 Render Data in FlatList_en.srt 113 code.zip 114 Empty Cart Component.mp4 114 Empty Cart Component_en.srt 114 code.zip 115 Cart Item.mp4 115 Cart Item_en.srt 115 code.zip 116 Increase Decrease Buttons.mp4 116 Increase Decrease Buttons_en.srt 116 code.zip 117 Cart Item Props.mp4 117 Cart Item Props_en.srt 117 code.zip 118 Totals View.mp4 118 Totals View_en.srt 118 code.zip 119 Cart Screen.mp4 119 Cart Screen_en.srt 119 code.zip 120 Checkout Screen.mp4 120 Checkout Screen_en.srt 120 code.zip 121 Profile Screen.mp4 121 Profile Screen_en.srt 122 My Orders Screen.mp4 122 My Orders Screen_en.srt 08 - Cart State Management (Redux Toolkit)/ 123 Create Store.mp4 123 Create Store_en.srt 123 code.zip 124 cartSlice.mp4 124 cartSlice_en.srt 124 code.zip 125 Add Item To Cart.mp4 125 Add Item To Cart_en.srt 126 Remove Item From Cart.mp4 126 Remove Item From Cart_en.srt 126 code.zip 127 Delete Product.mp4 127 Delete Product_en.srt 127 code.zip 128 Finish Cart Screen.mp4 128 Finish Cart Screen_en.srt 128 code.zip 09 - Forms Handling/ 129 Handling Forms using useState.mp4 129 Handling Forms using useState_en.srt 129 code.zip 130 AppTextInputCotroller.mp4 130 AppTextInputCotroller_en.srt 130 code.zip 131 Style Error Message.mp4 131 Style Error Message_en.srt 131 code.zip 132 Yup & Validation Schemas.mp4 132 Yup & Validation Schemas_en.srt 132 code.zip 133 Add Typescript.mp4 133 Add Typescript_en.srt 133 code.zip 134 Auth Validation Task.mp4 134 Auth Validation Task_en.srt 134 code.zip 10 - Authentication & Firebase Database/ 135 Firebase Init.mp4 135 Firebase Init_en.srt 135 code.zip 136 Sign in users.mp4 136 Sign in users_en.srt 136 code.zip 137 Handling Errors.mp4 137 Handling Errors_en.srt 137 code.zip 137 fire-base-errors-code.rtf 138 Register new users.mp4 138 Register new users_en.srt 138 code.zip 138 fire-base-errors-code.rtf 139 Firestore Database.mp4 139 Firestore Database_en.srt 140 Get data from database.mp4 140 Get data from database_en.srt 140 code.zip 141 Save User Data In Global State.mp4 141 Save User Data In Global State_en.srt 141 code.zip 142 Place Orders.mp4 142 Place Orders_en.srt 142 code.zip … 共 687 条
