NextJS MySQL example. Get MySQL data into a react app using Node JS

Even with new and exciting front end technologies like react/nextjs you can definitely use SQL databases like MySQL even though some developers assume that react uses no-SQL databases. You can use databases like MySQL to bring in data into your react applications. In this tutorial you will learn how to connect to a MySQL database in react /NextJS and display the data on a react page. You will connect to a MySQL database, write a few lines of SQL and convert the data to JSON to display on your page. You’ll also learn how to filter the SQL results based on a dynamic URL route. MySQL databases are free and open source. You can also easily and affordably deploy a MySql database in production using services like Digital Ocean with ease. You do not need to rely only on MongoDB as a database for your react/nextjs applications. Enjoy! Drop a comment. CONNECT ON MY DISCORD: Twitter: GitHub: 0:00 Intro 1:45 MySql Database 2:00 npm MySql2 Package 3:30 Database Connection (Nodejs) 5:20 Query the Database (Nodejs) 8:00 Convert Query to JSON 9:40 Display MySql data on react page 15:30 Create MySql Database Wrapper for re-using 21:00 Querying database from a dynamic URL route #mysql #react #nextjs #nodejs Get early access to my project/ A library of pre-built user interface layouts and components you can place on any react site: Git Repo: Notes: Some have reported an error in the console logging: “API Request stalled ... “ even though everything is successful on the product page. I noticed this log only happens with the router. Assuming everything else is ok that error may come from a stalled connection back to the API prior to the router. If you add this as the first line in the useEffect for the product/[id] page it should stop the stalled request: if (!) return; [id].js#L11