Need Help Getting Started with TanStack

[halcyon fossil]

Hello,

I'm new to TanStack and I would like some clarification on an issue I encountered

I followed the getting started guide in the TanStack documentation at the following link: https://tanstack.com/router/latest/docs/framework/react/start/getting-started and everything worked perfectly. After testing several features of TanStack, I tried using validateSearch. However, I noticed that once I use validateSearch in createFileRoute, none of the onClick buttons work anymore. Is this normal behavior?

Additionally, I was wondering how to determine if a component is rendered server-side (SSR) or client-side (CSR). For example, with Astro, you need to explicitly specify client:load on a component to ensure it runs as CSR and its JavaScript functionalities work properly.

Thanks in advance for your help! 🙏

[tropic willow]

Hello, for your first issue (onClick not working) it seems like something crashed during hydration and it didn't complete. Can you check for console errors in the Browser DevTools? That can give us some idea on what could be breaking 🙂

Regarding your second question, everything should be server rendered on the first load, and then client rendered for subsequents navigations.

Remember when doing server rendering, everything inside useEffect won't execute on the server and it will run on the client after hydration

[halcyon fossil]

Here is my console when I activate validateSearch:

And here it is when I remove validateSearch:

🙏

[glad kestrel]

please provide a minimal complete example

[halcyon fossil]

Here is the file I am having an issue with: https://github.com/GardoTL/test-tanstack/blob/main/app/routes/index.tsx 🙏

[glad kestrel]

can you please strip it down to the bare minimum?

[halcyon fossil]

Yes