# elysia-Template

**Repository Path**: SuperWindcloud/elysia-template

## Basic Information

- **Project Name**: elysia-Template
- **Description**: elysia+bun+prisma+radix-ui+ react+tailwindcss+mysql+redis 的模版架构
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-02-28
- **Last Updated**: 2025-02-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Elysia with Bun runtime, using prisma +radix-ui +react +tailwindcss+ mysql+ redis 

 
 
## Frontend web

![2024-10-14 00.02.46.png](https://s2.loli.net/2024/10/14/iYnoLk8QFrzuOs1.png)

## Full stack development


  Project structure

  ```
  .
  ├── package.json
  ├── node_modules
  └── apps
    ├── frontend
    │   └── package.json
    └── backend
        └── package.json
  ```

 
- Backend

```ts
import { cors } from '@elysiajs/cors'
import { swagger } from '@elysiajs/swagger'
import { Elysia } from 'elysia'

import { authorityService, userService } from './services'

const app = new Elysia()
.use（cors（{arount：false}））
//为什么'origin：false'？因为我们已经在本地配置了一个用于前端开发的代理，所以我们为在线部署的NGINX设置了反向代理。
  .use(swagger())
  .use(authorityService)
  .use(userService)
  .listen(8090)

export type App = typeof app
```

- Frontend

  lib/server.ts

```ts
import { treaty } from '@elysiajs/eden'
import type { App } from 'bun-api'
const server = treaty<App>(import.meta.env.VITE_API_BASE_URL, {
  headers: [() => ({ authorization: `Bearer ${localStorage.getItem('token')}` })],
  onResponse: (res) => {
    if (!res.ok) {
      // do something
    }
  },
})
export default server
```

Use

```tsx
import server from '@/lib/server'

// in react
const login = useCallback(async () => {
  if (verificationCode) {
    const { data, error } = await server.authority.login.post({ email: email, randomCode: verificationCode })
    if (!error) {
      localStorage.setItem('token', data)
      console.log('Login successful!')
      location.reload()
    } else {
      console.log(`Login failed with the error message is ${error.value}.`)
    }
  } else {
    console.log('Please enter a verification code!')
  }
}, [verificationCode, email])
```

## Set your environment variables

```dotenv
MYSQL_DATABASE_URL=mysql://root:my-secret-pw@localhost:3306/bun-api
# need change
JWT_SECRETS=xxxxxxxxx

# You need to go to the corresponding platform mailbox to enable SMTP acquisition
# See the file at "utils/nodemailer.ts"
# need change
NODEMAILER_AUTH_EMAIL=xxxxxx
# need change
NODEMAILER_AUTH_PASS=xxxxxx

REDIS_HOST = localhost
REDIS_PORT = 6379
```

## Development

To start the development server run:

```docker
docker-compose up -d
```

```shell
bun run prisma:push
```

```shell
bun run dev
```

## Deploy app

```shell
bun run docker:deploy
```

or

```shell
docker-compose -f docker-compose-deploy.yml up -d --build
```

Open http://localhost:5173/ with your browser to see the `frontend` project.

Open http://localhost:8090/ with your browser to see the `backend` project.

Open http://localhost:8090/swagger with your browser to see the swagger.