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:

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/

[noctua]

You, good sir, have saved me from failing my final project. Thanks!

[devinsmith]

8 hours of my life (of which I still didn't succeed in) summed up in 25 minutes. Now I can get on with the meat of my project. Thank you.

[hooleymcknight]

This was the only helpful thing after hours of digging. Seriously, thank you!!

[BartMolkenboer]

Didn't know MySQL DB connections with NextJS was possible, great to know so I can now really finally quit using handwritten PHP/ HTML and css and start fully developing my projects in NextJS with MySQL! Thanks for this clean tutorial man 🙏

[Sweetironman]

Brother, You don't really know how happy I'm now after seeing this video 🤩 fantastic tutorial solve so many problems.

[leicodaya]

thanks, i really needed this, hope you have a great day

[dontforgetruby]

The best video ever to help with NextJS MySQL, it is really beginner-friendly, thanks!

[andreporto]

Simply the best everything I've ever seen, and without the complications that everyone seems to want to impose.
Question: do you intend to make one for CRUD?
For us, who are veterans, coming from coding completely different from the proposal lately, it would help a lot!

[TheDroppersBeats]

GOD BLESS MYSQL2! Thank you so much, boss!

[hruday-ranjan]

Thanks alot for this content bro.. 😘
❤️ From India

[jonelilajas]

You save me this is the most useful thing that I really want to know. I ask chatGPT. but it cant give the me the right answer. Thank you God bless you brother.

[bombastickss]

i love your video, that's so simple to understand. thank you so much dude

[Pandesaltosino]

holy, this is so advanced lmao. thanks. exactly what I needed though! Incredible

[ipodhelper]

I have a question regarding the images part. I tried doing that with my own database, but it won't work though it's on my own local system. I have images not appearing. I have the pictures stored on my Desktop as well as the "public" directory on my coding. What do I do?

[Great_Meditation]

No HTTP methods exported in Export a named export for each HTTP method. i am facing while connecting to mysql database.

[leof]

I keep receiving an error of dbconnection.execute is not a function. any pointers to what the cause might be? Thanks in advance

[BlackIce]

why you define function within useEffect? and then call it right after that?

[excalibur]

Thank you for this fantastic tutorial!

[scottnoring]

How old is this. Is it NextJS14? I'm getting errors with usestate and useffect.

[ferlynrulete]

Next Js deploy to vercel but how about mysql2, how to deploy?