实时流#30:使用WebSocket创建实时共享画布



从sfpc.io直播!
在本视频中,我使用p5.js和WebSockets讨论了如何通过客户端-服务器编程在多个用户之间创建实时协作绘图画布。涵盖的主题:Node.js,Express.js,Socket.io,p5.js。
再加上一个新的阶段的开始:10分钟编码挑战!

12:40-处理中的Starfield编码挑战
46:57-今天的项目介绍
51:00-如何安装和使用Node.js
1:04:59-将Web框架Express.js添加到主机文件
1:24:29-安装Socket.io与服务器建立套接字连接
1:41:38-将客户端连接到服务器以共享绘图画布
1:53:10-结论

编码挑战源代码:

处理:https://github.com/CodingTrain/Rainbow-Code/tree/master/challenges/CC_01_StarField
p5.j​​s:https://github.com/CodingTrain/Rainbow-Code/tree/master/challenges/CC_01_StarField_p5.js

WebSocket / p5.js项目源代码:https://github.com/CodingTrain/Rainbow-Code/tree/master/sockets

联系人:https://twitter.com/shiffman

节点:https://nodejs.org/en/
Socket.io:http://socket.io/
快递:http://expressjs.com/
p5.j​​s:https://p5js.org/

了解JavaScript基础知识:

有关数据和API的更多信息:

帮助我们字幕和翻译此视频!

http://amara.org/v/Qbsw/

Conduct行为准则:https://github.com/CodingTrain/Code-of-Conduct。

33 comments
  1. Wow I think the code challenge is so cool. By the time you start the lecture [i think] everyone is so enthusiastic to learn from you after seeing you program like that … lol

  2. XDD I enjoyed and laughed a lot with this coding challenge, and the result was so cool!

    Could you post the link to the JavaScript version in description, please?

  3. Hi Dan,
    Can you explain me how to use web socket on Processing. I wanna read a data from server and animate accordingly on my processing CANVAS

  4. Hi, my server.js file looks exactly like yours but I still get the "cannot GET/" message on localhost:3000. i tried with app.use(express.static(__dirname + "/public")); but still no results, I can't get further; console sais "failed to load resource: the server responded with a sttus of 404( not found)" this is driving me insane what am I doing wrong

  5. Great Job – Talk … as … fast…. as… you … like! I don't think you realise how much teaching your actually doing when your talking! It's great, really it is. It's helping to change my thought process when trying to navigate and learn javascript. I have never coded applications before, (I'm a system admin devops guy, so all my code are scripts, deployments, monitoring systems etc, and the occasional app that only needs to function, not look good!), and I've been in technology … a little while 😉

    I'm looking into node just for fun, so that I can understand what it is most of my devs do at work. (I run infrastructure that holds about 900 java apps).

    I just watched your 10 minute challenge building that star thingy it gave me an unbelievable insight into why no dev ever says no when they are given a challenge! I love that. I can't WAIT for the database stuff, …. all I need for you to do after that, is do some stuff in electron-shell …. and I'll be halfway to creating a million dollar app 🙂 that's the dream anyway hehe

Comments are closed.