React + TypeScript + Vite Boilerplate

This React + TypeScript + Vite boilerplate is designed to kickstart your projects with a modern front-end architecture. It includes essential features like a language provider for internationalization, authentication provider for managing user sessions, and Axios/@tanstak/react-query interceptors for handling API requests seamlessly.

Features

• Language Provider: An integrated provider designed for seamless management of application languages and translations.
• Authentication Provider: A pre-configured provider that simplifies user authentication and session management.
• RoutesProvider: Utilizes the latest features of @tanstack/react-router to efficiently manage application routing.
• Axios Interceptors: Built-in interceptors that streamline the management of HTTP requests and responses.
• React Query: Leverages the latest capabilities of @tanstack/react-query to optimize caching and handling of network requests.
• HeadlessUI & TailwindCss: Pre-installed libraries offering headless components alongside opportunity for customizable styles for enhanced project design.

Getting Started

Follow these steps to get started with the project:

• Clone the repository.
• Install dependencies with yarn install.
• Start the development server with yarn dev.

Current Login Credentials

• username: emilys
• password: emilyspass

Authentication Setup

• Configure serverURL in /src/helpers/server.ts
• Update API endpoints and token handling as per your backend setup.

Route Configuration

• Create your route in src/routes.
• For authenticated routes create your route in src/routes/_authenticated.
• Customize layout in src/components/layout for authenticated routes.
• Start making changes on your route component.

Official docs

sass, axios, @headlessui/react, @tanstack/react-query, @tanstack/react-router

License

MIT License Copyright (c) 2024 Anri Voci

Authors

Anri Voci - GitHub Profile