Enviar búsqueda
Cargar
WebSocketとCanvasでオンライン対戦オセロを作ろう 第1回 基礎の基礎
•
Descargar como KEY, PDF
•
3 recomendaciones
•
2,561 vistas
Matsuoka Toru
Seguir
WebSocketとCanvasをつかったオンライン対戦のオセロを作る企画 第1回 基礎の基礎
Leer menos
Leer más
Tecnología
Denunciar
Compartir
Denunciar
Compartir
1 de 13
Descargar ahora
Recomendados
WebSocketとCanvasでオンライン対戦オセロを作ろう 第2回 全体の設計
WebSocketとCanvasでオンライン対戦オセロを作ろう 第2回 全体の設計
Matsuoka Toru
Html5の通信対戦ゲームをテスト駆動開発で作ってみた
Html5の通信対戦ゲームをテスト駆動開発で作ってみた
Yuusuke Takeuchi
日曜プログラマーが 1週間くらいで通信対戦ゲームを作ってみた
日曜プログラマーが 1週間くらいで通信対戦ゲームを作ってみた
Yuusuke Takeuchi
日曜プログラマーがHtml5とかで通信対戦ゲームを作ってます
日曜プログラマーがHtml5とかで通信対戦ゲームを作ってます
Yuusuke Takeuchi
Coffee Scriptでenchant.js
Coffee Scriptでenchant.js
Naoyuki Totani
知って『得』する! Hinemos活用術
知って『得』する! Hinemos活用術
hinemos_atomitech
Node.jsで対戦ゲーム作ったよ
Node.jsで対戦ゲーム作ったよ
Yuusuke Takeuchi
Node.jsなら日曜プログラマーでも簡単に通信対戦ゲームが作れる
Node.jsなら日曜プログラマーでも簡単に通信対戦ゲームが作れる
Yuusuke Takeuchi
Recomendados
WebSocketとCanvasでオンライン対戦オセロを作ろう 第2回 全体の設計
WebSocketとCanvasでオンライン対戦オセロを作ろう 第2回 全体の設計
Matsuoka Toru
Html5の通信対戦ゲームをテスト駆動開発で作ってみた
Html5の通信対戦ゲームをテスト駆動開発で作ってみた
Yuusuke Takeuchi
日曜プログラマーが 1週間くらいで通信対戦ゲームを作ってみた
日曜プログラマーが 1週間くらいで通信対戦ゲームを作ってみた
Yuusuke Takeuchi
日曜プログラマーがHtml5とかで通信対戦ゲームを作ってます
日曜プログラマーがHtml5とかで通信対戦ゲームを作ってます
Yuusuke Takeuchi
Coffee Scriptでenchant.js
Coffee Scriptでenchant.js
Naoyuki Totani
知って『得』する! Hinemos活用術
知って『得』する! Hinemos活用術
hinemos_atomitech
Node.jsで対戦ゲーム作ったよ
Node.jsで対戦ゲーム作ったよ
Yuusuke Takeuchi
Node.jsなら日曜プログラマーでも簡単に通信対戦ゲームが作れる
Node.jsなら日曜プログラマーでも簡単に通信対戦ゲームが作れる
Yuusuke Takeuchi
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
Maria Levchenko
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
Antenna Manufacturer Coco
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
Principled Technologies
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
Enterprise Knowledge
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
Igalia
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
vu2urc
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Katpro Technologies
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
Enterprise Knowledge
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
wesley chun
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Neo4j
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Delhi Call girls
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
UK Journal
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
Enterprise Knowledge
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Anna Loughnan Colquhoun
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
wesley chun
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
The Digital Insurer
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
Results
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
Khem
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
Puma Security, LLC
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
sudhanshuwaghmare1
2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot
Marius Sescu
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
Expeed Software
Más contenido relacionado
Último
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
Maria Levchenko
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
Antenna Manufacturer Coco
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
Principled Technologies
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
Enterprise Knowledge
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
Igalia
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
vu2urc
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Katpro Technologies
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
Enterprise Knowledge
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
wesley chun
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Neo4j
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Delhi Call girls
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
UK Journal
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
Enterprise Knowledge
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Anna Loughnan Colquhoun
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
wesley chun
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
The Digital Insurer
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
Results
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
Khem
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
Puma Security, LLC
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
sudhanshuwaghmare1
Último
(20)
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
Destacado
2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot
Marius Sescu
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
Expeed Software
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
Pixeldarts
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
ThinkNow
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
marketingartwork
Skeleton Culture Code
Skeleton Culture Code
Skeleton Technologies
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
Neil Kimberley
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
contently
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
Albert Qian
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Kurio // The Social Media Age(ncy)
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
Search Engine Journal
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
SpeakerHub
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
Clark Boyd
Getting into the tech field. what next
Getting into the tech field. what next
Tessa Mero
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Lily Ray
How to have difficult conversations
How to have difficult conversations
Rajiv Jayarajah, MAppComm, ACC
Introduction to Data Science
Introduction to Data Science
Christy Abraham Joy
Time Management & Productivity - Best Practices
Time Management & Productivity - Best Practices
Vit Horky
The six step guide to practical project management
The six step guide to practical project management
MindGenius
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
RachelPearson36
Destacado
(20)
2024 State of Marketing Report – by Hubspot
2024 State of Marketing Report – by Hubspot
Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
Skeleton Culture Code
Skeleton Culture Code
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
Getting into the tech field. what next
Getting into the tech field. what next
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
How to have difficult conversations
How to have difficult conversations
Introduction to Data Science
Introduction to Data Science
Time Management & Productivity - Best Practices
Time Management & Productivity - Best Practices
The six step guide to practical project management
The six step guide to practical project management
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
WebSocketとCanvasでオンライン対戦オセロを作ろう 第1回 基礎の基礎
1.
WebSocket Canvas
- -
2.
WebSocket Canvas
3.
WebSocket Canvas
4.
WebSocket
Push
5.
XHR
Pull
6.
WebSocket Push
7.
WebSocket HelloWorld <!doctype html>
var ws = require("websocket-server") <title>hello websocket</title> var server = ws.createServer(); <input id="name" type="textfield" onchange="send(this);" /> server.addListener("connection", function(conn){ <div id="msg"></div> conn.addListener("message", function(name){ <script type="text/javascript"> server.broadcast("Hello " + name.toUpperCase()); var conn; }); (function() { }); if(window["WebSocket"]) { server.listen(8080); url = "ws://{ }:8080/"; conn = new WebSocket(url); conn.onmessage = function(e) { document.getElementById("msg").innerHTML = e.data; } } })(); var send = function(m) { if(conn) { name = m.value; conn.send(name); } } </script>
8.
WebSocket
HTTP TCP URL scheme ws:/ wss:/ / / OK http://dev.ariel-networks.com/Members/inoue/websocket/
9.
Canvas javascript
10.
Canvas HelloWorld
<!doctype html> <title>Hello Canvas</title> <canvas id="canvas" width="300" height="200"></canvas> <script> var canvas = document.getElementById("canvas"); (function(){ var ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.strokeRect(20, 20, 260, 160); ctx.beginPath(); ctx.fillStyle = 'rgb(188, 0, 45)'; ctx.arc(150, 100, 40, Math.PI*2, false); ctx.fill(); })(); </script>
11.
Canvas 3D Video
*1 *1: Video Canvas →http://www.craftymind.com/factory/html5video/CanvasVideo.html
12.
WebSocket Canvas
Notas del editor
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
Descargar ahora