Although Adonis starts our route definitions within our start directory within routes.ts
, in actuality, it really doesn't care where our routes reside so long as we inform it where they're defined. In this lesson, we're going to cover a few options you have when it comes to structuring your route definitions.
As we go through this lesson it's important to remember that keeping all your route definitions within the default routes.ts
file is perfectly valid. In fact, that's what I do for most of my projects.
Routes Directory
One option we have is to group routes by topic and place them inside route-specific files inside a routes directory.
So, for a blog, we could have the following files within our routes directory.
/start/routes/auth.ts
for all authentication routes/start/routes/posts.ts
for all post routes/start/routes/topics.ts
for all topic routes
We'd define the routes within these files the exact same as we would within our routes.ts
file.
import Route from '@ioc:Adonis/Core/Route' Route.get('posts', async ({ view }) => { const posts = [ { title: 'Post 1', body: '...' }, { title: 'Post 2', body: '...' } ] return view.render('posts/index') })
Copied!
- start
- routes
- posts.ts
Then, in order to inform Adonis about the routes defined within these files we'd just import them within our routes.ts
file.
import './routes/auth' import './routes/posts' import './routes/topics'
Copied!
- start
- routes.ts
With that, all should be working! Of course, since we're importing them within routes.ts
this means you can really organize them any way you wish so long as they're imported here.
App Modules
Another option we have is to create a Modules directory within our app directory. Then, inside this Modules directory, we'd create another directory for each topic we need for our application. So continuing with our blog example, we could have a structure like the below.
app/Modules/Auth/routes.ts
for all authentication routesapp/Modules/Post/routes.ts
for all post routesapp/Modules/Topic/routes.ts
for all topic routes
Then, just the same as our previous example, you'd define your routes within their respective topic directory.
import Route from '@ioc:Adonis/Core/Route' Route.get('posts', async ({ view }) => { const posts = [ { title: 'Post 1', body: '...' }, { title: 'Post 2', body: '...' } ] return view.render('posts/index') })
Copied!
- app
- Modules
- Post
- routes.ts
Lastly, import the module's route file within your routes.ts
file.
import 'App/Modules/Auth/routes' import 'App/Modules/Post/routes' import 'App/Modules/Topic/routes'
Copied!
- start
- routes.ts
The premise of this approach is that now we have a dedicated place within our project to put all things related to our topic. Some folks prefer this structure over the standard structure.
So, we haven't covered controllers, services, or events yet but you could place a file for each of these within your topic as well.
// Module / Topic Group Approach
app/
├─ Modules/
│ ├─ Auth/
│ │ ├─ controller.ts
│ │ ├─ events.ts
│ │ ├─ routes.ts
│ │ ├─ service.ts
│ ├─ Post/
│ │ ├─ controller.ts
│ │ ├─ events.ts
│ │ ├─ routes.ts
│ │ ├─ service.ts
│ ├─ Topic/
│ │ ├─ controller.ts
│ │ ├─ events.ts
│ │ ├─ routes.ts
│ │ ├─ service.ts
start/
├─ events.ts
├─ routes.ts
// Standard File-Type Approach
app/
├─ Controllers/
│ ├─ Http/
│ │ ├─ AuthController.ts
│ │ ├─ PostsController.ts
│ │ ├─ TopicsController.ts
├─ Services/
│ │ ├─ AuthService.ts
│ │ ├─ PostService.ts
│ │ ├─ TopicService.ts
│ │ ├─ service.ts
start/
├─ events.ts
├─ routes.ts
Move Routes Out Of Start
The last approach we'll be covering is how we can move our routes.ts
outside of our start directory and place it anywhere we'd like. So, let's say we wanted to move our routes from /start/routes.ts
to the root of our project at /routes.ts
.
First, we'd go ahead and move the file form /start/routes.ts
to /routes.ts
so the file is directly off the root of our project (or move it to wherever you'd like). Next, we need to update the route path within our .adonisrc.json
file to inform Adonis about the new location.
So, our routes are defined within the preloads array, you should see an item with the following value "./start/routes"
. All we need to do is update this to our new routes.ts
file location, so to move it to the project root we'd update this to "./routes"
.
Next Up
We've covered a couple of ways we can go about organizing our route files within our application structure. In the next lesson, we'll be covering how we can organize our route definitions inside their respective file, using groups, to cut back on redundancies.
Join The Discussion! (1 Comments)
Please sign in or sign up for free to join in on the dicussion.
jony254
Lesson 7 ✅
Please sign in or sign up for free to reply