[東彬娜]反応を使用して顧客管理システムを作成-01

写真のdevの内容に応じてcdcustomer Managementフォルダで糸devを実行し、両方とも実行できます.
[ノードjsサーバコード]

sudo npm -g install nodemon
sudo npm install -g concurrently
yarn dev

================================================================================================================

開発通知顧客リストのRest API：

ほとんどのWebサーバフレームワークの基本的なサポート機能として、サーバとクライアントは、Webプロトコルに基づいて効率的にデータを交換することができます.


jsonlint:正しいjsonフォーマットであることを確認
https://jsonlint.com/
====================================================================
propsには変化の余地はなく、stateには変化の余地があります
ハードコーディングに置き換えられた部分api

[stateを追加しました.使用部分にthis.stateを追加してください]

==============================================================================================================

サーバがapiを要求するときに応答が遅い場合、ロードメッセージが表示されます。

import CircularProgress from '@material-ui/core/CircularProgress';

const styles = theme => ({
  progress: {
    margin: theme.spacing(2)
  }
})

class App extends Component {
  state = {
    customers: "",
    completed: 0,
  }
  
  progress = () => {
    const { completed } = this.state;
    this.setState({ completed: completed >= 100 ? 0 : completed + 10 });
  }
  
  render() {
    <TableRow>
      <TableCell colSpan="6" align="center">
        <CircularProgress className={classes.progress} value={this.state.completed} />
      </TableCell>
    </TableRow>
  }
}

export default withStyles(styles)(App);