This is an opinionated template for a React project with TypeScript and Tanstack. It includes a basic setup for a project with pre-configured TypeScript, Tanstack Router, TailwindCss and Tanstack Query.

This template is a good starting point for a React project with TypeScript and Tanstack. It includes a basic setup for a project with pre-configured TypeScript, Tanstack Router, TailwindCss and React Query.

• TypeScript
• Tanstack Router
• TailwindCss
• Tanstack Query
• ESLint
• Prettier

1. clone the repository with the following command:

git clone

2. Install the dependencies:

npm install

# or
pnpm install

# or
yarn install

3. Start the development server:

npm run dev

# or
pnpm run dev

# or
yarn dev

TypeScript is a language for application-scale JavaScript. It adds optional types, classes, and modules to JavaScript. TypeScript supports tools for large-scale JavaScript applications for any browser, for any host, on any OS. TypeScript compiles to clean, readable, standards-based JavaScript.

Tanstack Router is a routing library for React that is fully-typed and has a first-class search-param for managing state in the URL. Read more about it here.

Tanstack Query is a data-fetching and state management library for React, Vue, and Svelte. It's built on top of the Fetch API and is fully typed. Read more about it here.

TailwindCss is a utility-first CSS framework for rapidly building custom designs. Read more about it here.

• tailwind-merge : A Tailwind CSS plugin that adds a merge utility to merge classes together.

• clsx : This enables pass objects to tw function from tailwind-merge package.

ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code. Read more about it here.

Husky is a tool that makes it easy to use git hooks as if they are npm scripts. Read more about it here.