-
Notifications
You must be signed in to change notification settings - Fork 23
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
77 changed files
with
8,494 additions
and
481 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,24 @@ | ||
.DS_Store | ||
/node_modules/ | ||
# Logs | ||
logs | ||
*.log | ||
npm-debug.log* | ||
yarn-debug.log* | ||
yarn-error.log* | ||
pnpm-debug.log* | ||
lerna-debug.log* | ||
|
||
node_modules | ||
dist | ||
dist-ssr | ||
*.local | ||
|
||
# React Router | ||
/.react-router/ | ||
/build/ | ||
# Editor directories and files | ||
.vscode/* | ||
!.vscode/extensions.json | ||
.idea | ||
.DS_Store | ||
*.suo | ||
*.ntvs* | ||
*.njsproj | ||
*.sln | ||
*.sw? |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,100 +1,50 @@ | ||
# Welcome to React Router! | ||
# React + TypeScript + Vite | ||
|
||
A modern, production-ready template for building full-stack React applications using React Router. | ||
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. | ||
|
||
[](https://stackblitz.com/github/remix-run/react-router-templates/tree/main/default) | ||
Currently, two official plugins are available: | ||
|
||
## Features | ||
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh | ||
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh | ||
|
||
- 🚀 Server-side rendering | ||
- ⚡️ Hot Module Replacement (HMR) | ||
- 📦 Asset bundling and optimization | ||
- 🔄 Data loading and mutations | ||
- 🔒 TypeScript by default | ||
- 🎉 TailwindCSS for styling | ||
- 📖 [React Router docs](https://reactrouter.com/) | ||
## Expanding the ESLint configuration | ||
|
||
## Getting Started | ||
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules: | ||
|
||
### Installation | ||
- Configure the top-level `parserOptions` property like this: | ||
|
||
Install the dependencies: | ||
|
||
```bash | ||
npm install | ||
``` | ||
|
||
### Development | ||
|
||
Start the development server with HMR: | ||
|
||
```bash | ||
npm run dev | ||
``` | ||
|
||
Your application will be available at `http://localhost:5173`. | ||
|
||
## Building for Production | ||
|
||
Create a production build: | ||
|
||
```bash | ||
npm run build | ||
``` | ||
|
||
## Deployment | ||
|
||
### Docker Deployment | ||
|
||
This template includes three Dockerfiles optimized for different package managers: | ||
|
||
- `Dockerfile` - for npm | ||
- `Dockerfile.pnpm` - for pnpm | ||
- `Dockerfile.bun` - for bun | ||
|
||
To build and run using Docker: | ||
|
||
```bash | ||
# For npm | ||
docker build -t my-app . | ||
|
||
# For pnpm | ||
docker build -f Dockerfile.pnpm -t my-app . | ||
|
||
# For bun | ||
docker build -f Dockerfile.bun -t my-app . | ||
|
||
# Run the container | ||
docker run -p 3000:3000 my-app | ||
```js | ||
export default tseslint.config({ | ||
languageOptions: { | ||
// other options... | ||
parserOptions: { | ||
project: ['./tsconfig.node.json', './tsconfig.app.json'], | ||
tsconfigRootDir: import.meta.dirname, | ||
}, | ||
}, | ||
}) | ||
``` | ||
|
||
The containerized application can be deployed to any platform that supports Docker, including: | ||
|
||
- AWS ECS | ||
- Google Cloud Run | ||
- Azure Container Apps | ||
- Digital Ocean App Platform | ||
- Fly.io | ||
- Railway | ||
|
||
### DIY Deployment | ||
|
||
If you're familiar with deploying Node applications, the built-in app server is production-ready. | ||
|
||
Make sure to deploy the output of `npm run build` | ||
|
||
- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked` | ||
- Optionally add `...tseslint.configs.stylisticTypeChecked` | ||
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config: | ||
|
||
```js | ||
// eslint.config.js | ||
import react from 'eslint-plugin-react' | ||
|
||
export default tseslint.config({ | ||
// Set the react version | ||
settings: { react: { version: '18.3' } }, | ||
plugins: { | ||
// Add the react plugin | ||
react, | ||
}, | ||
rules: { | ||
// other rules... | ||
// Enable its recommended rules | ||
...react.configs.recommended.rules, | ||
...react.configs['jsx-runtime'].rules, | ||
}, | ||
}) | ||
``` | ||
├── package.json | ||
├── package-lock.json (or pnpm-lock.yaml, or bun.lockb) | ||
├── build/ | ||
│ ├── client/ # Static assets | ||
│ └── server/ # Server-side code | ||
``` | ||
|
||
## Styling | ||
|
||
This template comes with [Tailwind CSS](https://tailwindcss.com/) already configured for a simple default starting experience. You can use whatever CSS framework you prefer. | ||
|
||
--- | ||
|
||
Built with ❤️ using React Router. |
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.