TanStack Start in 100 Seconds

The TanStack Start, a DX-optimized full-stack framework that comes with full-document server-side rendering, streaming, server functions, and bundling built by Tanner Lindsey, the man known for brutally frame-logging Next.js while it was busy gesture-maxing AI empowerment. React was originally created in 2013 as a way to let developers at Facebook, who had been labeled as gifted children when they were young, feel better about themselves after being forced to Its goal was to simplify the complexities of managing state and front-end applications. In 2016, it then escaped the browser with the release of Vercel's Next.js, a zero-config framework built on top of React that offered server rendering out of the box. At first, it was pretty nice. It taught millions of bootcamp grads what a server was and empowered them to ship less JavaScript to the client. But over time, as React itself went through its own identity crisis, so did Next. This eventually led to some breaking changes, some pretty rough security vulnerabilities, and just overall bad vibes for the framework. Then last year, Tanner came along and said, what if we could have a React framework that was type-safe, server-first, highly performant, but without all the heavy abstractions? So that's what he built, and it's called TanStack Start. Creating a new project is simple. Just run this command. From there, you can choose from a bunch of different configuration options to start out with. Once you do that, you'll have an app that comes out of the box with VTest for testing, Tailwind for styling, TanStack Router for routing, and TypeScript with end-to-end type safety. If you have logic that should only run on the server, like if you want to connect to a database or work with the file system or environment variables, you can create a server function that can be used anywhere in your app, and it'll maintain type safety across the network. And because Start is built on TanStack Router, which uses file system-based routes, if you want to add a new route to your app, you just create a new file in the routes directory. From there, you can also specify any data that route needs using a loader, and that data will be available to the route before it's rendered. And if you want to create an API route for handling raw HTTP requests, you can do that with the same CreateFileRoute API, but with the server property. This has been TanStack Start in 100 seconds. If you want to see more videos like this, let me know what you want to learn about next in the comments. Thanks for watching, and I will see you in the next one.