00:02
- So now that we have everything installed on our system that we're gonna need throughout this series, we're ready to go ahead and create our first AdonisJS 6 project.
00:11
So in order to do this, we're gonna need to jump into our terminal. So let's go ahead and open that up. Now for all of my code-based projects, I like to put them all inside of a folder called code.
00:20
So I'm gonna CD into that folder. If you have a place that you like to put your code on your computer, go ahead and head into that directory now. If you don't, maybe consider creating a folder called code.
00:29
You can create a folder by doing make dir or mkdir, and then provide in the folder names. So it'd be something like code. And then after you run that command,
00:37
you could then CD into code to jump into that folder like we are right here. I'm already within a folder called code. So I'm going to bypass running that command there.
00:45
And I'm gonna clear my terminal out. So now let's actually create our project. So we're gonna need to run a command against NPM. So we'll do NPM init, and the command's called AdonisJS.
00:55
And then we'll wanna target the latest version of that. And this command is gonna walk us through the process of actually creating our AdonisJS project. But before we actually run this command, we're gonna wanna provide it a project name.
01:04
I'm gonna call mine let's learn AdonisJS 6. Now we're ready to go ahead and hit enter to run it. It's gonna ask us which starter kit we would like to use. And it has three options.
01:14
We have the slim starter kit, the web starter kit, and the API starter kit. Now back in our first lesson, we talked about batteries that AdonisJS can come with.
01:21
These starter kits determine how many batteries we get included and what type of batteries we get included for the particular purpose that we select.
01:29
For example, if we were to select the slim starter kit, it would come with the bare bone number of batteries that we would need to actually get our server up and running. We could always add additional batteries on top of it
01:38
once we start with that slim starter kit, but it's gonna be the leanest option that we have to get started with AdonisJS. The web starter kit is gonna include everything that we need to start up a web server.
01:48
This is gonna include things like session support, the edge template engine, and so on and so forth. And then the API starter kit's gonna contain things you need to create an API, where you have your client side application
01:58
or what's running the browser completely separated from your AdonisJS project. So depending on what you need for your particular project, you'll want to select the appropriate starter kit for that.
02:07
For us, that's gonna be the web starter kit. So let's go ahead and select the web starter kit here. It's gonna ask us whether or not we want to install our dependencies. It's gonna use npm to do so. Whenever you installed Node.js,
02:16
npm installed alongside of that. The two go hand in hand with one another. So we're A-okay to go ahead and have it install our dependencies for us. These dependencies are gonna be all of the different
02:25
packages from AdonisJS and other package creators to actually run our underlying server. So these are things AdonisJS created themselves,
02:33
as well as packages that they rely on to get to the underlying Adonis server. So let's go ahead and install those. So it's gonna install those packages like it's doing right now.
02:42
And it's gonna prepare our application, which it already has done. And now it's configuring AdonisJS Lucid, and now it's done. So let's go ahead and scroll back up a little bit and finish running through what exactly it did.
02:52
So first it downloaded the web starter kit from their GitHub repository. The starter kit is essentially all of the code that we're gonna start with whenever we actually dive into our code base.
03:00
So if we were to compare our starter code with the web starter kit that they have on their repository, it would be a match. Then it's gonna install the packages specifically for that web starter kit,
03:10
since we told it to right up here. Then it's gonna start preparing our application and to do so it's going to install and configure Lucid. By default, it's going to have it set to the SQLite database.
03:20
Now, as we covered in our last lesson, we're gonna be using Postgres as our database driver. However, whatever database driver you use doesn't really matter too much because Lucid is going to abstract that away for the most part.
03:29
So if you already have SQLite installed or if you have MySQL or MSSQL, that's a-okay. You can go ahead and use those drivers. Whenever we install our Postgres driver for Lucid,
03:38
just go ahead and select the driver that you need. If you're using SQLite, then you're already set. And if none of that made sense, don't worry, we're gonna walk through it. And then lastly, it's gonna configure authentication
03:47
and it's gonna specifically do so with the session guard. The session guard essentially is just going to use browser sessions in order to maintain the statefulness of our authentication.
03:57
Cool. So all of those different actions get us down to our starting AdonisJS project. So we can go ahead and CD into our project now by running CD.
04:06
Let's learn AdonisJS 6. We can run npm run dev to actually boot the server up. So let's do npm run dev. And there we go.
04:15
So now our server address is ready at 127.0.0.1 colon 3333. The HTTP 127.0.0.1 is our host name.
04:24
And then the colon separates our host name from the port. 3333 is then our port. The 127.0.0.1 specifies that the server's running on our machine.
04:34
And then the port is kind of like the street address. It's the specific address on our machine that the server's running. So if we go ahead and open this particular address
04:42
up in our browser, we can command or control click directly on this and it will open it up within our browser just like so, and we'll see it works.
04:49
Now in other places, you may also see 127.0.0.1 replaced with localhost. Localhost is just a human friendly string
04:57
that means 127.0.0.1. So they are interchangeable. So if we go ahead and hit enter here, you see we get the exact same thing. Cool, so let's go ahead and hide our browser away here for a second.
05:07
And let's finish walking through what this command states. So you'll see it also mentions that the file system watcher is enabled. Essentially the AdonisJS server has started in development mode.
05:17
And since it knows that it's in development mode, it knows that we're gonna make frequent changes to it. To help us out with that, it's going to watch our file system for those changes.
05:25
And whenever it recognizes any of those changes, it will automatically apply it to our running server so that we can just see it immediately within our browser, which is pretty nice and convenient.
05:34
All right, so now let's go ahead and open up our project within our text editor. So here's Visual Studio Code. We can go ahead and hit open here. Let's head into the directory that we installed our application within.
05:43
So mine's within code. I'm gonna wanna scroll down a little bit to the Let's Learn AdonisJS 6. Just select the folder right here and then hit open. That's gonna open up all of the files and folders
05:52
that we have within that folder that make up our project.