Reputation: 771
Next.js newbie here. Started building an app with T3 stack. I would like to have the flexibility of exposing endpoints to a possible React Native app for mobile in the future. You might say "build with Next.js first and worry about it later" but I wanted to go this route.
Having some confusion around what to use between tRPC, server actions and route handlers. I'll go one by one:
const createStudent = api.student.createStudent.useMutation(...)
and use that in the form onSubmit (so it's all client component). This is an option with tRPC. The other option is obviously with a server action as server component. But then I can't expose it to React Native in the future.Would the correct answer be creating a reusable function and using it in both a server action and in a route handler? I guess then I can get rid of tRPC completely? Something like this for a get student endpoint:
Is it a correct idea?
Let's say I have a combobox where I filter a list of students, but I want to make that async, so whenever I type something, I would like to filter the list of users from the database. What's the better way of doing this? Using it as a client component with React Query (already provided by tRPC) and doing the filtering there, or fetching the data in a server component and passing setInput and listOfStudents as props to client component? Genuinely confused here. How do I decide when to use React Query and when to use server components, especially in the context of a form?
I wanted to use Next Auth as T3 stack already provides it, but then I gave up because it doesn't support React Native. I did not want to go Auth0 or Supabase because the users would be in a different database from mine. So I decided to go with Lucia. Is that a good call for my use case?
Happy to provide more details on what I want to do, and hopefully I sound more confused than stupid.
Cheers.
Upvotes: 0
Views: 392