alwayrun alwayrun

用例子讲解 RxJS 5 的 Operators 。

原文链接：RxJS 5 Operators By Example by @btroncone

Comprehensive Introduction to @ngrx/store

By: @BTroncone

Also check out my lesson @ngrx/store in 10 minutes on egghead.io!

Update: Non-middleware examples have been updated to ngrx/store v2. More coming soon!

Table of Contents

Usage

npm install babel-loader imports-loader webpack --save
Create webpack.config.js
Move index.ios.js to src/index.ios.jsx
webpack --watch

Example

`src/index.ios.jsx`

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;
}

video /deep/ input[type=range] {

React (Virtual) DOM Terminology

In React's terminology, there are five core types that are important to distinguish:

ReactElement / ReactElement Factory
ReactNode
ReactComponent / ReactComponent Class

React Elements

	#!/usr/bin/env node

	const NKEYS = 4;

	function arrayOfSize(size) {
	var a = Array(size);

	for (var i = 0; i < size; i += 1)
	a[i] = null;

	# --------
	# Hardware
	# --------

	# Opcode - operational code
	# Assebly mnemonic - abbreviation for an operation

	# Instruction Code Format (IA-32)
	# - Optional instruction prefix
	# - Operational code

	.
	├── actions
	├── stores
	├── views
	│ ├── Anonymous
	│ │ ├── __tests__
	│ │ ├── views
	│ │ │ ├── Home
	│ │ │ │ ├── __tests__
	│ │ │ │ └── Handler.js