This is a simple starter template for a project using TanStack Start. It demonstrates how to quickly scaffold a project, set up routes, and manage application state efficiently.
- Loader Data: Fetch and display data using TanStack's route loader.
- Dynamic Updates: Modify state and refresh loader data using
router.invalidate()
. - Styled UI: Includes a basic layout with responsive styles.
To start using this template, run the following command:
npx create-tanstack-app@latest --template tanstack-router
Follow the prompts to set up your project. The generated files include basic starter functionality from TanStack, so you can build on top of them or replace specific components with the code in this repository as needed.
Ensure you have the following installed:
- Clone the repository or use the starter command above to create a new app.
- Navigate to the project directory:
cd your-project-name
- Install dependencies:
npm install
Start the development server:
npm run dev
Visit http://localhost:3000 to view your application.
src/
├── components/ # Reusable UI components
├── routes/ # Application routes
├── styles/ # Global and component-specific styles
├── utils/ # Utility functions and helpers
└── main.jsx # Entry point for the React application
- Modify the
getCount
andupdateCount
functions insrc/functions/
to connect to your backend or API. Refer to the examples and guidelines provided on the TanStack Start page for best practices when integrating these functions. - Add additional routes in
src/routes/
as your application grows.
This project is licensed under the MIT License.