"How can I use server components for data fetching if all my components also need hooks or onClick?" Move the interactive part into a separate component

FYI, you don’t need a whole component just for the onClick. Client components can also be just functions, so you can import/assign the onClick from a RSC just fine.

While I love the simplicity of data fetching in server components, it is very annoying to make those extra data loader wrapper components for the real (interactive) components. It would be nice if one could have server and client components defined in the same file... (where one is just a simple wrapper to load the data on the server)

My mindset reversed with RSC. I mostly feel like server components are the main thing, and the client components are just wrappers of interactivity.

the best strategy is to move interactive components to separate components and mark them as client components with “use client”. you can still render server components as children of those client components as long as you are not directly importing them into the file that is marked with “use client”.

What’s the extension to get that intellisense?

Or just use react-query 😌

What if the children needs props from their parent?

I love your vids!

🫡

I gotta ask how you’re hiding tailwind classes with little logo boi