基于socket.io 和canvas 实现的共享画板

2、运行

git clone <repository>

npm install

#>>>对于开发阶段：
#前端服务启动（利用webpack dev server）：
npm run dev

#后台服务启动(使用了nodemon 实时监听后端文件修改重启服务)
npm run start

#>>>对于生产阶段：
#打包前端文件,然后启动服务器即可
1、 npm run build
2、 npm run start
复制代码

3、功能：

开发完成:

• 画布缩放(Done)
• 画布颜色(Done)
• 画笔颜色(Done)
• 画笔粗细(Done)
• 历史记录（撤销，恢复）(Done)
• 聊天室(Done)
• 绘制协作(类似于石墨文档协作)（Done）

待开发的功能：

• UI 界面美化（待开发）
  • 打算使用UI库（material Design）
• 文字控件（待开发）
• 上传图片，基于图片绘图（待开发）
• 绘图带基本形状可拖拽调控大小 （待开发）
• 聊天功能丰富（表情，图片，音视频）（待开发）
  • webRTC 获取视频流数据，并传输
• 其它未知功能（x）

4、效果图

5、后话

这个应用实现的比较基础，还有很大的改进空间，感兴趣的你可以fork 一下，稍加完善。喜欢的你，赏赐一个小小的star吧，嘻嘻:smile:

6、扫一扫

作者	微信公众号	打赏