第一个React Native项目

1>下图操作创建第一个React Native项目:

用Xcode运行界面如下:

记住: 在使用项目文件期间,终端记住不要关闭的哟!!!

改变了程序代码,需要刷新运行,使用快捷键: Command+ R,我都是在mac下的操作哟,安卓我就不涉及记录了,毕竟我不是搞安卓的...??

2>

使用WebStrom软件进行敲代码啦....启动编译有点慢,耐心等待哟!!!

看左边的文件夹所示:

Android : 表示安卓项目的文件夹;

iOS : 表示iOS项目的文件夹;

node_modules : 表示node组件;

package.json :就相当于iOS的plist文件

时间： 2024-08-04 09:48:10

第一个React Native项目的相关文章

【腾讯Bugly干货分享】React Native项目实战总结

本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/577e16a7640ad7b4682c64a7 "8小时内拼工作,8小时外拼成长"这是大家共同的理想.除了每天忙于工作外,我们都希望能更多地区吸收领域内的新知识与新技能,从而走向人生巅峰. Dev Club 是一个交流移动开发技术,结交朋友,扩展人脉的社群,成员都是经过审核的移动开发工程师.每周都会举行嘉宾分享,话题讨论等活动. 上一期我们邀请了腾讯SNG工程师&qu

Expo大作战--针对已经开发过react native项目开发人员有针对性的介绍了expo，expo的局限性，开发时项目选型注意点等

简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo依赖,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人修改补充+demo测试的形式,对expo进行一次大补血!欢迎加入expo兴趣学习交流群:597732981 [之前我写过一些列关于expo和rn入门配置的东i西,大家可以点击这里查看:从零学习rn开发] 相关文章: Expo大作战--什么是expo,如何安装expo clinet和xde,xde如何

安装android Studio和运行react native项目（基础篇）

ANDROID_HOME环境变量 确保ANDROID_HOME环境变量正确地指向了你安装的Android SDK的路径. 打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量 -> 新建 具体的路径可能和下图不一致,请自行确认. 你需要关闭现有的命令符提示窗口然后重新打开,这样新的环境变量才能生效. 测试安装 react-native init AwesomeProject cd AwesomeProject react-nativ

DECO 一个REACT NAtive 开发IDE工具

DECO 一个REACT NAtive 开发IDE工具. 目前只支持 OS,NO WINDOWS https://www.decosoftware.com/ 一个方便的快速 ERXPRESS 教程:http://www.reactnativeexpress.com/    配套学习.

React Native 项目结构及运行分析（HelloWorld）

********************  RN开发环境搭建完成后,总会来一个“HelloWorld”嘚瑟一下.******************** 参考资料:http://v.youku.com/v_show/id_XMTQ4OTYyMjg4MA==.html 1.创建HelloWorld (一个很恶心的地方就是:每次都得用终端输入替换镜像源的两个命令,要不然就得悲催的傻等) 2.成功后,会在根目录生成HelloWorld的工程. package.json 文件 A.name和versio

第一个React Native程序踩到的那些坑

毫不夸张的说用React Native写一个Hello World !程序是我碰到最复杂的Hello World.网络上的有关的环境搭建相关的文档也很多,但是总是有这样那样的问题. 官方中文版的安装文档,windows环境搭建文字教程 原因可能有3个: 1. 这个东西最早还是在Mac机上开发的,可能支持的会好一点,windows平台时间短. 2. 网络被墙或不稳定,注册npm淘宝镜像会快很多,但是不能完全解决问题. 3. 版本问题,Nodejs版本.React Native 版本.Android

React Native项目实战

算是学习React Native的一次项目总结吧,目的还是提高自己. 包含的内容: 1>仿"美团"页面的实现; 2>封装项目中和自己常用的一些组件; 3>学习别人源码的项目,自己动手实现了一遍,里面添加自己的代码规范; 4>第三方开源库的使用; 5>添加项目中常见的功能和界面的实现<后面持续更新!> 传送门: https://github.com/PengSiSi/PSMeiTuan 暂时没有添加README.md,后续添加... 有兴趣的和我

组装者模式在React Native项目中的一个实战案例

前言 在实际的开发中,如果遇到多个组件有一些共性,我们可以提取一个BaseItem出来,然后在多个组件中进行复用,一种方式是通过继承的方式,而今天我们要说的是另一种方式--组装者模式. 什么是组装者模式? 就是在一个类中封装一些共有特性,然后使得在使用的组件中,可以动态的去添加一些属性或者行为,相比较于继承来说,组装者模式会更加的灵活. 实例演示 /** * AboutCommon.js * 组装者模式 模仿一些生命周期函数 */ export default class AboutCommon

react native项目增加devtools工具

第一步:安装react devtools工具 在当前项目中打开命令行,添加react devtools工具,因为运行的工具有九十几M,下载时需要时间,请耐心等待 yarn add react-devtools 第二步:配置package.json中命令 编辑package.json文件,在scripts节点中增加devtools节点,命令为 "devtools": "react-devtools" 第三步:运行react devtools命令 1.正常运行项目,使用