833: Next Gen Fullstack React with TanStack

Key takeaways

TanStack is a comprehensive set of tools including Query, Router, and Table, designed to cater to various developer needs in the React ecosystem.
TanStack Start aims to provide both client-side and server-side capabilities, making it a versatile choice for React developers.
The shifting landscape of the React ecosystem, with server components becoming more prevalent, necessitates tools like TanStack that simplify development.
Documentation is vital for user adoption and satisfaction, and Tanner strives to create clear, enjoyable documentation for TanStack.
Community contributions to TanStack are significant - Tanner highlights the importance of recognizing the team's efforts and talents.

Summary

Introduction to TanStack

Scott and Wes welcome Tanner Linsley, creator of TanStack, which encompasses tools like TanStack Query, Router, and Table. The discussion begins with Tanner sharing his journey and the evolution of TanStack over the years.

The Future of TanStack Start

Tanner dives into TanStack Start, describing it as 95% TanStack Router with added server-side capabilities. TanStack Start leverages power from Vinci and Nitro for server functions and deployment, aiming for seamless integration in React applications.

Navigating the React Ecosystem

The conversation shifts to the current state of the React ecosystem, highlighting the rise of server components and the transition many developers are making toward frameworks like Remix and Next.js. Tanner offers insights on how these changes impact developers using TanStack tools.

Server Components vs. Client-Side Approaches

Tanner discusses the dual nature of TanStack, emphasizing its client-side focus while supporting server-side functionalities. The talk captures the complexity of developing React applications and how TanStack aims to simplify this with its router and query tools.

Documentation Practices

Tanner reflects on the importance of documentation in TanStack's tools. He shares his approach to ensuring that the documentation is comprehensive, enjoyable, and accessible to a variety of developer learning styles.

Community and Collaborations

Towards the end, Tanner highlights the importance of his maintainers and collaborators, sharing their skills and contributions that make TanStack a robust suite of tools. He encourages listeners to support and recognize the work of his team.

Product Recommendations and Closing Remarks

The episode wraps up with Tanner’s sick picks, which include an LG OLED TV and a slim wall mount. He emphasizes the balance between producing high-quality products and making them accessible for users.

Show notes

Scott and Wes talk with Tanner Linsley, creator of TanStack, about the React ecosystem, and the evolution and futue of TanStack’s suite of tools, including TanStack Router and TanStack Start.
Show Notes 00:00 Welcome to Syntax!
02:59 What is TanStack Start? UnJS

Nitro

Vinxi

06:17 What is the Vite Environment API?
07:21 Was it always the plan to use Vite?
08:02 TanStack Router and client-side vs server-side
16:18 How TanStack Start will work
27:26 Moving from Create React App to TanStack
30:42 Brought to you by Sentry.io

31:15 Will TanStack Router ever support other frameworks?
33:54 How will TanStack Start handle forms?
36:13 TanStack Virtual

39:41 What is the future of TanStack? Convex

42:49 How Tanner writes documentation
47:55 Server functions and middleware
54:41 When will TanStack Start be in beta?
57:00 Sick Picks + Shameless Plugs
Sick Picks Tanner: LG C4

Ultra Slim Fit TV Wall Mount

Shameless Plugs Tanner: TanStack Blog

@TKDodo

Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
Wes: X Instagram Tiktok LinkedIn Threads
Scott: X Instagram Tiktok LinkedIn Threads
Randy: X Instagram YouTube Threads