Preface

Every day I have to live, and I can’t give up every day. I have recently started to learn the background management system of UMI/DVA/ANTD. , Introduce the main line directly, the main line below is the construction of ATD-PRO;

Preparation

Create umi

Create Antd-PRO or DVA project scaffolding

dva

DVA first is a data flow solution based on Redux and Redux-Saga. 
 Then in order to simplify the development experience, the DVA also built up the React-Router and FETCH, 
 So it can also be understood as a lightweight application framework.

umi

UMI, Chinese pronunciation is Umi, which is an scalable enterprise -level front -end application framework. UMI is based on routing, 
 At the same time, the configuration routing and agreed routing are supported to ensure the complete function of the routing and expand the function. 
 Then with a comprehensive plug -in system for life cycle, covering each life cycle from the source code to the construction of the product, 
 Support various functional expansion and business needs.

text

1. Use Create UMI to run Create UMI under the project file

npm create umi

2. Select Antd-PRO

3. Select TS/JS (it is better to use JS for novice)

4. Use Ant4?

5. Enter the created project, and then use CNPM Install and then NPM Start

6. Last effect

Key file

config/config.js 
 For the configuration file of the project, please refer to the configuration page of UMI for details. 
 Internal routing module: routes 

 src/models 
 DVA's Model file placement land 

 sRC/PAGES 
 Business code page

Running process

Mainly look at UMI's documents to understand what the modules are responsible for

Reference materials

Create UMI’s NPM address

DVA address

umi address