此文章是翻译How to develop apps bootstrapped with Create React App 官方文档
由于原文太长了,因此将此翻译文章将分成四个部分:
- 如何开发由Create-React-App 引导的应用(一)
- 如何开发由Create-React-App 引导的应用(二)
- 如何开发由Create-React-App 引导的应用(三)
- 如何开发由Create-React-App 引导的应用(四)
上述每个部分最多包含10 个目录,其中包含的相关目录如下所示:
此文章是翻译How to develop apps bootstrapped with Create React App 官方文档
由于原文太长了,因此将此翻译文章将分成四个部分:
上述每个部分最多包含10 个目录,其中包含的相关目录如下所示:
Storybook 是React 组件UI 开发环境,其作用在于让前端工程师专注在样式、组件功能的开发过程
中,不必担心应用程序特定的依赖关系和环境准备。
1 | npm i -g getstorybook |
A-Frame 是构建虚拟现实体验的web 框架。此框架由Mozilla VR 发起,目的是使WebVR 内容的创建更容易、更快速、更易于访问。A-Frame 是自由开源的同时拥有一个深受欢迎的社区以及蓬勃发展的工具和组件生态系统。
此雪碧图组件(源码)就是A-Frame 生态中实现的一个组件,雪碧图是制作预渲染动画的常用方法,而该组件可以将雪碧图加载到<a-frame>
元素,从而在A-Frame 中来进行动画控制。
首先我们了解一下雪碧图组件在A-Frame 中的安装以及使用,最后就再根据源码来对此流程图进行分析
在线GitBook 地址:https://jobbym.gitbooks.io/react-docs-zh-cn/
英文原版:https://facebook.github.io/react/docs/installation.html
React 中文文档主要是JobbyM 根据React 官网进行翻译,其官网版本为v15.4.0。
如果你想参与这本书的共同创作,修改或添加内容,可以先Fork 这本书的仓库,然后将修改的内容提交Pull requests;或者创建Issues。
更多详细信息请参考React 中文文档
GitBook 安装完毕只需要几分钟就可以了。
此文章是翻译Setup and Installation of Gitbook这篇GitBook官方文档。
GitBook.com 是一个易于书写、出版和托管数据的解决方案。它是发布内容和协作的最简单的解决方案。
它很好的结合GiBoook Editor
主要是介绍一些使用js 来获取元素的CSS 样式的方法
一、style
我们可以使用element.style
获取元素的CSS 样式声明对象,以及设置元素的CSS 样式声明对象。
注意:element.style
只能获取元素style
属性中的CSS 样式。
1 | <style> |
双飞翼布局是上一篇文章CSS布局之圣杯布局的改进,圣杯布局中用到了浮动(float
)、负边距(margin
)和相对定位(position:relative
),不添加额外的标签。而双飞布局需要用到(float
)、负边距(margin
)、添加额外的标签,没有用到相对定位(position:relative
)。
圣杯布局是一种包括页眉、页脚和一个包含两个左右边栏的主内容区的网页布局。其布局遵循以下规则:
1. https://github.com/Okazari/Rythm.js
一个可以使也页面跳动的js库。
此文章是翻译Higher-Order Components这篇React(版本v15.4.0)官方文档。
高阶component(HOC)在React 中是一个复用component 逻辑的高级技术。HOC 自身不是React API 的一部分。它们是从React 组合性质中出现的模式。
从概念上来说,高阶component 是一个接受一个component 并返回一个新component的函数。
1 | const EnhancedComponent = higerOrderComponent(WrappedComponent); |
鉴于component 转换props 为UI,高阶component 转化一个component 为另一个component。
HOC 在React 第三方库中是常见的,就像Redux 的connect 和Relay 的createContainer。
在文档中,我们将讨论高阶component 为什么有用,以及你自己如何去写。