React and Docker

让我们将 React App 容器化。

React Forms

本节，我们创建一个功能组件来添加用户。

添加两个文件：

touch services/client/src/components/AddUser.jsx
touch services/client/src/components/__tests__/AddUser.test.jsx

Testing React

Create React App 默认使用 Jest 进行测试，所以我们可以开始编写测试规范,而无需安装跑步。与 Jest 一起，我们将使用 Enzyme ，这是一个专门用于测试 React 组件的出色实用程序库。

安装 enzyme-adapter-react-16 ：

$ yarn add enzyme enzyme-adapter-react-16 -D

React Setup

让我们将注意力转向客户端并添加 React 。

React 是基于组件的 JavaScript 库，用于构建用户界面。

如果您是一个 React 新手，请了解 tutorial 和 Why did we build React?。您也可能一步步通过 Intro to React 教程来学习 Babel 和 Webpack 。

Flask Debug Toolbar

本节讲解 Flask调试工具栏 。

Flask Debug Toolbar 是一个 Flask 扩展，可以帮助您调试应用程序。它在视图中添加了一个调试工具栏，它提供有关 HTTP 标头，请求变量，配置设置以及呈现特定视图所需的 SQLAlchemy 查询数的信息。您可以使用此信息来查找视图呈现中的瓶颈。

Continuous Integration

本节，我们通过 Travis CI 将持续集成添加到项目中。

Code Coverage and Quality

本节，我们通过 Coverage.py 将代码覆盖添加到项目中。

Introduction

在第2部分中，我们将添加代码覆盖率和持续集成测试，以确保每个服务都可以独立运行和测试。最后，我们将把 React 和 Jest（一个 JavaScript 测试运行器）和 Enzyme（一个专门为 React 设计的测试库）添加到客户端。

Structure

• 官方的源代码 Part 1: https://github.com/testdrivenio/testdriven-app-2.3/releases/tag/part1

• 我的源代码 Part 1：https://github.com/keer2345/testdriven-app/tree/part1

Workflow

Aliases

我们创建两个命令的别名：
~/.bashrc:

alias dc='docker-compose'
alias dm='docker-machine'

$ source ~/.bashrc