简要总结
本教程介绍了使用 React Native 和 Expo 构建一个名为 Spotlight 的社交媒体应用程序的完整过程。涵盖了从环境搭建、React Native 基础知识、身份验证、数据库设置到最终优化的各个方面。以下是关键点：
- 使用 React Native 和 Expo 进行跨平台移动应用开发。
- 使用 Clerk 进行身份验证，Convex 作为后端和实时数据库。
- 学习 React Native 的基本组件和概念，如 View、Text、Image、Stylesheet、FlatList 等。
- 优化应用程序性能，包括使用 FlatList 替代 ScrollView 以提高渲染效率。
- 部署应用程序并提供额外的资源。
简介
本教程旨在教你如何使用 React Native 和 Expo 从零开始构建一个真实的移动应用程序。最终结果是一个名为 Spotlight 的社交媒体应用程序，它具有七个不同的屏幕，包括身份验证、主页、书签、帖子创建、通知、个人资料和其他用户的个人资料。你将学习如何使用 React Native 的基本组件，以及如何使用 Expo convex 来构建后端。
1- React Native 理论 [重要]
React Native 是一个框架，允许你使用 React 构建移动应用程序。它是一个跨平台框架，因为你可以编写一个 JavaScript 代码库，然后将其部署到 iOS 和 Android。Expo 是一个构建在 React Native 之上的框架，它提供了一个工具箱，其中包含构建生产就绪应用程序所需的所有 API。React Native 和 Expo 之间的区别类似于 React 和 NextJS 在 Web 开发中的作用。React Native 实际上并没有什么不同，就像名字所暗示的那样，仍然有反应，但只是有点多概念和语法差异。
2- 环境设置
安装完成后，你可以选择在物理手机上安装 Expo Go 应用程序，或者使用模拟器。要启动应用程序，请在终端中运行 npx expo start 命令。如果你使用的是物理手机，则需要扫描二维码。如果你使用的是模拟器，则需要按“I”启动 iOS 模拟器，或者按“a”启动 Android 模拟器。
3- React Native 基础
在 React Native 中，任何文本都应该在 Text 组件内部。可以使用 style 属性来设置样式，该属性接受一个对象，其中包含 CSS 样式。可以使用 StyleSheet 组件来创建样式表，以便更好地组织代码。可以使用 TouchableOpacity 或 Pressable 组件来处理事件。可以使用 FlatList 组件来渲染列表。可以使用 TextInput 组件来创建表单。
4- 设置我们的项目
应用程序文件夹中的所有内容都将成为一个屏幕。可以使用 Stack Navigator 来实现屏幕之间的导航。可以使用 Link 组件来实现页面之间的跳转。可以使用 Safe Area Provider 组件来确保内容不会溢出状态栏。可以使用 Tabs 文件夹来创建标签导航器。
5- 身份验证
使用 Clerk 处理身份验证流程。Clerk 是一个用户管理平台，可以处理整个身份验证流程。要使用 Clerk，首先需要在 Clerk 网站上创建一个应用程序。然后，需要安装 Clerk Expo 包和 Clerk Types 包。接下来，需要设置环境变量。最后，需要在布局文件中使用 ClerkProvider 组件包装整个应用程序。
6- 数据库设置
使用 Convex 作为实时数据库。Convex 提供了一个免费计划，可以免费使用。要使用 Convex，首先需要在 Convex 网站上创建一个应用程序。然后，需要安装 Convex 包。接下来，需要运行 npx convex init 命令来初始化 Convex 项目。
7- 定义我们的 Schema
定义数据库的 schema。Schema 定义了数据库中表的结构。每个表都有一个名称和一组字段。每个字段都有一个名称和一个类型。可以使用 Convex 的 defineTable 函数来定义表。可以使用 Convex 的 v 对象来定义字段的类型。可以使用 Convex 的 addIndex 函数来添加索引。
8- 理解 Webhooks
Webhooks 是自动发送的消息，当发生了一些事情时。在本例中，当用户注册时，Clerk 会向 Convex 发送一个事件。Convex 将保存该用户到数据库。要使用 Webhooks，首先需要在 Clerk 网站上创建一个 Webhook 端点。然后，需要在 Convex 中创建一个 HTTP 函数来处理 Webhook 事件。
9- 创建 Post Mutation
创建一个 Convex 函数来创建帖子。Convex 函数是与数据库交互的函数。Convex 函数可以是查询或突变。查询用于获取数据，突变用于创建、更新或删除数据。要创建 Convex 函数，需要使用 Convex 的 defineMutation 函数。
10- 创建 Post Implementation
在创建页面中，我们需要创建一个函数来处理共享按钮的点击事件。该函数将调用 Convex 函数来创建帖子。该函数还将使用 Expo File System 包来上传图像。
11- Get Feed Posts Query
创建一个 Convex 函数来获取帖子。Convex 函数是与数据库交互的函数。Convex 函数可以是查询或突变。查询用于获取数据，突变用于创建、更新或删除数据。要创建 Convex 函数，需要使用 Convex 的 defineQuery 函数。
12- 获取帖子
在主屏幕中，我们需要使用 Convex 函数来获取帖子。然后，我们需要使用 FlatList 组件来渲染帖子。
13- 喜欢帖子
创建一个 Convex 函数来喜欢帖子。Convex 函数是与数据库交互的函数。Convex 函数可以是查询或突变。查询用于获取数据，突变用于创建、更新或删除数据。要创建 Convex 函数，需要使用 Convex 的 defineMutation 函数。
14- React Native 必须知道
使用 FlatList 组件来渲染长列表。FlatList 组件仅渲染屏幕上可见的项目，从而节省内存并提高性能。使用 Pressable 组件来处理复杂的交互。使用 Expo Image 组件来优化图像加载。
15- 评论帖子
创建一个 Convex 函数来添加评论。Convex 函数是与数据库交互的函数。Convex 函数可以是查询或突变。查询用于获取数据，突变用于创建、更新或删除数据。要创建 Convex 函数，需要使用 Convex 的 defineMutation 函数。
16- 添加书签
视频中提到了添加书签功能，但没有详细说明如何实现。
17- 删除帖子
视频中提到了删除帖子功能，但没有详细说明如何实现。
18- 书签屏幕
视频中提到了书签屏幕，但没有详细说明如何实现。
19- 通知屏幕
视频中提到了通知屏幕，但没有详细说明如何实现。
20- 我们的个人资料屏幕
视频中提到了个人资料屏幕，但没有详细说明如何实现。
21- 动态用户屏幕
视频中提到了动态用户屏幕，但没有详细说明如何实现。
22- 最终优化
视频中提到了最终优化，但没有详细说明如何实现。
23- 谈论部署 & 感谢观看！
视频中提到了部署，但没有详细说明如何实现。
