链接到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 / something。
第二个应用程序的唯一职责是连接到MySQL数据库并公开第一个应用程序可以调用和使用的必要api。

正当化（仅举几例）：
您希望这两个应用程序独立运行并尽可能地可重用。
如果一个应用程序关闭，则其他应用程序不应受到影响。
不同的团队可以使用不同的应用程序，而不是全部都使用同一应用程序。