Intermediate Next.js

Project & Database Setup

Scott Moss

Scott Moss

Superfilter AI
Intermediate Next.js

Check out a free preview of the full Intermediate Next.js course

The "Project & Database Setup" Lesson is part of the full, Intermediate Next.js course featured in this preview video. Here's what you'd learn in this lesson:

Scott walks through the instructions for cloning the repo and installing the project dependencies. The application's database will be SQLite hosted on Turso. Once an account and database are created in Turso, the TURSO_CONNECTION_URL and TURSO_AUTH_TOKEN environment variables can be added to the project.

Preview
Close

Transcript from the "Project & Database Setup" Lesson

[00:00:00]
>> Speaker 1: So for the prerequisites, like I said, you only need two things. Node.js version 20, minimal. And then get, that's it. Doesn't matter if you're on Windows, doesn't matter if you're on Linux Mac, just those two things, cuz it's just the Next.js app. So I already said this at the beginning, but fork the repo, clone it, pull it down.

[00:00:17]
Make sure you do an NPM install. I have a package lock in there, which is used by NPM to make sure all the versions of all the dependencies resolve to the same versions that I have now. If you do yarn, if you do bun to install, it'll install them.

[00:00:31]
But in the future, when those things get upgraded and have breaking changes, you'll most likely, you could also have breaking changes as well. So if you want to, I mean, I guess technically, you shouldn't use a package JSON. Package JSON has a carrot character in front of it for preventing it from having like breaking change downloads.

[00:00:46]
But you can't trust developers will introduce breaking changes and miners and patches which they do a lot. So just don't trust it. Just use NPM to install the packages and then if you wanna use bind or something else to actually execute it. I've tested it in the latest version of Bun, I use Bun for everything.

[00:01:03]
It works just fine, but we'll be using NPM and Node for this entire course. The next thing is setting up a database. I went back and forth on whether or not, should I just do it in memory database? Should I just mock this out? Should I just fake it?

[00:01:16]
And I just feel like I wasn't, to really solidify this and make this feel like a production and get the best value is best just to have a real database here. Your database was so easy to set up these days, why not? In the last courses I taught we set up a database and it was super simple.

[00:01:31]
So we're gonna use the same one. And that's from a database provider called Turso. If you've never heard of Turso, it's pretty cool. It's basically like hosted sequel lite. In fact, they forked SQLite and made something called lib SQL. If you've never heard of SQL Lite, it's exactly what it sounds like.

[00:01:47]
It's like like SQL. It's like SQL but in a file. So it's very portable. You can use it locally on a phone. You can use it locally on a browser, you can put it on the edge. You can put it on a server, it kind of just goes everywhere.

[00:01:59]
It's a pretty useful database, but no one's been ever able to scale it until now. There's other companies that kind of do the same thing. We're just using this one because they have a generous free plan and it's very easy to get set up. So that's why we're using it.

[00:02:13]
As far as getting set up, make an account, it's free. Once you do that, I already have one. So I'm gonna log in. I'm just gonna walk you through some of this stuff. If you're signing up for the first time, it'll take you through an onboarding process where actually to create a database, go ahead and create a database.

[00:02:30]
There's like an option known that it says create a replica. You don't need that. You don't need a replica, just create a database. You can call it whatever you want, doesn't matter. But eventually they'll dump you to this screen.
>> Speaker 1: Once you get to this screen, you can just click on your databases, click on the one that you want.

[00:02:47]
In my case it's called party. And you just wanna keep track of this URL, we're gonna need to add this URL into our environment variables in our repo. So we can actually have a database so here's your URL. And then the last thing is there's a button here that you can hit that'll generate adjacent web token.

[00:03:04]
We also need to add that to our environment variable. So that's really it as far as the database. So again, turtle, sign up, click databases, click your database, keep note of this URL, generate a token, copy that. You can generate as many tokens as you want. Once you have that, make a .env on the root of that repo, and you just need these two environment variables, TURSO_CONNECTION_URL, TURSO_AUTH_TOKEN.

[00:03:33]
And yeah, you put the connection here all there, you put the token there. I already have mine set up. The last step is once you add your .env is you need to push the schema up to the database. So this is how you know you're done. So what you need to do once you add your .env file, there is a command and a package JSON you can run that by saying npm run db:push, run that command.

[00:03:57]
Yours might say exactly what mine says or not, my database already has this schema, so the output might be different. But you just wanna say yes. I wanna execute all these statements. Once you do that, it's going to attempt to apply those changes. You shouldn't have any issues since it's a brand new database and you know you're done when it says changes apply.

[00:04:17]
That's when you know your database is in sync with your schema. The schema is already written. We won't be writing database schemas today. It's not a database course but if you're curious, you can go check it out. Hopefully, everybody had a chance to set up their Turso database and sync their schema.

[00:04:31]
That is the last configuration with databases that we will be doing on this course. Although we will be writing a lot of database queries using an ORM called Drizzle. If you don't have any experience with that, that's totally fine. Like I said earlier, the code is in the notes and on Github, so just follow along.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now