NextJs data fetching tutorial #part2 using getStaticProps and MYSQL
This is a next.js tutorial on how to fetch data data for a statically generated page using data fetched from a MYSQL data base. The video goes through the steps to setup and fetch data from MYSQL database using queries. Code on github: https://github.com/ui-code-tv/demo-blog-nextjs-mysql Prerequisite is that you have a MYSQL database called blog setup already. You can import dummy data using following sql code : Intro : (00:0:00) Import dummy data into MYSQL: (00:03:52) Setup .env.local file for db connection: (00:5:06) Install serverless-mysql: (00:06:36) Setup MYSQL helper functions: (00:09:07) Create end point to fetch data: (00:11:50) Create a static blog page that fetches data using endpoint: (00:14:24) How write MYSQL data fecting code directly on the blog page: (00:18:14) DROP TABLE IF EXISTS `posts`; CREATE TABLE posts( title VARCHAR(44) NOT NULL PRIMARY KEY ,content VARCHAR(49) NOT NULL ); INSERT INTO posts(title,content) VALUES ('This is all about end points','This is all about api end points111'); INSERT INTO posts(title,content) VALUES ('How to guide on SSR','This is all about server side rendering'); INSERT INTO posts(title,content) VALUES ('My first post','This is my first post..I have nothing much to say'); INSERT INTO posts(title,content) VALUES ('A post','Yet another post'); INSERT INTO posts(title,content) VALUES ('Last years post','This post is from last year');
Download
0 formatsNo download links available.