Server Actions vs. API endpoints
Answered
ncls. posted this in #help-forum
ncls.OP
(I would usually post this in #discussions but I don't have permission)
Hello,
since server actions came out, I never really dove into them that much. I'm a fan of building APIs the classic way because I think it provides a better overview of what code is running where and also gives me the ability to know what my API looks like right away so that I can use it in other apps as well.
However, I feel like server actions are getting more and more common so even if I will probably stick with the traditional way, I want to know more about it.
Which one do you prefer and why?
How are they different? (Especially in security e.g., maybe server actions handle CSRF automatically?)
What's something I have to be cautious about or keep in mind when using server actions?
Thanks for your input in advance! :)
Hello,
since server actions came out, I never really dove into them that much. I'm a fan of building APIs the classic way because I think it provides a better overview of what code is running where and also gives me the ability to know what my API looks like right away so that I can use it in other apps as well.
However, I feel like server actions are getting more and more common so even if I will probably stick with the traditional way, I want to know more about it.
Which one do you prefer and why?
How are they different? (Especially in security e.g., maybe server actions handle CSRF automatically?)
What's something I have to be cautious about or keep in mind when using server actions?
Thanks for your input in advance! :)
Answered by joulev
Server actions are a form of RPC, so one advantage is you don’t have to bring something like trpc for typesafety.
Server actions are tightly coupled with the server component router so if you fetch data in server components, you should use server actions to update data.
Route handlers are for external applications to access your backend. So if you have app A trying to read data from your nextjs app B, that app B should have api endpoints in conjunction with server components and server actions.
If you want to do client side rendering, you should use api endpoints too because don’t use server actions for querying data (for now), since they don’t run in parallel.
So: if you query data in server components you should use server actions to mutate that data. If you query data in client components you should use api endpoints to query and mutate the data.
Server actions are tightly coupled with the server component router so if you fetch data in server components, you should use server actions to update data.
Route handlers are for external applications to access your backend. So if you have app A trying to read data from your nextjs app B, that app B should have api endpoints in conjunction with server components and server actions.
If you want to do client side rendering, you should use api endpoints too because don’t use server actions for querying data (for now), since they don’t run in parallel.
So: if you query data in server components you should use server actions to mutate that data. If you query data in client components you should use api endpoints to query and mutate the data.
3 Replies
@ncls. (I would usually post this in <#752647196419031042> but I don't have permission)
Hello,
since server actions came out, I never really dove into them that much. I'm a fan of building APIs the classic way because I think it provides a better overview of what code is running where and also gives me the ability to know what my API looks like right away so that I can use it in other apps as well.
However, I feel like server actions are getting more and more common so even if I will probably stick with the traditional way, I want to know more about it.
Which one do you prefer and why?
How are they different? (Especially in security e.g., maybe server actions handle CSRF automatically?)
What's something I have to be cautious about or keep in mind when using server actions?
Thanks for your input in advance! \:)
Server actions are a form of RPC, so one advantage is you don’t have to bring something like trpc for typesafety.
Server actions are tightly coupled with the server component router so if you fetch data in server components, you should use server actions to update data.
Route handlers are for external applications to access your backend. So if you have app A trying to read data from your nextjs app B, that app B should have api endpoints in conjunction with server components and server actions.
If you want to do client side rendering, you should use api endpoints too because don’t use server actions for querying data (for now), since they don’t run in parallel.
So: if you query data in server components you should use server actions to mutate that data. If you query data in client components you should use api endpoints to query and mutate the data.
Server actions are tightly coupled with the server component router so if you fetch data in server components, you should use server actions to update data.
Route handlers are for external applications to access your backend. So if you have app A trying to read data from your nextjs app B, that app B should have api endpoints in conjunction with server components and server actions.
If you want to do client side rendering, you should use api endpoints too because don’t use server actions for querying data (for now), since they don’t run in parallel.
So: if you query data in server components you should use server actions to mutate that data. If you query data in client components you should use api endpoints to query and mutate the data.
Answer
I also added the role for you, you can access #discussions now
@joulev Server actions are a form of RPC, so one advantage is you don’t have to bring something like trpc for typesafety.
Server actions are tightly coupled with the server component router so if you fetch data in server components, you should use server actions to update data.
Route handlers are for external applications to access your backend. So if you have app A trying to read data from your nextjs app B, that app B should have api endpoints in conjunction with server components and server actions.
If you want to do client side rendering, you should use api endpoints too because don’t use server actions for querying data (for now), since they don’t run in parallel.
So: if you query data in server components you should use server actions to mutate that data. If you query data in client components you should use api endpoints to query and mutate the data.
ncls.OP
Ok, this tells me that I definitely have to dive deeper into client and server stuff in Next.js😅
It just always felt very complicated to me and I didn't find a good resource for me yet but thanks for the explanation and the role🙏
It just always felt very complicated to me and I didn't find a good resource for me yet but thanks for the explanation and the role🙏