Next.js Discord

Discord Forum

Can I place the api directory in my project under the src directory instead of app ?

Answered
Gordiac posted this in #help-forum
Open in Discord
This file structure seems more organized to me and I think it might make more sense to do it this way ?
Answered by joulev
no. route handlers are part of the app router and hence must be placed inside the app router.
View full answer

19 Replies

@Gordiac This file structure seems more organized to me and I think it might make more sense to do it this way ?
When creating the project you will be asked if you want to use the app/ dir or the src/ dir (with the app router). Just choose src/ dir and you should be good to go 👍
@B33fb0n3 When creating the project you will be asked if you want to use the app/ dir or the src/ dir (with the app router). Just choose src/ dir and you should be good to go 👍
I have already selected src dir, but it is not stated in the documentation that the api directory can be under src
So since you said that, does that mean I can do it ?
yea
@Gordiac This file structure seems more organized to me and I think it might make more sense to do it this way ?
no. route handlers are part of the app router and hence must be placed inside the app router.
Answer
though if you host on vercel, you can use a top-level /api folder for serverless functions https://vercel.com/docs/functions
One of you says yes, the other says no, I'm confused who to believe 😄 @joulev @B33fb0n3
@joulev no. route handlers are part of the app router and hence must be placed inside the app router.
then it would make sense to merge all directories (components, lib etc.) under the app directory , I think this is very confusing for a beginner.
yea, they need to be still placed in app/ dir. As far as I know the question while creating the project is just where the app/ dir is. Like is it at /app/ or is it at /src/app/. jourlev, correct me if I am wrong
@joulev no. route handlers are part of the app router and hence must be placed inside the app router.
If you have such an option, why is the src directory recommended by default ?
@Gordiac then it would make sense to merge all directories (components, lib etc.) under the app directory , I think this is very confusing for a beginner.
thing is, components and lib and so on are not part of the app router. they are merely the things that the app router imports.

route handlers on the other hand are part of the router and must be placed inside the router.

of course you can always make an api folder outside the app router, write all the logic there, then inside the route.ts files import those things.

you also have options like [trpc](https://trpc.io).
@Gordiac If you have such an option, why is the src directory recommended by default ?
well, so that you can store things outside the src directory too. such as assets, scripts, misc files, so on and so forth
but it's just a matter of preference; as far as nextjs is concerned whether or not you use src doesn't matter.
Frankly, this struck me as very strange. For some reason it seems more logical to me to do it the way I said, but you know.
@Gordiac Frankly, this struck me as very strange. For some reason it seems more logical to me to do it the way I said, but you know.
well, whether it makes sense for you or not, you have to get used to it. perhaps i am already used to it so it makes sense to me
@joulev i understand the question as whether they can use `src/api` instead of `src/app/api` to which the answer is as i said above
yes like that , I think it would be nice if we could use the API directory directly under src, or if such an opportunity were given and optionally specified in the documents, for example.