React Native是Facebook推出的一个开发IOS和安卓APP的技术.至于更多的详情,这里不再描述,大家可以自行百度它的定义. 原因:由于我想在一台电脑上同时开发IOS和Android两个APP,所以用的Mac. 这里就讲一讲我在搭建开发环境过程中遇到的坑,也为后面学习该技术的道友指一条坑少的路. 本文讲解的是,在Mac OS上,搭建IOS开发环境的步骤. Android篇,请移步:React Native 搭建开发环境(2)(Mac OS - Android项目篇) 1.安装Hom…
React Native v0.4 发布,自从 React Native 开源以来,包括超过 12.5k stars,1000 commits,500 issues,380 pull requests 和 100 贡献者,还有 35 款插件 和 1 个 AppStore 应用! 直击现场 <HTML开发MacOSApp教程>  http://pan.baidu.com/s/1jG1Q58M 此版本主要改进如下: 错误信息和文档:添加了大量的警告信息,更新了文档,修复了大量的 bug 兼容 NP…
因为工作需要,需要进一步了解移动端的开发,遂返回复习移动端的知识点,在开始学习之前,产生了疑惑WEB APP .Native APP .Hybrid APP.React Native.Uniapp.H5这些东西到底是什么?感觉是那么熟悉,单词拆分开每一个都认识,但是合在一起就完全不知道什么意思了,遂自行百度查询,自己解自己的惑吧. 个人博客,理解不具权威性. 一.WEB APP 通俗的理解,WEB APP 即为使用HTML.CSS.JS三大前端基础进行开发的WEB APP,是基于浏览器进行运行使…
React可大致分为三部分:Core.Reconciler和Renderer,在阅读源码之前,首先需要搭建测试环境,为了方便起见,本文直接采用了网友搭建好的环境,React版本是16.8.6,与最新版本很接近. 一.目录结构 React采用了由Lerna维护monorepo方式进行代码管理,即用一个仓库管理多个模块(module)或包(package).在React仓库的根目录中,包含三个目录: (1)fixtures,给源码贡献者准备的测试用例. (2)packages,React库提供的包的…
本文主要内容来自React官方文档中的"Thinking React"部分,总结算是又一篇笔记.主要介绍使用React开发组件的官方思路.代码内容经笔者改写为较熟悉的ES5语法. React--在我们看来,是用javascript快速开发大型web应用的捷径.这在Facebook和Instagram实践中得到了证实. 零 任务描述 假设我们已经拿到了一个蹩脚设计师给的设计稿: 从后端返回来的一组json数据包括商品类,商品名,价格和库存: [ { "category"…
上一期我们使用了React官方的脚手架运行React应用.大家可能会觉得这种方法很繁琐,需要配置各种第三方插件.JQuery时代的前端真是让人怀念.这一期,我就带领大家创建一个"怀旧版"的React应用. 一. 文件结构一览 这次项目的文件结构相当简单,一个index.html和scripts文件夹.在scripts放着必要的文件babel.min.js.react.development.js.react-dom.development.js.值得注意的是react提供了develo…
React 事件处理 建议:在了解 js 的 this 取值后食用更佳. 一.react 与 Html 中用法的异同和注意点 html 中的绑定事件的写法: <button onclick="activateLasers()"> // onClick = "xxxx()" 激活按钮 </button> react 中的写法: <button onClick={activateLasers}> // onclick = { xxxx…
  简单点的重复利用已有的dom和其他REACT性能快的原理. key的作用和虚拟节点 目前,前端领域中 React 势头正盛,使用者众多却少有能够深入剖析内部实现机制和原理. 本系列文章希望通过剖析 React 源码,理解其内部的实现原理,知其然更要知其所以然. React diff 作为 Virtual DOM 的加速器,其算法上的改进优化是 React 整个界面渲染的基础, 以及性能提高的保障,同时也是 React 源码中最神秘.最不可思议的部分, 本文从源码入手,深入剖析 React d…
React实现了一套与浏览器无关的DOM系统,包括元素渲染.节点查询.事件处理等机制. 一.ReactDOM 自React v0.14开始,官方将与DOM相关的操作从React中剥离,组成单独的react-dom库,从而让React能兼容更多的终端.在引入react-dom库后,就能调用一个全局对象:ReactDOM,虽然在之前的章节中已多次使用该对象,但是都没有给出过多的讲解,本节将对其做重点分析. ReactDOM只包含了unmountComponentAtNode().findDOMNod…
作者:Maxim Koretskyi 译文:Leiy https://indepth.dev/inside-fiber-in-depth-overview-of-the-new-reconciliation-algorithm-in-react/ React 是一个用于构建用户交互界面的 JavaScript 库,其核心机制就是跟踪组件的状态变化,并将更新的状态映射到到新的界面.在 React 中,我们将此过程称之为协调.我们调用setState方法来改变状态,而框架本身会去检查state或 p…