# draw-and-guess

**Repository Path**: solution-wzj/draw-and-guess

## Basic Information

- **Project Name**: draw-and-guess
- **Description**: 基于Socket.io创建Vue+Konva的你画我猜项目，个人学习
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2022-02-15
- **Last Updated**: 2023-02-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Nodejs, Vue

## README

# 你画我猜 [ 个人学习版 ]

![demo](./demo.png)

## 技术架构

- Vue + Express

  作用: 基本的前后端脚手架

- **Socket.IO (核心)**

  原理: **对websocket和ajax的封装，基于事件监听的模式自行选择底层通讯方式**
  作用: 负责客户端 和 服务端交互, 将服务端拿到的数据存入 Vuex Store 中

- Konva 

  作用: 基于Canvas的绘图库


## 启动服务器

`draw-guess-server` 服务器目录
默认采用node启动，若想使用pm2或者nodemon启动，请自行修改package.json

```bash
- 安装依赖
  yarn
  
- 启动接口
  yarn start
```


## 启动前端

`draw-guess-web` 前端vue目录

```txt
- 安装依赖
  yarn
  
- 启动项目
  yarn start
```