So there is a disconnect between React, and your database technology in regards to “getting them to work together”.
Practically speaking you can’t use these directly together. You could use them in the same project, but you need to make more choices and build out more of the setup.
For starters React normally is used as a library to manage updating the DOM within a client-side app. You could use it in other scenarios like to build mobile UI’s, or use it on the server-side similar to that of a template engine, but the end general use-case for React is just a fancy way to manage how what the user sees.
MySQL is a database that can be used to store data.
The “disconnect” and key part that is missing is the server-side code.
The way a traditional “stack” works for a web-app (with or without React) is you have your database MySQL, and server-side language, say Python or Node.js, that then connects to your database and access the data, provides security and buisness logic and interfaces with the end-user either directly or indirectly.
The “interfaces with end-user” is where React could come in, either via running on their browser as is usually the case, or using something else entirely. Regardless the server-side acts as the “interface” with your database and essentially is the core place to have your buisness logic. Stuff like “which users could access which data? How is data saved, optimized?” is all stuff your server-side would need to manage.
From there the server-side could serve data to your React app, which by itself can’t access the database, and must go through your server-side code via HTTP calls using something like REST via
fetch. Only then could you now leverage your React code+ data from your database, which again could be manipulated via your server-side how you see fit.
Finally there’s webpack, which is just a tool that can help you build your React code. React naturally is written in a different format like
jsx, which makes it easier to work with, but isn’t understood by browsers. As such React is usually ran through a “build-step” to optimize the code you write for end user consumptions, and then served as static file bundles.
I wouldn’t recommend using webpack at all, and use something like
create-react-app which abstracts away a lot of this, as it uses webpack under the hood and provides a bunch of other functions out of the box.