React Native创建一个APP

React Native 结合了 Web 应用和 Native 应用的优势,可以使用 JavaScript 来开发 iOS 和 Android 原生应用。在 JavaScript 中用 React 抽象操作系统原生的 UI 组件,代替 DOM 元素来渲染等。

React Native代码框架示例下载:https://github.com/facebook/react-native

1.首先下载安装nodejshttps://nodejs.org/en/

2.然后推荐使用Homebrew 的方式来安装 nvm,watchman 和 flow:

  • 先安装homebrew(参考官网):ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
  • brew install nvm
  • brew install watchman
  • brew install flow
  • brew install node

建议定期运行 brew update && brew upgrade 来使您的应用程序保持最新状态

3.安装react native命令 : sudo npm install -g react-native-cli

4.创建react native项目:

在终端,找到你希望保存的项目文件,然后运行命令:react-native init BookSearch

5.打开BookSearch下的ios启动文件,用xcode打开再运行,会出现以下画面

6.编辑index.ios.js里的代码,也可以额外在其目录添加其他js文件,进行代码编写。

7.关于react native 还是需要多敲代码去熟悉,冰冻三尺非一日之寒。

时间: 2024-10-22 07:29:33

React Native创建一个APP的相关文章

用React Native编写跨平台APP

用React Native编写跨平台APP React Native 是一个编写iOS与Android平台实时.原生组件渲染的应用程序的框架.它基于React,Facebook的JavaScript的库,为的是构建用户接口,而并不是以浏览器为目标,它是以手机平台为目的. 换句话说,假设你是一个web开发人员,你能够使用React Native去编写干净.高速的移动APP,而且能够体会到熟悉的框架和单个的JavaScript的代码库. 在这之前,我们已经听到用诸如Cordova或者是Titaniu

Hybrid APP基础篇(二)->Native、Hybrid、React Native、Web App方案的分析比较

说明 Native.Hybrid.React.Web App方案的分析比较 目录 前言 参考来源 前置技术要求 楔子 几种APP开发模式 概述 Native App Web App Hybrid App React Native App 分析 各大开发模式直观对比 如何选择开发模式 另类的app方案 微网页 微信小程序 其它 前言 参考来源 前人栽树,后台乘凉,本文参考了以下来源 对当前主流hybrid app.web app与native app工具的初步比较与分析 H5.React Nati

diango创建一个app

创建一个app terminal里执行命令 python manage.py startapp app名称 注册 settings配置 INSTALLED_APPS = [ 'app01', 'app01.apps.App01Config' # 推荐写法 ] 原文地址:https://www.cnblogs.com/-xct/p/12069409.html

React Native电商项目实战混合APP开发 React Native实战 混合APP实战开发

React Native  和 angular+ionic 是目前网络上最火的混合APP开发语言,其功能强大能够开发出安卓和IOS程序! ------------------课程目录------------------ <React Native电商项目实战>├<01React Native初体验>│  ├01-React Native简介.mp4│  ├02-React Native环境搭建.mp4│  ├03-React Native初体验及其它环境搭建.mp4│  └04-R

React Native ——实现一个简单的抓取github上的项目数据列表

/** * Sample React Native App * https://github.com/facebook/react-native */ 'use strict'; var React = require('react-native'); var { AppRegistry, StyleSheet, Text, Image, View, TextInput, ListView, } = React; var GIT_URL = 'https://api.github.com/sea

01.正式进入状态的ionic第一天 使用cmd创建一个app项目

个人总结: 在安装nodejs 和 cordova的前提下 使用CMD打开自己创建的目录后 ionic start myApp tabs   //创建带有top栏和bottom栏的示例项目 ionic start myApp sidemenu  //创建带有左侧带有menu栏的示例项目 ionic start myApp blank   //创建空白项目 必须用cmd到应用的目录下才能正确添加安卓等: ionic platform add android --------------------

react native Xcode打包app发布ipa到蒲公英

1.找到react native 项目,用Xcode打开项目,如下图 2.确保运行的选项如下图这个: 3.确保苹果开发者的证书,有则可以直接打包,没有的话需要到苹果开发者官网添加证书并且下载放入本地,具体可看下一篇教程专门介绍登录苹果开发者网站 http://developer.apple.com,进入到证书配置生成后台,本文介绍有证书的情况下打包 4.查下如下: 查看run选择的模式, 4.然后开始打包,如下操作: 点击archive后默认都下一步 导出如下选择: 其余的都点默认的下一步,最后

React Native 中设置 APP 名称、应用图标

修改名称 应用程序的名称默认是使用 react-native-cli 创建项目时的名称.修改的方式很简单,找到相应的配置然后修改即可.例如,我初始化的项目名称叫 test,现在想修改成 测试程序. Android 编辑 android/app/src/main/res/values/strings.xml 文件: <resources> 原始   <string name="app_name">test</string> 修改    <stri

React Native创建项目等待时间长解决

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Verdana; color: #ff6600; background-color: #ffffff } p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Verdana; color: #333333; background-color: #ffffff } span.s1 { } 1. 初始化工程 在终端输入命令 :react-na