Reactjs Connection With Database

React js connect to database

Move important MySQL to the top of the import statements. May be require is not working for you

    import mysql from 'mysql';

And also make sure always super should be the first line in constructor

Updated code:

   import React, { Component } from 'react';
   import mysql from 'mysql';
   class Users extends Component {
       constructor(props){
           super(props);
           const connection = mysql.createConnection({
           host: 'localhost',
           user: 'root',
           password: '',
           database: 'react_prac'
        });
       connection.connect();
       console.log(connection);
    }

render() { 
    return (  
        <div>
            DB
        </div>
    );
   }
 }

 export default Users;

Update:

  It seems DB connection is not possible from front end. It should be done in the backend, for better understanding check this answer

Error in MySQL library for Node.js

React: Trying to connect index.js to database but its not working

I think you have an error in your code but you are not showing it as you don't test in err variable, try this code in order to show what error you are getting:

const express = require('express');
const app = express();
const mysql = require('mysql');

const db = mysql.createPool({
  host: "localhost",
  user: "root",
  password:"password",
  database:'CRUDDatabase',
});

app.get('/', (req, res) => {
  const sqlInsert = "INSERT INTO Movie_Reviews(movieName, movieReview)       VALUES (1,'inception', 'good movie');" 
  db.query(sqlInsert, (err, result) =>{
    if(err) {
       console.log(err);
       res.send(err.toString()); 
    }
    res.send("change done");
  });
})

app.listen(3001, () => {
  console.log("running on port 3001")
})

How to connect MySQL database to ReactJS app?

You can't connect them directly.

JavaScript running in a web browser cannot speak the MySQL protocol (nor can it make raw network connections that would be needed to write an implementation in JS).

Instead, create a web service (in the programming language of your choice, which could be JavaScript running on Node.js (e.g. the code you have already + Express.js + some glue)) and use Ajax to communicate with it.

How to connect not to local MySQL db (PHPMyAdmin) by using React.js?

Ok, the problem that it's not possible with online database and localhost of React.js. For connection I had to download .sql database, insert and run it locally with XAMPP control panel.

How to mysql database connection with react js

In app.js at the backend folder that is like server.js in the backend that you made add these code :

const mysql = require('mysql');
const connection = mysql.createConnection({
host: 'localhost',
user:'root',
password:'mysqljs123',//password of your mysql db
database:'react-sql-db'
});