Week5

React practice

gitlab-->WebpackBebel-ReactDemo

Github连接不上：

ping www.baidu.com //网络连接正常
ping github.com //请求超时 ===> 怀疑DNS无法解析

解决方案：
手动查找可用的DNS域名：站长之家查询-选择TTL值最低的DNS域名

Screen Shot 2019-07-22 at 11.02.38 AM.png

打开hosts文件

sudo subl /etc/hosts

替换github dns域名

hosts文件.png

React Practice

props与state的区别：

props是组件间传递的一种方式，props也可以传递state。由于React的数据流是自上而下的，所以是从父组件向子组件进行传递；组件内部的this.props是只读属性！
state是组件内部的状态（数据），不能够直接修改，必须要通过setState来改变值的状态，从而达到更新组件内部数据的作用。

props和state是经常要结合使用的，父组件的state可以转化为props来为子组件传值。

css文件无法引入

考虑webpack打包问题

npm install --save-dev css-loader style-loader
webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader'],
      },
    ],
  },
};

file.js

import './file.css';

TDD 测试驱动开发

Given my bank account is in credit, and I made no withdrawals recently,
When I attempt to withdraw an amount less than my card’s limit,
Then the withdrawal should complete without errors or warnings
实践步骤：

1. 根据需求拆分Task
2. 根据每一项Task写对应test
3. 基于让test通过的原则编写实现代码，不做多余操作

TDD practice

https://github.com/Emma0s/TDD-parking