React 环境备忘

Submitted by Lizhe on Wed, 08/01/2018 - 15:05

https://github.com/Microsoft/vscode-eslint

20180801030917

{

"window.zoomLevel": 0,

"workbench.statusBar.feedback.visible": false,

"update.channel": "none",

"update.enableWindowsBackgroundUpdates": false,

Kubernetes (1)

Submitted by Lizhe on Wed, 08/01/2018 - 14:50

Kubernetes 不局限于任何一种语言, 服务可以毫无困难的映射为Kubernetes的service , 通过TCP进行交互

Service 是分布式集群架构的核心, 一个Service对象拥有如下关键特征

拥有一个唯一指定的名字

拥有一个虚拟IP和端口号

能够提供某种远程服务

被映射到了提供这种服务能力的一组容器应用上

 

一个Pod是一个容器环境下的“逻辑主机”,它可能包含一个或者多个紧密相连的应用,这些应用可能是在同一个物理主机或虚拟机上。

Pod 的context可以理解成多个linux命名空间的联合

  • PID 命名空间(同一个Pod中应用可以看到其它进程)
  • 网络 命名空间(同一个Pod的中的应用对相同的IP地址和端口有权限)
  • IPC 命名空间(同一个Pod中的应用可以通过VPC或者POSIX进行通信)
  • UTS 命名空间(同一个Pod中的应用共享一个主机名称)

 

ES6 map, filter

Submitted by Lizhe on Thu, 07/12/2018 - 17:27

  test = () => {

    var data = [1, 2, 3, 4];

    var arrayOfSquares = data.map(function(item) {

      return item * item;

    });

    console.log(arrayOfSquares);

  };

test = () => {

    var data = [0, 1, 2, 3];

    var arrayFilter = data.filter(function(item) {

React 通过 storybook 进行单元测试

Submitted by Lizhe on Mon, 07/09/2018 - 15:09

安装下面的包

  382  npm install --save @storybook/react

  383  npm install --save @storybook/addon-actions

  384  npm install --save @storybook/addon-links

  385  npm install --save @storybook/addons

在package.json平级目录下放置.storybook文件夹

/Users/lizhe/Documents/DEV/projects/es6/study/app/.storybook

文件夹内放置文件

/Users/lizhe/Documents/DEV/projects/es6/study/app/.storybook/config.js

React recompose

Submitted by Lizhe on Thu, 07/05/2018 - 14:59

recompose 模块可以帮助"提升"很多无状态的模块

you take a stateless component, and without creating any class, you enhance it to provide a state and your return the new component, that is "enhanced".

安装

npm install --save recompose

说明文档

https://github.com/acdlite/recompose/blob/master/docs/API.md#withstate

import React, { Component } from "react";

git pull request 入门

Submitted by Lizhe on Tue, 07/03/2018 - 10:52

向目标项目提交需要遵循以下步骤

1. fork目标项目到你本地

2. clone你本地项目

3. 修改本地代码, 然后commit和push, 这些都是到本地

4. 然后去网页new pull request

如果要从目标项目更新到本地

1. 将目标项目添加为远程库 git remote add upstream git@github.com:pactera-admindev-lizhe/Test.git

-t branch

2. 然后可以看到远程库

lizhedeMacBook-Pro:Test lizhe$ git remote -v

origin https://github.com/zl86790/Test.git (fetch)

origin https://github.com/zl86790/Test.git (push)

upstream git@github.com:pactera-admindev-lizhe/Test.git (fetch)

javascript flow checker

Submitted by Lizhe on Fri, 06/29/2018 - 13:11

Setup:
Run npm install flow-bin to add Flow package 

Update package.json file to add "flow": "flow" inside the scripts section
Initialize Flow: npm run flow init (it will generate a .flowconfigfile at the root level) 

Check if Flow is working by running: npm run flow

ES6 拾遗(9)

Submitted by Lizhe on Thu, 06/28/2018 - 10:14

Module

ES6模块不是对象, 而是通过export命令显示指定输出的代码, 再通过import命令输入

ES6 模块

import { stat, exists, readFile } from 'fs';

上面代码的实质是从fs模块加载3个方法, 而不加载其他方法. 
这种加载被称为 编译时加载 或者 静态加载, 即ES6 可以在编译时就完成模块加载, 效率比CommonJS模块的加载方式高. 
当然这也导致了ES6模块本身无法被引用, 因为它不是对象

export命令

模块功能主要又两个命令构成 export和import.

export命令用于规定模块的对外接口, import命令用于输入其他模块提供的功能.

一个模块就是一个独立的文件. 该文件内部的所有变量, 外部无法获取. 如果希望外部能够读取内部某个变量, 就必需使用export关键字输出改变量

ES6 拾遗(8)

Submitted by Lizhe on Wed, 06/27/2018 - 16:39

Class的基本用法

1. class表达式

直接通过class定义肯定没有错

20180627044450

class也可以使用表达式的形式定义, 类似函数

下面的代码中, 这个类的名字是MyPoint而不是Point, Point只在class内部的代码可用, 代指当前类