Ultimate React App Template

Ultimate template for a React+TS single page application...

Tech Stack

1. React → Frontend Framework
2. TypeScript → Language
3. Vite → Frontend Build Tool
4. Yarn → Package Manager

Project Setup

1. Install NodeJS, NPM, and Yarn
   1. Install NodeJS (comes with NPM) → full guide
   2. Install Yarn → npm install -g yarn
   3. (Optional) Enable Yarn in PowerShell → Set-ExecutionPolicy -Scope Process -ExecutionPolicy Bypass
2. Create React/TypeScript template using Vite & Yarn → yarn create vite <project_name> --template react-ts
   1. Install needed packages → yarn install
3. Setup Git in project → git init
   1. Perform initial commit
   2. (Recommended) Publish to GitHub as public/private repo
4. Setup ESLint and Prettier
   1. Install and setup code linting w/ ESLint → guide
   2. Install and setup code formatting w/ Prettier → guide (do not setup VS Code)
   3. Making ESLint and Prettier work together → guide

Usage

1. Download repository:
   • Clone method
   • Or download as .zip and unzip the contents
2. (Optional) If cloned, change remote as needed. If downloaded as zip, initialize git repo and publish to remote repo as needed.
3. Install packages using yarn or yarn install
4. (Optional) Change "name" field in package.json from "vite-react-template" to desired project name