链接到 Express 反应而不创建反应应用程序

Question

我只知道 react 和 node JS express 包，所以我需要帮助。也许这个问题已经有人问过了，但我个人并没有发现同一个堆栈的同一个问题。 问题如下：

如何将 Express 中的查询链接到 React 组件中的 MySQL 数据传输 我为 webpack、babel 做了一些初始设置，现在组件被赋予 request/，但我知道你需要通过代理链接 react 和 express，因为该技术用于 create-react-app。

这是我的应用程序的树形结构：

webpack.config.js：

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.join(__dirname, "/dist"),
    filename: "bundle.js"
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: ["babel-loader"]
      },
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"]
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "./src/index.html"
    })
  ]
};

.babellrc:

{
  "presets": ["@babel/preset-env","@babel/preset-react"]
}

express.js：

const path = require('path'),
      express = require('express'),
      bodyParser = require('body-parser'),
      cookieParser = require('cookie-parser'),
      app = express(),
      mysql = require('mysql2');

const conn = mysql.createPool({
    host: 'localhost',
    user: 'root',
    database: 'internet_magazine',
    password: 'Plmoknn1605',
    port: '3306'
});

app.get("/", (req, res) => {
    conn.query('select * from table', (err,result) => {
       // how to pass data to react component and return it with this data 
    });
});

PS。很可能，我做错了什么，但我自己无法弄清楚，所以我很乐意得到任何帮助

Answer 1

我个人会将项目一分为二：
第一个应用程序只是简单的反应，并会在需要时从它调用必要的 API。在需要调用的地方使用 js fetch/axios/其他东西。
第二个应用程序，其唯一职责是连接到 MySQL 数据库并公开第一个应用程序可以调用和使用的必要 API。

理由（仅举几例）：
您希望这两个应用程序独立运行并尽可能可重复使用。
如果一个应用程序出现故障，其他应用程序不应受到影响。
不同的团队可以开发不同的应用，而不是全部开发同一个应用。