- Husky 🐶 : Runs lint-staged checks before each commit.
- TanStack Query : Manages, caches, and synchronizes server state.
- NetInfo : Keeps TanStack Query synchronized with the native network status.
- ESlint : Statically analyzes your code to quickly find problems. It is built into most text editors and you can run ESLint as part of your continuous integration pipeline.
- Prettier : An opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.
- VSCode : Configuration file and recommended extensions
- Authentication
- Others
- Node.js 22.13 or later
- Bun 1.3.14
This project uses Bun as its package manager. Install the dependencies, then start the development server:
bun install
bun startOpen Expo Go on your phone and scan the QR code.
bun start # Start the Expo development server
bun run android # Start Metro and open Expo Go on Android
bun run ios # Start Metro and open Expo Go in the iOS Simulator
bun run web # Start the web app
bun run lint # Run ESLint
bun run lint:debug # Run ESLint in debug mode
bun run lint:fix # Fix ESLint issues
bun run ts:check # Run the TypeScript compilerThe android and ios scripts match the Expo SDK 57 default CNG template. They start Metro and open the project in Expo Go without generating native project directories.
To generate the native projects and compile local development builds instead, use:
bun expo run:android
bun expo run:iosThese native build commands generate android/ and ios/ directories when they do not exist. Keep using the default scripts when Expo Go is sufficient.
├── .gitignore
├── .husky
├── .prettierrc
├── .vscode
├── app
│ ├── (tabs)
│ └── _layout.tsx
├── app.json
├── assets
│ ├── adaptive-icon.png
│ ├── favicon.png
│ ├── icon.png
│ └── splash.png
├── bun.lock
├── bunfig.toml
├── eslint.config.js
├── expo-env.d.ts
├── package.json
├── src
│ └── hooks
│ ├── useAppState.ts
│ └── useOnlineManager.ts
└── tsconfig.jsonThe Better Comments extension will help you create more human-friendly comments in your code. With this extension, you will be able to categorize your annotations into:
- Alerts
- Queries
- TODOs
- Highlights
- Commented out code can also be styled to make it clear the code shouldn't be there
- Any other comment styles you'd like can be specified in the settings
Integrates ESLint into VS Code. If you are new to ESLint check the documentation.
The extension uses the ESLint version and flat configuration installed in this workspace. Run bun run lint to perform the same checks from the terminal.
SonarLint by Sonar is a free IDE extension that empowers you to fix coding issues before they exist. More than a linter, SonarLint detects and highlights issues that can lead to bugs, vulnerabilities, and code smells as you create your code. It offers clear remediation guidance and educational help, so you can fix issues before the code is committed. SonarLint in VS Code supports analysis of JS/TS, Python, PHP, Java, C, C++, C#, Go, and IaC code locally in your IDE.
ErrorLens turbo-charges language diagnostic features by making diagnostics stand out more prominently, highlighting the entire line wherever a diagnostic is generated by the language and also prints the message inline.
To learn more about Expo and TanStack Query, take a look at the following resources:
- Expo Documentation - learn about Expo and its APIs.
- Expo Router Documentation - learn about file-based routing.
- TanStack Query React Native - learn how to use TanStack Query with React Native.