Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/oieduardorabelo/hidash
CRUD example using tRPC, Prisma ORM, React Query, Next.js and Tailwind CSS
https://github.com/oieduardorabelo/hidash
Last synced: 10 days ago
JSON representation
CRUD example using tRPC, Prisma ORM, React Query, Next.js and Tailwind CSS
- Host: GitHub
- URL: https://github.com/oieduardorabelo/hidash
- Owner: oieduardorabelo
- Created: 2022-07-04T17:56:16.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-07-05T05:33:51.000Z (over 2 years ago)
- Last Synced: 2024-04-14T19:10:11.519Z (7 months ago)
- Language: TypeScript
- Size: 1.87 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# CRUD Example using tRPC, Prisma ORM, React Query, Next.js and Tailwind CSS
### Features
- 🧙♂️ E2E typesafety with [tRPC](https://trpc.io)
- ⚡ Full-stack React with Next.js
- ⚡ tRPC routes are deployed in Vercel Lambda
- ⚡ Database with Prisma
- ⚙️ VSCode extensions
- 🎨 ESLint + Prettier
- 💚 CI setup using GitHub Actions:
- ✅ E2E testing with [Playwright](https://playwright.dev/)
- ✅ Linting
- 🔐 Validates your env vars on build and start
- 🐳 Docker and Docker Compose for local development### Setup
**yarn:**
```bash
git clone [email protected]:oieduardorabelo/hidash.git
cd hidash
yarn
yarn dx
```The `dx` command will make sure to:
- Download required Docker images
- Sync Prisma Schema with Postgres
- Generate TypeScript types and React Hooks based on SQL Schema
- Run Next.js in DEV modeWith that in place, you can run tests, develop new features and play with the UI!
### Requirements
- Node >= 14
- Docker (for running Postgres)### Commands
```bash
yarn build # runs `prisma generate` + `prisma migrate` + `next build`
yarn db-nuke # resets local db
yarn dev # starts next.js
yarn dx # starts postgres db + runs migrations + seeds + starts next.js
yarn test-dev # runs e2e tests on dev
yarn test-start # runs e2e tests on `next start` - build required before
yarn test:unit # runs normal jest unit tests
yarn test:e2e # runs e2e tests
```### E2E testing with [Playwright](https://playwright.dev/)
With your local environment up and running, you can run and test e2e scenarios using Playwright.
![](./docs/01-e2e-test.png)
![](./docs/02-e2e-test.png)
![](./docs/03-e2e-test.png)
![](./docs/04-e2e-test.png)### Deployment using [Render](https://render.com/)
The project contains a [`render.yaml`](./render.yaml) [_"Blueprint"_](https://render.com/docs/blueprint-spec) which makes the project easily deployable on [Render](https://render.com/).
Go to [dashboard.render.com/blueprints](https://dashboard.render.com/blueprints) and connect to this Blueprint and see how the app and database automatically gets deployed.
tRPC routes are deployed in Vercel Lambda taking advantaged of their global CDN.
![](./docs/00-render.png)