https://github.com/mikan3rd/nest-next-sample
NestJS + Next.js sample application / Backend and Frontend use only TypeScript!!!
https://github.com/mikan3rd/nest-next-sample
apollo backend docker frontend graphql nestjs nextjs prisma react reactjs typescript
Last synced: 16 days ago
JSON representation
NestJS + Next.js sample application / Backend and Frontend use only TypeScript!!!
- Host: GitHub
- URL: https://github.com/mikan3rd/nest-next-sample
- Owner: mikan3rd
- Created: 2020-10-22T15:28:25.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2025-04-03T21:49:15.000Z (22 days ago)
- Last Synced: 2025-04-03T22:32:42.761Z (22 days ago)
- Topics: apollo, backend, docker, frontend, graphql, nestjs, nextjs, prisma, react, reactjs, typescript
- Language: TypeScript
- Homepage:
- Size: 1.72 MB
- Stars: 141
- Watchers: 1
- Forks: 16
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# This project use only TypeScript!!
## Tech stack
- Backend
- NestJS
- Prisma
- GraphQL
- Frontend
- Next.js / React
- GraphQL Code Generator
- Apollo Client
- Semantic UI
- emotion
- Other
- yarn workspace
- ESLint / Prettier / husky
- Docker / Docker Compose
- Vercel
- GCP (CloudSQL / Cloud Run / Cloud Build)
## Getting Started
### Docker
You can launch the development environment with one command!
```bash
docker-compose up
```
After successful launch, go to the following URL in your browser!
- Backend: http://localhost:3300/graphql
- Frontend: http://localhost:3000
:warning: Containers have dependencies, but the next container may start to be started before the preparation is complete.
If it fails for that reason, please specify the start-up separately as follows.
```bash
docker-compose up mysql
```
See `docker-compose.yaml` if you want to know more.
### Local
1. Prepare MySQL and create a database for development.
Then create file `packages/backend/.env` and fill in the environment variables.
```.env.example
DATABASE_URL="mysql://username:password@localhost:3306/nest_next_sample"
```
2. Do a database migration.
```bash
cd packages/backend
yarn install
yarn migrate:deploy
```
3. Run the startup command for backend.
```bash
yarn start:dev
```
After successful launch, go to http://localhost:3300/graphql in your browser!
4. Create file `packages/frontend/.env` and fill in the environment variables.
```.env.example
SERVER_APOLLO_URI="http://localhost:3300"
PUBLIC_APOLLO_URI="http://localhost:3300"
```
5. Run the startup command for frontend.
```bash
cd packages/frontend
yarn dev
```
After successful launch, go to http://localhost:3000 in your browser!
## GraphQL exmaple
```graphql
mutation {
saveTask(task: { title: "test", categoryIds: [] }) {
id
title
categories {
id
name
color
}
}
}
```
```graphql
query {
task(id: 1) {
id
title
taskContents {
id
checked
}
categories {
id
name
}
}
}
```