# KintoneAppBuilder

## 特性

- 使用 Python 3.8 的 **FastAPI**
- 结合 Typescript、Redux 和 react-router 的 **React 16**
- Postgres 数据库
- 用于迁移的 SqlAlchemy 和 Alembic
- 后端测试的 Pytest
- 前端测试的 Jest
- 遵循 Airbnb 代码风格的 Prettier/Eslint
- 方便开发的 Docker compose
- 用于实现后端和前端在同一端口上的 Nginx 反向代理

## 开发

此项目唯一的依赖应为 docker 和 docker-compose。

### 快速开始

启动项目并启用热加载
（首次操作可能需要一些时间）：

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

运行 alembic 迁移（针对 users 表）：

```bash
docker-compose run --rm backend alembic upgrade head
```

然后，导航到 http://localhost:8000

_注：如果你最初看到一个带有 `502：Bad Gateway` 页面的 Nginx 错误，你可能需要等待 webpack 构建开发服务器（nginx 容器构建得更快）。_

自动生成的文档将位于
http://localhost:8000/api/docs

### 重建容器：

```
docker-compose build
```

### 重启容器：

```
docker-compose restart
```

### 关闭容器：

```
docker-compose down
```

### 前端开发

作为 docker 内部运行的替代方案，直接使用 npm 有时更简单，
以便于更快的重加载。使用 npm 运行：

```
cd frontend
npm install
npm start
```

这应将你重定向到 http://localhost:3000

### 前端测试

```
cd frontend
npm install
npm test
```

## 迁移

使用 alembic 运行迁移。运行所有迁移：

```
docker-compose run --rm backend alembic upgrade head
```

创建新的迁移：

```
alembic revision -m "create users table"
```

并填写 `upgrade` 和 `downgrade` 方法。更多信息请参阅
[Alembic 的官方文档](https://alembic.sqlalchemy.org/en/latest/tutorial.html#create-a-migration-script)。

## 测试

存在一个用于前端和后端测试的辅助脚本：

```
./scripts/test.sh
```

### 后端测试

```
docker-compose run backend pytest
```

此命令之后也可以传递给 pytest 的任何参数

### 前端测试

```
docker-compose run frontend test
```

这与从前端目录内运行 npm test 是相同的

## 日志

```
docker-compose logs
```

或针对特定服务：

```
docker-compose logs -f name_of_service # frontend|backend|db
```

## 项目布局

```
backend
└── app
    ├── alembic
    │   └── versions # 迁移位置
    ├── api
    │   └── api_v1
    │       └── endpoints
    ├── core    # 配置
    ├── db      # 数据库模型
    ├── tests   # pytest
    └── main.py # 后端入口点

frontend
└── public
└── src
    ├── components
    │   └── Home.tsx
    ├── config
    │   └── index.tsx   # 常量
    ├── __tests__
    │   └── test_home.tsx
    ├── index.tsx   # 入口点
    └── App.tsx     # 处理路由
```