React

React 初学者教程 1:React 简介

今天的 Web 应用程序除了外观比过去更好看以外,应用程序的架构和创建方式已经和过去有很大的不同。这是一个简单的商品目录浏览应用程序,它和这种类型的其它应用程序一样,通常包含一个主页、一个搜索结果页、一个详情页等等。

React动画的基础知识

由于 React 加持了虚拟 DOM 等诸多特性,所以在 React 上实现常规的动画效果有一些特别之处。本文不会深入探讨 React 对动画的处理逻辑,只会简单地演示如何在 React 创建动画效果,因为我也没有做过线上的 React 动画实例,谨以此文抛砖引玉,算是最基础的入门了解。

React 组件构造方法: ES5 (createClass) 还是 ES6 (class)?

写 React 组件的时候,应该使用 React.createClass 语法还是 ES6 的 class 语法?或两者都不?这篇文章解释了两者之间的一些差异,希望能帮你做决定。用 ES5 或 ES6 都可以完美地写 React 组件。使用 JSX 意味着你已经需要一个「构建」步骤,也就是 Babel 将 JSX 转译(transpile)为 React.createElement 调用。很多人充分利用这点, 仅仅向 Babel 的转译列表中添加一项 es2015,就可以自由使用 ES6 的全部特性。

React的一些概念

对于初学React的同学而言,这并不是一件易事。就拿我自己来说,都不知道从何下手,应该如何去学习才能开始使用React。就算你对React不陌生,学习React也常会碰到一些瓶颈。比如说新颖的概念、开发工具的使用、抽象的名词、快速变化的生态环境等等。也就是说,一旦开始学习React,你会发觉要学的东西越来越多,甚至可能还没开始碰到React就被这些东西给吓跑了(特别是对于初学者,听到这些东东就傻眼了)。

React几种基本配置方案

对于没有使用过React的同学总觉得它复杂,但在现实中,使用React并不困难。就我个人而言,学习React应该基于创建项目特定类型的设置细节之上(比如Webpack、Redux、ES6、JSX、Babel等),而不是一下子就去忙于理解所有的设置项。在这篇文章中列出了有关于React方面的七种设置。大部分的设置我都将会向大家展示,但总的来说,这并不困难。接下来的内容从简单到复杂,介绍React的设置。

开始使用React和JSX

React是一个用来创建用户界面的一个开源库。它可以让你轻松的创建与底层数据模块保持一致的UI。这篇文章主要针对初学者,包括了React的基本知识和JSX语法。或许,开始使用React最简单的方法就是从CDN中引入一个库(文中的例子是这样做的)。或者你可以使用npm来安装或者从官方网站下载React运行所需要的文件。

CSS Modules 详解及 React 中实践

CSS 是前端领域中进化最慢的一块。由于 ES2015/2016 的快速普及和 Babel/Webpack 等工具的迅猛发展,CSS 被远远甩在了后面,逐渐成为大型项目工程化的痛点。也变成了前端走向彻底模块化前必须解决的难题。

页面

返回顶部