https://github.com/jaredkc/remix-test-drive
A handle full of Remix resources and examples for cut-and-paste reference
https://github.com/jaredkc/remix-test-drive
react remix remix-auth tailwindcss typescript vercel
Last synced: 3 months ago
JSON representation
A handle full of Remix resources and examples for cut-and-paste reference
- Host: GitHub
- URL: https://github.com/jaredkc/remix-test-drive
- Owner: jaredkc
- Created: 2023-01-11T23:56:24.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-07-30T22:48:12.000Z (almost 2 years ago)
- Last Synced: 2024-07-31T02:29:59.879Z (almost 2 years ago)
- Topics: react, remix, remix-auth, tailwindcss, typescript, vercel
- Language: TypeScript
- Homepage: https://remix-test-drive.vercel.app
- Size: 1.01 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Remix Test Drive
A handle full of [Remix](https://remix.run/docs) resources and examples for cut-and-paste reference.
## Build with
- [TypeScript](https://www.typescriptlang.org/)
- [TailwindCSS](https://tailwindcss.com/)
- [Remix-Auth](https://github.com/sergiodxa/remix-auth)
## Examples provided
- [Action](https://remix.run/docs/en/v1/hooks/use-action-data) template with [ErrorBoundary](https://remix.run/docs/en/1.14.1/route/error-boundary).
- [Loader](https://remix.run/docs/en/main/route/loader) template fetching data server side.
- Session example with [Remix-Auth](https://github.com/sergiodxa/remix-auth).
- Login template and protected route with `isAuthenticated`.
- Remix [Form](https://remix.run/docs/en/main/components/form) examples
- Remix-friendly form components, most of which do not require `useState`.
- Global toast messages via [session flash](https://remix.run/docs/en/v1/utils/sessions#sessionflashkey-value).
- Example API routes returning JSON.
- AppFrame component using:
- Active navigation link with [NavLink](https://remix.run/docs/en/1.14.1/components/nav-link)
- Loading indicator when navigating with [useNavigation](https://remix.run/docs/en/1.14.1/hooks/use-transition)
- Close the mobile menu after navigation with [useLocation](https://remix.run/docs/en/1.14.1/other-api/react-router).
- Simple responsive layout
## Development
To run your Remix app locally, make sure your project's local dependencies are installed:
```**sh**
pnpm install
```
Afterwards, start the Remix development server like so:
```sh
pnpm run dev
```
Open up [http://localhost:3000](http://localhost:3000), and you should be ready to go!
## Upgrading Remix
A CLI utility to update/list all of your Remix dependencies together.
```sh
npx upgrade-remix
```