React Express Web Framework (Node.js/JavaScript) React + Antd

Demo

• (admin|password)
• CRUD
• CRUD
• CRUD
• CRUD

 api                 - 
  config          - 
  controllers     - API
  models          - 
  routes          - 
  views           - 
 client              - 
  src
   store       -  Context API
|     modules     - 
|     components  - 
|     utils       - 

// api
cd api
// 
npm install
// 
npm start
//   pm2 
pm2 start ./bin/www

// client
cd client
// 
npm install
// 
npm start
// 
npm run build

api

res.render RESTful API

api/app.js

var cors = require("cors");
...
app.use(cors());

React NodeExpress CORS

MongoDB MongoDB atlas 500MB MongoDB

MongoDBReactNode ExpressMERN

client

creat-react-app + antd + ts + use-hooks

API

• axios post Error
• api process.env.NODE_ENV
• hooks promise useAsync

Nginx

host

    server {
        listen       80;
        server_name  api.jokingzhang.com;
        # root         /usr/share/nginix/html;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

        # API
        location / {
            proxy_set_header X-Real-IP $remote_addr;
            proxy_pass http://<your-host>:4001/;
        }

        # API
        location /demo-library/ {
            proxy_set_header X-Real-IP $remote_addr;
            proxy_pass http://<your-host>:5001/;
        }

        error_page 404 /404.html;
            location = /40x.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }

    server {
        listen       80;
        server_name  demo-library.jokingzhang.com;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
        # index index.html index.htim;

        location / {
                root /develop/express-locallibrary-tutorial/client/build;
                index index.html;
                try_files $uri $uri/ @router;
                autoindex on;
        }

        location @router{
            rewrite ^.*$ /index.html last;
        }

        error_page 404 /404.html;
            location = /40x.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }