文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

React Native 开发心得分享

但如果学 RN 只是为了避免不用学 android 和 iOS 等原生技术就能写 app，那便不建议学习。...此外 Expo 还提供了 Expo Go App，只需要在你的移动端设备中安装它，启动开发服务器并生成 QR 码。...模拟器无法请求本地 api​ 由于一开始是在 Web 端进行调试开发的，所以没留意到这个问题，直到切换到安卓模拟器之后发现模拟器无法请求本地后端服务，在IOS 端暂无这问题。...于是便采用相同的项目结构以及 UI 库了。但事实上在我编写的过程中，想要一套代码就能实现跨三端(web,android,ios) 效果并不佳了，这在下一章便会说到。...处理平台差异​ 不同平台之间必然会存在一定的开发差异，expo 也提供了相应的解决方案，可以通过给文件添加不同的后缀扩展(.web .android .ios) 以在对应平台执行对应文件，官方文档 Platform

2K31

Expo与Flutter：如何选择合适的移动框架

Flutter 和 Expo 允许您构建移动应用程序，而无需接触原生代码。但是，它们对访问和使用原生平台 API 采取了不同的方法。 以相机为例。...在 Expo 中，相机被抽象化，您可以使用 expo-camera 包来渲染原生 iOS 和 Android 相机视图。 虽然看起来是一个很小的区别，但它会影响某些项目的关键要求。...因此，如果您希望使用利基原生 API 或希望在发布后立即访问新的平台功能，您可能需要选择 Expo。 3. 您是否希望跨平台拥有视觉上相同的界面？...如果您希望跨平台拥有统一的品牌外观和感觉，这可能是一件好事，但它以无法在每个平台上完全呈现原生外观和感觉为代价。 为什么？...除此之外，您还可以选择使用 Expo 应用程序服务 (EAS)： EAS Build 在云端构建您的应用程序，因此您无需担心为 iOS 和 Android 设置构建环境。

1.8K10
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    React Native推送通知：完整的操作指南

    原生平台特定的通知服务（FCM/APNs） Android和iOS平台都提供了用于接收推送通知的原生平台特定API 适用于安卓设备的Firebase云消息传递（FCM） 苹果推送通知服务(APNs)适用于...可以通过统一的库API轻松接收远程通知并显示本地通知。...，并启动React Native开发服务器： yarn install yarn start 上述命令安装依赖项并启动Expo开发服务器，因此你可以通过在Android或iOS上使用Expo应用来测试你的应用程序...如果你访问Expo的文档，你会找到关于如何在许多语言中实现服务器上的推送通知的信息。 在这个教程中，我将使用一个Node.js服务器。...官方的Expo文档可以指导你为生产应用设置FCM和APNs。然而，由于Expo应用，你可以在不配置FCM或APNs的情况下开发和测试你的应用程序。

    7.7K10

    React Native 项目 Web 端同构初探

    浅显地认为react-native-web就是把React Native的组件和API都用适用于Web的标签和API再适配实现一遍，使其在Web上的行为和在原生应用上尽量保持一致，从文档中提到的 Alert...如果您想基于 React Native 实现多端统一化方案，可参考去哪儿前端团队的实现方案：跨端开发, 仓库地址：https://github.com/qunarcorp/qrn-remax-unir...expo-cli 中已经预置了对web的支持，如下图所示....yarn web,这时会在本地8080端口运行一个服务，这时我们分别执行yarn ios 和 yarn android就能看到在ios模拟器和Android模拟器中显示和web端一模一样的页面,一次 react-native-web...，通过.web.js扩展名可以使该文件仅在Web上使用,其他一些可用的扩展如.native.js、.ios.js和.android.js适用于移动端。

    4.5K30

    跨平台开发框架到底哪家强？5款主流框架横向对比！

    安装项目，项目安装完毕后进入项目执行 yarn start 会重新安装一次 expo-cli，之后本地启动项目，打开 dev 的浏览器界面如下，最左边可以看到打开的是本地的 expo 得调试台，选择本地...整个 NativeScript 的能力和它的名字一样是专门为了 iOS 和 Android 而开发的，但是写法却是 JavaScript。... DevTools: `  `$ ns debug ios `  `$ ns debug android 我们看一下在 android 下是什么样子的，iOS 也是因为本地 Xcode 版本太老跑不起来...然后下载官网的APICloud Studio 3，如果是 Mac 系统一定要注意，不能直接在 download 目录打开，需要复制到应用程序文件夹内再用。...4.2 API 支持，组件丰富程度 这部分从 API 层面对比五个框架对原生能力的支持情况和组件支持的情况。

    9.8K20

    深度测评 | 五大主流多端开发框架全面对比

    安装项目，项目安装完毕后进入项目执行 yarn start 会重新安装一次 expo-cli，之后本地启动项目，打开 dev 的浏览器界面如下，最左边可以看到打开的是本地的 expo 得调试台，选择本地...整个 NativeScript 的能力和它的名字一样是专门为了 iOS 和 Android 而开发的，但是写法却是 JavaScript。...Chrome DevTools: ` `$ ns debug ios ` `$ ns debug android 我们看一下在 android 下是什么样子的，iOS 也是因为本地 Xcode 版本太老跑不起来...然后下载官网的APICloud Studio 3，如果是 Mac 系统一定要注意，不能直接在 download 目录打开，需要复制到应用程序文件夹内再用。...4.2 API 支持，组件丰富程度 这部分从 API 层面对比五个框架对原生能力的支持情况和组件支持的情况。

    6.5K30

    expo

    https://docs.expo.dev/ https://github.com/expo/expo Expo 是一个开源平台，旨在帮助开发者构建可以在 Android、iOS 和 Web 上运行的通用原生应用...通过结合使用 React 和 JavaScript，开发者可以在一个统一的环境中构建跨平台的应用，而不需要切换不同的技术栈。...Expo 的核心优势之一就是它提供了一个完整的 SDK、模块 API、CLI 工具以及丰富的文档，极大简化了跨平台开发过程。...例如，packages 目录包含了所有 Expo 模块的源代码，apps/expo-go 目录则包含了 Expo Go 的源代码，开发者可以在这里进行本地测试和定制开发。...结语 无论你是正在寻找一种快速构建跨平台应用的方式，还是希望简化开发流程、提升开发效率，Expo 都是一个值得尝试的工具。它不仅支持丰富的功能和服务，还为开发者提供了高度的灵活性和扩展性。

    93810

    H5 手机 App 开发入门：技术篇

    如果已经掌握了 Web 技术，这个技术栈就主要学习容器提供的 API Bridge，网页通过它们去调用底层硬件的 API。...Android Studio 会询问项目参数，包括项目名称、开发语言（Java）等，然后就进入了开发环境。因为它是基于 Java IDE 修改的，懂 Java 的朋友应该对这个界面比较熟悉。 ?...所有这些框架的共同点，都是使用 Web 技术（HTML5 + CSS + JavaScript）开发页面，再由框架分别打包成 iOS 和安卓的 App 安装包。...然后，在本机起一个 Web 服务，看看 Demo 的效果。 $ ionic serve 上面命令会自动打开浏览器窗口，访问本机的8100端口，在浏览器中显示网页效果。...不管什么平台，都调用内嵌的自己那套控件，就能做到 iOS 和安卓体验完全一致。 Flutter 历史还不长，应用还不广泛，API 也没稳定下来。但是很值得关注。 ?

    8.4K41

    Claude Code移动开发子代理实战：打造你的全平台APP架构师

    和HIG 设备适配 屏幕尺寸混乱 响应式布局方案 原生功能 相机、GPS调用复杂 封装好的原生API调用 1.3 通俗理解移动开发的复杂性 想象你要为不同国家的人做饭： iOS = 日本料理（精致、统一...描述: 使用React Native、Flutter或原生开发构建iOS和Android高性能应用。...## 平台技术栈 / Platform Expertise - React Native配合Expo和裸工作流优化 - Flutter与Dart跨平台开发 - iOS原生开发（Swift、SwiftUI...、UIKit） - Android原生开发（Kotlin、Jetpack Compose） - 渐进式Web应用（PWA）移动优先设计 - 移动端DevOps和CI/CD流水线 - 应用商店优化和部署策略...- 相机、GPS和传感器API实现 - 带本地数据库同步的离线功能 - 真机全面测试 - 应用商店合规和审核指南遵守 - 崩溃报告和分析集成 构建让每个平台都感觉原生的移动应用，同时最大化代码重用。

    17610

    React Native 调查显示新架构之路坎坷

    今年的调查从 2024 年 12 月持续到 2025 年 1 月，共收到了 3501 份回复，高于去年 2400 份，显示出对 React Native 的兴趣和使用正在增长。...开源的 Expo 框架面向 Android、iOS 和 Web，并因其相对于其他解决方案的优势而备受好评。...大多数 React Native 开发者专注于 Android 和 iOS，只有 22% 的开发者还同时开发 Web 端，对 macOS 或 Windows 的桌面应用兴趣不大——尽管微软已经开始使用...React Native 进行跨平台开发。...如果 React 在 Web 应用中的使用持续增长，那么开发人员对 React Native 的兴趣也可能会增加，因为他们可以利用现有技能，在 Web 应用和需要访问平台 API 的移动应用之间共享代码

    27800

    app hybrid框架_混合式app

    Hybrid App 即混合开发,由Native通过JSBridge等方法提供统一的API,然后用Html5+JS来写实际的逻辑,调用API,这种模式下,由于Android,iOS的API一般有一致性,...,所以可以直接调用官方提供的api,功能最为全面(比如本地资源操作,通知,动画等) 缺点 开发成本高,无法跨平台,不同平台Android和iOS上都要各自独立开发 Android上基于Java开发,...,有跨平台效果,当然了,实质最终发布的仍然是独立的原生APP(各种的平台有各种的SDK),有如下优点和缺点 优点 开发成本较低,可以跨平台,调试方便 Hybrid模式下,由原生提供统一的API给JS调用...,即页面用JS写,然后原生通过Bridge技术分析JS,将JS内容单独渲染成原生Android和iOS,所以也就是为什么性能不逊色原生 开发人员单一技术栈,一次学习,跨平台开发 这种模式是统一由JS...不追求用户体验和性能,对离线访问没要求 正常来说,如果追求性能和体验,都不会选用web app 没有额外功能,只有一些信息展示 因为web有限制,很多功能都无法实现,所以有额外功能就只能弃用这种方案了

    1.7K20

    React Native 导航：示例教程

    React Navigation 是用 JavaScript 编写的，并不直接使用 iOS 和 Android 上的原生导航 API。相反，它重新创建了这些 API 的某些子集。...React Native Navigation 有一点不同，它直接使用 iOS 和 Android 上的原生导航 API，这使得它能够提供更加原生的外观和感觉。...堆栈导航器还提供了类似于原生 iOS 和 Android 的过渡效果和手势。 注意，一个应用程序可以有多个堆栈导航器。...则利用了原生 API；iOS 上的 UINavigationController 和 Android 上的 Fragment，这样导航的行为就会与原生构建的应用程序一样。...我们将其配置为熟悉的 iOS 和 Android 外观和感觉：在 iOS 中，新屏幕从右侧滑入，而在 Android 中，新屏幕从底部淡入。

    3.8K10

    客户端软件GUI开发技术漫谈：原生与跨平台解决方案分析

    可以方便的通过Node.JS调用系统API、可以使用SQLite做本地字典项的缓存处理，可以将复杂的计算逻辑放在客户端进行，从而减轻服务器端的压力等等。...具体包括  Web App层是开发人员编写代码的主要地方，应用程序以网页的形式呈现，在一个index.html的本地页面文件中引用所需要的各种Web资源，如CSS、JavaScript、图像、影音文件等...Mobile OS就是具体的手机操作系统层 Cordova预先帮我们预先封装了各种mobile os上最常用的本地api调用，然后以统一的JavaScript api形式提供给webapp开发者调用。...本质都是对原生API做了一层C#的封装，因此在使用上与原生API会十分相似。这种封装会结合一些C#的语法特性，让开发者可以享受C#的语法糖。...Flutter flutter 其实就是一套谷歌开源的跨平台 UI 开发框架，支持 Android 和 iOS ，并且目前开始支持 Web 和 MacOS，未来还会继续支持 Win和 Linux 平台的一套

    16.1K30

    让小型企业提高 20 倍效率的统一技术栈

    我们的产品很多——Web、iOS、Android、储蓄、支票、贷款、存款、作业——单个开发人员要能够理解、维护和改进所有这些产品。...Web、移动端和服务器上的类似逻辑保存在一个共享的 Atmos 库中，技术栈的所有部分都可以访问。...技术栈第 1 部分：纯 JavaScript iOS、Android&Web 应用 Web、iOS 和 Android 上均使用 React。...其他可选方案 在一个完美的世界里，我们应该使用单个代码库，由一个庞大的单体在服务器端完成所有渲染，并使用一个单人框架（one-person framework），但鉴于现代客户对 iOS、Android...Rails for Web、iOS、Android & 服务器（Hey.com 的风格），移动应用导航本地渲染。注：1 种语言，新方法，或许已经过实战检验？

    1.7K20

    Hybrid App 应用开发中 5 个必备知识点复习

    更新最为快速； 由于web app资源是直接部署在服务器端的，所以只需替换服务器端文件，用户访问是就已经更新了(当然需要解决一些缓存问题)。...缺点： 开发和维护成本高，无法跨平台，需要各平台各自独立开发； Android 上基于 Java 开发，iOS 上基 OC 或 Swift 开发，相互之间独立，必须要有各自的开发人员。...优点： 学习和开发成本较低，可以跨平台，调试方便； Hybrid 开发模式下，由原生提供统一的 API 给 JS 调用，实际的主要逻辑由 HTML 和 JS 完成，最终放在 webview 中显示，...长 短 较短 中等 开发成本 昂贵 便宜 较为便宜 中等 跨平台 不跨平台 所有H5浏览器 Android，iOS，h5浏览器 Android，iOS APP发布 AppStore Web服务器 AppStore...选择 Web App 模式的情况： 不追求用户体验和性能，对离线访问没要求，正常来说，如果追求性能和体验，都不会选用web app。

    2.7K00

    在 Node.js 上运行 Flutter Web 应用和 API

    在Node.js上运行Flutter Web应用和API 大量的跨平台应用开发框架，使你可以编写一次代码，然后在 Android，iOS 等多个平台上甚至在台式机上运行。...它支持在开发期间进行有状态的热重启，这意味着你可以随时对代码进行更改，并观看它们在模拟器或物理设备上的应用，而无需重新启动程序或丢失程序状态。 Flutter 主要关注 iOS 和 Android。...在运行程序之前，请先更新此常量的值，以便它可以连接到本地 Node.js 服务器上运行的 API。该网址必须包含你计算机的主机名。...这次你的应用程序将会显示从天气 API 检索到的天气数据，而不会出现跨域资源共享错误。 ?...浏览器中呈现的用户界面看起来几乎与 Android 中的界面相同。 但是不能仅仅由于 Flutter 的 Web 支持而将 Flutter 视为跨平台应用程序框架。

    5.2K10

    几个跨平台移动App开发方案框架比较

    每个开发框架几乎都包含以下特性： 使用 HTML5 + CSS + JavaScript 开发 跨平台重用代码 丰富的UI库 提供访问设备原生API的 JavaScript API 包装器 解决原生开发中机型适配的难题...优点 支持8个移动应用开发平台（Android，iOS，Windows，BlackBerry，Symbian，Bada，WebOS和Tizen） 可以利用传统的web开发技术(如HTML、CSS、 JavaScript...，无法在本地发布 IOS发布，需要将证书上传至服务器 参考资料 Phonegap VS AppCan 企业版和大众版主要有以下几点区别 开发环境： 企业版走独立的开发环境与打包环境，企业版配备macmini...优点 缺点 稍微延迟支持最新的平台更新 对开源库的访问受限 Xamarin生态系统不大的问题 需要有本地语言的基本知识 不适用于重图形应用程序 更大的应用程序大小 与第三方库和工具的兼容性问题 Flutter...优点 跨平台多前端应用开发，支持app、web和微信应用快速开发 高效精致的UI组件体系，完全基于主流标准和技术 本机API框架（Native APIFramework） 可视化拖拽式集成开发环境IDE

    9.5K20
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券