##作者简介 东方耀    Android开发   RN技术   facebook   github     android ios  原生开发   react reactjs nodejs 前端  进入 移动互联网    js nodejs    大波   app    个人角度   学习的必要性    全栈工程师的捷径 公司角度    组件化  成本降低  热更新 ##技术背景        app store     facebook   html5   native app     Hy…
先说一下我为什么学习RN 18年3月29号,随着自己内心的欲望和冲动,任务交接了一下,正式离开一家医疗公司.第二天就入职了这之前已经找好的公司,由于自己对代码浓厚的热情,自己终于也不再带团队.正好有充足的时间去学习和研究技术! 公司没有iOS,总监要求后期打算用React Native开发,why? —— no why.是的,是时候去学习React Native 了! 技术背景 关于RN的背景,相信大家都知道了. React Native (简称RN)是Facebook于2015年4月开源的跨平…
flexbox是Flexible Box的缩写,弹性盒子布局  主流的浏览器都支持 flexbox布局是伸缩容器(container)和伸缩项目(item)组成 Flexbox布局的主体思想是元素可以改变大小以适应可用空间,当可用空间变大,Flex元素将伸展大小以填充可用空间,当Flex元素超出可用空间时将自动缩小.总之,Flex元素是可以让你的布局根据浏览器的大小变化进行自动伸缩. 按照伸缩流的方向布局 伸缩容器有主轴和交叉轴组成! 主轴既可以是水平轴,也可以是垂直轴 flexbox目前还处于…
###伸缩项目的属性 1.order 定义项目的排列顺序,数值越小,排列越靠前,默认值为0,语法为:order:整数值 2.flex-grow 定义伸缩项目的放大比例,默认值为0,即表示如果存在剩余空间,也不放大,语法为:flex-grow:整数值 3.flex-shrink 定义伸缩项目的收缩能力,默认值为1 ,其语法为:flex-shrink:整数值 4.flex-basis 用来设置伸缩项目的基准值,剩余的空间按比率进行伸缩,其语法为:flex-basis:length | auto,默认…
###React简介 RN是基于React设计,了解React有助于我们开发RN应用: React希望将功能分解化,让开发变得像搭积木一样,快速而且可维护 React主要有如下3个特点: *作为UI(Just the UI) *虚拟DOM(Virtual DOM) 这是亮点  是React最重要的一个特性  放进内存   最小更新的视图 差异部分更新 diff算法 *数据流(Date Flow)单向数据流 学习React需要掌握哪些知识? *JSX语法   类似XML *ES6相关知识 *前端基…
React是由ReactJS与React Native组成,其中ReactJS是Facebook开源的一个前端框架,React Native是ReactJS思想在native上的体现! JSX并不是一门新的语言,仅仅是个语法糖,允许开发者在JavaScript中书写HTML语法.,最后每个HTML标签都转化为JavaScript代码来运行 1.环境 2.载入方式 3.标签  HTML标签 与  ReactJS创建的组件类标签(首字母一定要大写) 4.转换 解析器 `<h3>输入</h3&…
用HTML5和React Native分别实现盒子模型显示 写法不一样: 1.样式 ![样式不同](http://image17-c.poco.cn/mypoco/myphoto/20160323/00/17351665220160323002240032.png?854x367_130) 2.元素 ![元素不同](http://image17-c.poco.cn/mypoco/myphoto/20160323/00/17351665220160323002422011.png?1468x163…
React Native 的宗旨是,学习一次,高效编写跨平台原生应用. 在Windows下搭建React Native Android开发环境 1.安装jdk 2.安装sdk    在墙的环境下,为了速度我选择了使用http://androiddevtools.cn/ 3.安装C++环境 择Windows SDK.cygwin或mingw等其他C++环境.编译node.js的C++模块时需要用到. 4.安装Node.js与Git Node.js 是一个基于 Chrome V8 引擎的 JavaS…
1.创建阶段 getDefaultProps:处理props的默认值 在React.createClass调用 2.实例化阶段 React.render(<HelloMessage 启动之后 getInitialState.componentWillMount.render.componentDidMount state:组件的属性,主要是用来存储组件自身需要的数据,每次数据的更新都是通过修改state属性的值,ReactJS内部会监听state属性的变化,一旦发生变化的话,就会主动触发组件的r…
ReactJS核心思想:组件化  维护自己的状态和UI  自动重新渲染 多个组件组成了一个ReactJS应用 React是全局对象   顶层API与组件API React.createClass创建组件类的方法 React.render渲染,将指定组件渲染到指定DOM节点 render:组件级API,返回组件的内部结构 React.render被ReactDOM.render替代 ##7.配套视频(下载地址):https://yunpan.cn/cYNfQsCXm3byY  访问密码 cf7f…