00:08
depending on what their purpose is. We're going to do that here today because after this series, we're going to follow this series up with another series where we add an API to this application.
00:17
So we're really going to have three different segments of our routes. We're going to have our authentication routes, our web-based application routes, and our API routes. Now, there are several ways that you can do this.
00:27
We could just move these into a group, call the group inside of this routes.ts file. But what we're going to do here today is completely get rid of this routes.ts file and instead
00:36
have three completely different files that will be preloaded with our application to register all three segments of our routes that we'll have.
00:43
So routes are defined inside of our start directory, so let's jump into there first. Let's create a new file with a routes folder, and inside of that folder, we'll add an auth.ts file.
00:53
This is the file where we're going to put our auth routes. So we can jump into our routes file and cut these particular auth-based routes out and instead paste them inside of our auth.ts routes.
01:03
Command dot, import all missing imports, and we can hit save there to get rid of the red squigglies. Now what we want to do is move any remaining routes, which is just our home route at the
01:13
moment, into a separate file inside of our routes folder, and we'll call this web. This will be the file where we register the web-based application routes for our organization,
01:22
courses, difficulties, access levels, et cetera. And for the auth, what we did was jump into our routes new file and created a route there that way.
01:30
Alternatively, you can jump into your terminal. I have one open over here that we used a rebel session on in the last lesson. Let's jump into there and clear that out.
01:38
You can also do node.ase.make.preload, and these preloads are files that are preloaded with our application whenever it is booted up, and that is particularly what the start
01:48
directory is meant for. So they'll be automatically placed inside of the start directory, so we don't need to mention that. Instead, we can just mention that we want it inside of the routes folder, and we want it called web.
01:57
So we'll hit enter there, and it's going to ask us if we want to register this preload file. We can go ahead and have it do so, and that's just going to update our adonisrc.ts file
02:06
with this new preloaded path, and you'll see that it created it at start routes web. Perfect. We'll ignore our API for now. We'll get to that whenever we get to the next series.
02:15
We have plenty of lessons left in this series to cover. Jump back over to where we have our server running, as we're now done with that terminal, and close it out. And go ahead and just cut this one route out.
02:25
Jump into our new web file, paste it in, command dot, add all missing imports, and hit save on that. Okay. Now, whenever we ran the nodeace make preload file, we had it automatically register inside
02:35
of our preloads, our web file. We did not do that with our auth. So let's now dive into our adonisrc.ts file. We can give that a save real quick to format our commands and all of the others.
02:45
And let's scroll on down now to the preloads section. You'll see that this is where I added in our start routes web. And this is where we also had that preexisting routes file as well.
02:54
We're going to be getting rid of that altogether. So let's just go ahead and remove that now.
02:59
Then we also want to add in an import for our start routes auth, and we can give that a save. Cool.
03:07
Now, all of the routes that we have registered in either of these two files are going to get registered whenever our application boots up. And we've now removed the usage of our routes.ts file altogether.
03:16
So we can right click on that and delete it out of our application. All right, let's jump back into our auth and it looks like we still have a red squiggly on our ctx.
03:24
Oh, actually, it's trying to use the router from inertia. That's certainly not right. Let's get rid of that. Come back to our router command dot. And yeah, let's use the one from adonis.
03:34
That's going to work a lot better. And now that we've imported that, you're going to see now a red squiggly on a register controller. And that's because it prefers lazy loading. So that hot module reloading actually works appropriately.
03:44
So let's go ahead and now give this a save. And that should automatically switch it to lazy load our register controller for us. Awesome. Now everything's working correct. Now that I have my import right.
03:54
Now one more thing that I'm going to do with the route files, and this is completely optional. This is just a personal preference from our imports down.
04:01
So instead of our actual route definitions, I'm going to disable the linting as well as prettier formatting.
04:07
So I really, really, really prefer my route definitions to be all on one line as it just makes everything more scannable as we get more and more routes to find.
04:17
Generally all of the paths are going to be right along this vertical line. So it just makes it easy to find what I'm looking for.
04:24
So right above these router definitions, I'm going to add in a slash star comment or prettier ignore start. And then we can end that comment.
04:34
And I'm going to do another one for es lint disable. And as a note of what I'm doing and why I'm doing it, ignore formatting.
04:42
I find it easier to scan single line definitions, route definitions, there we go, and that comment.
04:49
And then these two will automatically end at the end of this file. So we don't really need to worry about ending them there. We can just have the starts, give that a copy.
04:58
And let's paste that inside of the web as well. If my preference matches yours. Okay. Awesome. So now our routes are all set.
