Merge remote-tracking branch 'origin/main' into use-matches

docs/config.json

@@ -168,6 +168,41 @@
         }
       ]
     },
+    {
+      "label": "Start",
+      "children": [],
+      "frameworks": [
+        {
+          "label": "react",
+          "children": [
+            {
+              "label": "Overview",
+              "to": "framework/react/start/overview"
+            },
+            {
+              "label": "Getting Started",
+              "to": "framework/react/start/getting-started"
+            },
+            {
+              "label": "Hosting",
+              "to": "framework/react/start/hosting"
+            },
+            {
+              "label": "Authentication",
+              "to": "framework/react/start/authentication"
+            },
+            {
+              "label": "Databases",
+              "to": "framework/react/start/databases"
+            },
+            {
+              "label": "Observability",
+              "to": "framework/react/start/observability"
+            }
+          ]
+        }
+      ]
+    },
     {
       "label": "API",
       "children": [],
@@ -184,7 +219,7 @@
       ]
     },
     {
-      "label": "Examples",
+      "label": "Router Examples",
       "children": [],
       "frameworks": [
         {
@@ -198,14 +233,6 @@
               "label": "Quickstart (code-based)",
               "to": "framework/react/examples/quickstart"
             },
-            {
-              "label": "Start Basic",
-              "to": "framework/react/examples/start-basic"
-            },
-            {
-              "label": "Start Basic + React Query",
-              "to": "framework/react/examples/start-basic-react-query"
-            },
             {
               "label": "Basic (file-based)",
               "to": "framework/react/examples/basic-file-based"
@@ -277,6 +304,41 @@
           ]
         }
       ]
+    },
+    {
+      "label": "Start Examples",
+      "children": [],
+      "frameworks": [
+        {
+          "label": "react",
+          "children": [
+            {
+              "label": "Basic",
+              "to": "framework/react/examples/start-basic"
+            },
+            {
+              "label": "Basic + React Query",
+              "to": "framework/react/examples/start-basic-react-query"
+            },
+            {
+              "label": "Basic + Clerk Auth",
+              "to": "framework/react/examples/start-clerk-basic"
+            },
+            {
+              "label": "Basic + DIY Auth",
+              "to": "framework/react/examples/start-basic-auth"
+            },
+            {
+              "label": "Trellaux + Convex",
+              "to": "framework/react/examples/start-convex-trellaux"
+            },
+            {
+              "label": "Trellaux",
+              "to": "framework/react/examples/start-trellaux"
+            }
+          ]
+        }
+      ]
     }
   ]
 }

docs/framework/react/guide/code-splitting.md

@@ -242,7 +242,7 @@ function Posts() {
 }
 ```
 
-Also, if you were previously using virtual routes, you should then their `.lazy.tsx` suffixes removed.
+Also, if you were previously using virtual routes, you should then have their `.lazy.tsx` suffixes removed.
 
 **Before using Virtual Routes**
 

docs/framework/react/start/authentication.md

@@ -0,0 +1,28 @@
+---
+id: authentication
+title: Authentication
+---
+
+<!-- We need some placeholder content here for authentication. One of our partners, Clerk, should get preferential treatment as the "preferred" way of doing auth with TanStack, but we'll support any and all other authentication providers and strategies. Write some general authentication content here until we have docs for both Clerk and other auth providers: -->
+
+Authentication is the process of verifying the identity of a user. This is a critical part of any application that requires users to log in or access protected resources. TanStack Start provides the necessary full-stack APIs to implement authentication in your application.
+
+## What should I use?
+
+TanStack Start is **designed to work with any authentication provider**, so if you already have an authentication provider or strategy in mind, you can use either find an existing example or implement your own authentication logic using the full-stack APIs provided by TanStack Start.
+
+That said, authentication is not something to be taken lightly. After much vetting, usage and reviewing on our end, we highly recommend using [Clerk](https://clerk.dev) for the best possible authentication experience. Clerk provides a full suite of authentication APIs and UI components that make it easy to implement authentication in your application and provide a seamless user experience.
+
+## What is Clerk?
+
+[![Clerk Logo](https://raw.githubusercontent.com/tannerlinsley/files/master/partners/clerk.svg)](https://go.clerk.com/wOwHtuJ)
+
+Clerk is a modern authentication platform that provides a full suite of authentication APIs and UI components to help you implement authentication in your application. Clerk is designed to be easy to use and provides a seamless user experience. With Clerk, you can implement authentication in your application in minutes and provide your users with a secure and reliable authentication experience.
+
+- To learn more about Clerk, visit the [Clerk website](https://go.clerk.com/wOwHtuJ)
+- To sign up, visit the [Clerk dashboard](https://go.clerk.com/PrSDXti)
+- To get started with Clerk, check out our [official Start + Clerk examples!](../../../../examples/react/start-clerk-basic/)
+
+## Documentation & APIs
+
+Documentation for implementing your own authentication logic with TanStack Start is coming soon! In the meantime, you can check out any of the `-auth` prefixed [examples](../../../../examples) for a starting point.

docs/framework/react/start/databases.md

@@ -0,0 +1,27 @@
+---
+id: databases
+title: Databases
+---
+
+Databases are at the core of any dynamic application, providing the necessary infrastructure to store, retrieve, and manage data. TanStack Start makes it easy to integrate with a variety of databases, offering a flexible approach to managing your application's data layer.
+
+## What should I use?
+
+TanStack Start is **designed to work with any database provider**, so if you already have a preferred database system, you can integrate it with TanStack Start using the provided full-stack APIs. Whether you're working with SQL, NoSQL, or other types of databases, TanStack Start can handle your needs.
+
+That said, the choice of a database is critical to your application's performance, scalability, and reliability, which is we highly recommend using [Convex](https://convex.dev) for the best possible database experience.
+
+## What is Convex?
+
+[![Convex Logo](https://raw.githubusercontent.com/tannerlinsley/files/master/partners/convex.svg)](https://convex.dev)
+
+Convex is a powerful, serverless database platform that simplifies the process of managing your application's data. With Convex, you can build full-stack applications without the need to manually manage database servers or write complex queries. Convex provides a real-time, scalable, and transactional data backend that seamlessly integrates with TanStack Start, making it an excellent choice for modern web applications.
+
+Convex’s declarative data model and automatic conflict resolution ensure that your application remains consistent and responsive, even at scale. It’s designed to be developer-friendly, with a focus on simplicity and productivity.
+
+- To learn more about Convex, visit the [Convex website](https://convex.dev)
+- To sign up, visit the [Convex dashboard](https://dashboard.convex.dev/signup)
+
+## Documentation & APIs
+
+Documentation for integrating different databases with TanStack Start is coming soon! In the meantime, keep an eye on our examples and guide to learn how to fully leverage your data layer across your TanStack Start application.