Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Node.js - Web 前端程式開發實務
Search
Joseph Chiang
May 02, 2013
Programming
2k
11
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Node.js - Web 前端程式開發實務
Joseph Chiang
May 02, 2013
More Decks by Joseph Chiang
See All by Joseph Chiang
不断归零的前端人生 - 2016 中国软件开发者大会
josephj
1
440
Let's Redux!
josephj
4
320
Automatic Functional Testing with Selenium and SauceLabs
josephj
2
320
From Hacker to Developer
josephj
1
170
tmuxinator
josephj
0
240
JavaScript Promise
josephj
0
240
Be an Internet Person
josephj
9
610
F2E Evolution
josephj
55
3.3k
F2E for Enterprise
josephj
42
5.7k
Other Decks in Programming
See All in Programming
Lean は証明の正しさを確認するためだけのツールって思ってませんか?
inoueasei
1
130
AIが無かった頃の素敵な出会いの話
codmoninc
1
340
そこに3びきプロダクトがいるじゃろう——生成AI時代における“価値が届かない理由”の構造
kosuket
0
380
ITヒヤリハットを整理してみた ~ライフサイクルと原因から考える再発防止策~
koukimiura
1
130
複数の Claude Code が"放置"されてしまう問題をCLI ダッシュボードを自作して解決した話
sumihiro3
1
610
霧の中の代数的エフェクト
funnyycat
1
450
20260722_microCMSで考える、AI時代のコンテンツ運用設計
yosh1
0
200
AI時代の仕事技芸論〜ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ(スクフェス仙台 2026バージョン)
kuranuki
0
800
AI時代に設計が 最大の生産性レバーになる 意図駆動開発とデータを消さない設計|Don't Delete Your Data or Your Intent — Design as the Deepest Lever in the AI Era
tomohisa
0
330
yield再入門 #phpcon
o0h
PRO
0
870
AWS DevOps AgentのAzure接続機能を検証して見えた活用法/Use Cases Verified for the AWS DevOps Agent's Azure Connectivity Feature
masakiokuda
1
190
Embedded SREと共に達成した会員管理システムのAWS移行 - SRE NEXT 2026 ランチスポンサーセッション
niftycorp
PRO
1
3.3k
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Designing for humans not robots
tammielis
254
26k
Code Review Best Practice
trishagee
74
20k
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
370
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.4k
Producing Creativity
orderedlist
PRO
348
40k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.3k
Building the Perfect Custom Keyboard
takai
2
830
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
370
First, design no harm
axbom
PRO
2
1.2k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
200
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.8k
Transcript
Copyright © 2012 FITPI. All rights reserved. ỴἝẖℼ/PEFKT భ؊۽ӱῘứℯ↩⇪‣
ᾣ℩ğᾠקდKPTFQIK 1
Copyright © 2012 FITPI. All rights reserved. "HFOEB ๏ /PEFKT൞喁
❖ ᅟğ'BDFCPPL 1MVSL ❖ 1)1 "QBDIF ๏ 㬪喁≾喁ੀྛ ❖ &WFOUESJWFO ଆ⊾߄ +BWB4DSJQU ࠧℭaྍaॹb 2
Copyright © 2012 FITPI. All rights reserved. 喁൞/PEFKT ๏ +BWB4DSJQU҂ᆺ≓ྛᄝ⏟´ఖഈb
❖ ۵"41 1)1 +41 Ⴕཌྷֹ໊֥b ❖ ২ྛྟቔ∊a۽ऎ֥4IFMM4DSJQUb ๏ ॖỒሱӮ㬪၂8FC4FSWFSb ๏ &WFOUESJWFO൙ࡱọb ๏ /POCMPDLJOH٤ೖb 3
Copyright © 2012 FITPI. All rights reserved. )FMMP8IP 4 var
argv = process.argv, who = (typeof argv[2] !== "undefined") ? argv[2] : "World"; console.log("Hello " + who + "!"); http://f2eclass.com/lab/nodejs/hello.js > node hello.js “Awoo” ⇔၂ἠࠎЧ֥4IFMM4DSJQU ໃῲ۽ቔஆӱ္ିႨ+BWB4DSJQUῲ⇔ਔĆ http://nodejs.org/docs/latest/api/index.html
Copyright © 2012 FITPI. All rights reserved. )FMMP8IP 5
var http = require("http"); http.createServer(function (req, res) { res.setHeader("Content-Type", "text/html"); res.write("Hello World!"); res.end(); }).listen(8000); console.log("Server running at http://localhost:8000"); http://f2eclass.com/lab/nodejs/http.js http://localhost:8000 http://nodejs.org/api/http.html#http_http ॹࡹ৫8FCයڛఖĆ
Copyright © 2012 FITPI. All rights reserved. /PEFKTֹ໊֥ 6 ᄝ:BIPP֥ࠎẒℿࡏἧ൞Ⴎ-".1ἧӮ֥
LAMP Linux Apache MySQL PHP ቔ∊༢ⅼ ∉යڛఖ ⊷ਘῠ ᗥ؊ӱൔ∽ /PEFKTϲဆਔ‥⊕࢘aۿି۷ルնĆ
Copyright © 2012 FITPI. All rights reserved. Ⴕ喁ݺẕĤ ๏ ⅼ၂8FCӱൔ∽ğభᗥ؊⇔+4b
❖ ᾞభ؊۽ӱ℩ạ⏟´ఖࢳ٢đᗥ؊၂∄Ⴕି৯ῘứĆ ❖ ॖ০Ⴈ+BWB4DSJQU&WFOUESJWFO֥หྟb ❖ ⏟´ఖἬṅ+BWB4DSJQUಯಖॖၛ+BWB4DSJQU!! ๏ $PNNPO+4ἲữğб⏟´ఖ۷Ⴕἧb ๏ /1.สࡱܵğ٤ӈಸၞν⊬ܵสࡱb ๏ ࠃ≍֥ഠಕb ๏ Ῐứ۷㬪ࠧℭ֥ᅟ∣Ⴈӱൔb 7
Copyright © 2012 FITPI. All rights reserved. $PNNPO+4 8 //
ಁա require ሡ֎෦ JavaScript ࡌೖ var mod = require("./commonjs-module.js"); mod.bar(); http://f2eclass.com/lab/nodejs/commonjs.js > node commonjs.js SFRVJSF≘ೆຓ҆+BWB4DSJQU http://f2eclass.com/lab/nodejs/commonjs-module.js // ฒෆ။ੋશҬᏓᏐ var foo = function () { console.log("foo is invoked"); }; // ॴ༗ཁඃ֎෦ଘऔతํ๏҃ሱੑधཁ༻ exports exports.bar = function () { console.log("bar is invoked"); }; commonjs.js commonjs-module.js ࢳ㢯ਔಆთṉ⅂∻ຓ҆⊷ჷ֥ܵ↜ⅳ
Copyright © 2012 FITPI. All rights reserved. /1.สࡱܵ ๏ /PEFKT1BDLBHF.BOBHFNFOU
๏ ௲ਲğw၂ἠࢳ㢯ٚσб⇧↜↜ⅳὕ؟֥ഠಕx ๏ Ⴈ/PEFKT⇔4IFMM4DSJQUa҆ઋ۬༢ⅼ㢻ݺẕĤ ❖ ॖႨ֥⊷ჷ؟ਔđᾞնն㦆ഒῘứℭᾇĆ 9
Copyright © 2012 FITPI. All rights reserved. Ⴈ-JWF3FMPBE ๏ ଢ仛ẵσ၂ṉọđ∉ࣼᇗྍᆜ
❖ ο$USM '൭ọᇗྍᆜޓ७ ๏ ν⊬/PEFKTϱ֥-JWF3FMPBEයڛఖ OQNJOTUBMMHTJNQMFMJWFSFMPBE ๏ ⬏ọ-JWF3FMPBEයڛఖ DE۽ቔଢ仛 TJNQMFMJWFSFMPBEQPSU ๏ ν⊬-JWF3FMPBE֥ग़㊒؊ (PPHMFෆ⇨o$ISPNF-JWF3FMPBEpࣼᅳ֞ 10 ۋ൳OQN֥ルն∻ٚьĆ
Copyright © 2012 FITPI. All rights reserved. Ⴈ-JWF3FMPBE 11 ẵσႵྩڿ
⏟´ఖ္۷ྍ $ISPNF֥-JWF3FMPBE℟ק යڛఖ ⏟´ఖ ࣋᠃࿈ઢ ᡒ䈕ҊᏓಈฒճใ Ꮕ౸Ꮣಈबॏ৽ࡌೖ <port>
Copyright © 2012 FITPI. All rights reserved. Ⴕ喁ὒẕĤ ๏ ྍਔbὕ҂ⴺ↛קa"1*္ӈᄝ۷ྍb
๏ ∉Ⴕޅྩڿ֤ᇗྍ⊋ྛOPEFFYFb ๏ ၹ㬪၂ἠ+BWB4DSJQU&SSPSࣼ4FSWFS㍂וb ๏ 僯Ⅲẵσẕ҂ၞđ֤թ౼'JMF4ZTUFN"1*b ๏ Ⴕޓ؟٤֥҄ẕč$BMMCBDL1BUUFSO b 12
Copyright © 2012 FITPI. All rights reserved. ၂ἠấ↪ࣼ㍂ו 13 //
ಁա require ሡ֎෦ JavaScript ࡌೖ var mod = require("./commonjs-module.js"); // foo(); // ະఆٛతവࣜʂ foo(); > node commonjs.js // ฒෆ။ੋશҬᏓᏐ var foo = function () { console.log("foo is invoked"); }; // ॴ༗ཁඃ֎෦ଘऔతํ๏҃ሱੑधཁ༻ exports exports.bar = function () { console.log("bar is invoked"); }; commonjs.js commonjs-module.js ஷ֞ໃק∕֥GPPݦൔࣼ৫ख़㍂ו ః֥ӱൔ∽ỉ؟ԛấa҂ಆ҆ඵו
Copyright © 2012 FITPI. All rights reserved. ҂ℳކ僯Ⅲẵσ֥թ౼ 14 http://f2eclass.com/lab/nodejs/html.js
http://f2eclass.com/lab/nodejs/html.html var http = require("http"), fs = require("fs"); // ඞਢ࠾༻ fs.readFile ሡ䈕Ҋᩇೖ fs.readFile("./html.html", function (err, html) { if (err) { throw err; } // ݐཱ Web ث http.createServer(function (request, response) { response.writeHeader(200, { "Content-Type": "text/html" }); response.write(html); response.end(); }).listen(8000); }); html.js > node html.js <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Node.js - ଌࢼท</title> <style type="text/css"> div { background: red; } </style> </head> <body> <div> Hello! ഝੋ Node.js తଌࢼทɻ </div> </body> </html> html.html ၂֊Ϝ8FC4FSWFSఏῲđᄜᄸ喁ڿIUNMIUNM҂ളིb၂קေᇗ⬏Ҍྛb
Copyright © 2012 FITPI. All rights reserved. ࢳ㢯ٚم 15 ๏
⦁ອਔ≾൞ἠޓࠃ≍֥ഠ⃯đ၂ἠ↜ⅳ ᇀഒႵἠၛഈ֥ࢳճ ❖ node-server https://github.com/cloudhead/node-static ❖ QBQFSCPZ https://github.com/felixge/node-paperboy ❖ IUUQTFSWFS https://github.com/nodeapps/http-server
Copyright © 2012 FITPI. All rights reserved. 16 ≾൞၂ἠޓྍ֥wӱൔ∽ යڛఖxđ↜ⅳ൞ޓ
؟֥đ൞Ⴎᧄࠃ≍֥ഠಕaࢳճ္ԛެམཞֹ ؟b ㍇ႨՎℿቔ㬪Ῐứđु֞⇝؟ቋྍ֥ۀ đℭ္с⇜҂ỗֹಀ૫Ớ↜ⅳaЯ௧ሱ࠭҂ ỗ4UVEZđ൞ޓႵ็≳ྟ֥b ၛ/PEFKT֥Чദ∽หྟ∻༵฿∱ྮ֥ࡏἧđ сק൞ໃῲέ୍⤨ቋᇗေ֥ӱൔ∽ᆭ၂đ൞ޓᆴ ֤ℭᾇ⊷֥b OPEFࢺℚཬ
Copyright © 2012 FITPI. All rights reserved. 17 ၛ/PEFῘứℂⅴ /PEFKT҂ᆺିႨῲῘứᅟཌྷἬӱൔ
∄္ॖၛ⇔ԛޓ؟ݺႨ֥۽ऎℂⅴ ၹഠಕࠃ≍1BDLBHFӑ؟ Ⴈ+BWB4DSJQUῘứℂⅴၘῂໄ㬪၂⊕ἀӖਔ ଢభն؟ὕᄝ$PNNBOE-JOF-FWFM
Copyright © 2012 FITPI. All rights reserved. ࡹ৫"1*໓ࡱ ๏ "1*໓ࡱğạჰ֥䩏ࢳčႵหקἲữĎ㸗ԛ໓
ࡱđ❣҂൞喁ྍỌ༆ %PYZHFO 1)1%PD b ๏ ٚьఃῘứᆀႨ֥ჭࡱaਔࢳۿିb ๏ :6*㸗ള໓ࡱࢥႨ၂ἠࢡ:6*%PD֥۽ऎb ❖ Ⴈ/PEFKT෮Ῐứ֥đν⊬⃪ႨOQNJOTUBMMHZVJEPDKT ๏ ༯≘၂ٺႵ䩏ࢳ֥ჰ HJUDMPOFHJUHJUIVCDPNNJJJDBTBTDSPMMQBHJOBUJPOHJU ๏ 㸗ԛ"1*໓ࡱ DETDSPMMQBHJOBUJPO ZVJEPD 18
Copyright © 2012 FITPI. All rights reserved. Ⴈ-JWF3FMPBE 19 ẵσႵྩڿ
⏟´ఖ္۷ྍ $ISPNF֥-JWF3FMPBE℟ק යڛఖ ⏟´ఖ ࣋᠃࿈ઢ ᡒ䈕ҊᏓಈฒճใ Ꮕ౸Ꮣಈबॏ৽ࡌೖ <port>
Copyright © 2012 FITPI. All rights reserved. 20 8FCࠧℭ๙⇫ Ἶಀa⇀ᄝaໃῲ֥έ⊕ቔم
ቋܞa҂ⴺࠧℭaۄ؇ޓ֥ۚ฿൩ ֞ቋ࣍ᖁশa‟ℼޓࠧℭੀṹ֥๙ᆩ ⁿ۲ሱ൞Ⴈ喁ჰẦӮ֥Ĥ ≾ถਔࢳჰaႄႨ⇀Ӯ۽ऎ ໃῲࣼॖၛ⃦⅌Ῐứ8FC֥ࠧℭ⇫༏ਔĆ
Copyright © 2012 FITPI. All rights reserved. 21 അ্݁ଋ http://www.slideshare.net/amix3k/comet-with-nodejs-and-v8
ٻอཹॅ ༗ࢿྉ࠶ճၚ Ꮧᎃ࠶ᚙ৽త ٻӬԕอ࣋ લၷछ༗Մೳ࿙ਜଉ ⁛⇧1PMMJOH
Copyright © 2012 FITPI. All rights reserved. ⁛⇧1PMMJOH 22 ҂ỗֹཟයڛఖứෂ⃪đ⇧↜൞ڎႵྍ⇫༏
http://f2eclass.com/lab/node/polling.html යڛఖ֥Ἄẩğ⃪⅂ਈἾ؟
Copyright © 2012 FITPI. All rights reserved. ṵℭᾇ֥1PMMJOH 23 ҂ỗֹཟයڛఖứෂ⃪đ⇧↜൞ڎႵྍ⇫༏
යڛఖ֥Ἄẩğ⃪⅂ਈಯ؟aط’䍛ℭᾇṵ http://f2eclass.com/lab/node/long-polling.html
Copyright © 2012 FITPI. All rights reserved. 24
Copyright © 2012 FITPI. All rights reserved. 25
Copyright © 2012 FITPI. All rights reserved. 26 ‥⊕1PMMJOH൞Ẫཟ֥ğ Ⴎ#SPXTFSཟ4FSWFS⇧↜൞ڎႵྍ⇫༏
QVMM ط٤Ⴕྍ⇫༏ࣼႮ4FSWFSཟ#SPXTFS QVTI -POHQPMMJOHᄝẖⅼཞ൞"QBDIF֥ᅟයڛఖ ൞٤ӈӹὸ∔ⅴ֥đቋݺὕ൞㍇ႨOHJOYࠇOPEF Ἤᧄ⁛⇧
Copyright © 2012 FITPI. All rights reserved. 8FC4PDLFU 27 ࡹ৫⅄ཟ๙֡
Ⴕ⊷ਘ֥ℭީҌཌྷẖẾđིିቋݺ֥ቔمĆ http://f2eclass.com/lab/node/websocket.html
Copyright © 2012 FITPI. All rights reserved. ࠧℭ๙⇫ཬ 28 8FC4PDLFU൞)5.-෮ầῲ֥ྍ⇐קđ⏟´ఖ
ℯቔ҂၂đ෮ၛ㢻ḰمṂఃۿᧄ၂ၢbⁿಯ֤⊀ Ớᾱҵ֥⏟´ఖ㍇Ⴈ-POHQPMMJOHaമᇀ㍇ႨἾ؈ ℭ௹֥'MBTI8FC4PDLFUb ေु⏟´ఖᆦჱ؇∻൞ڎν⊬'MBTIaℯቔ-POH QPMMJOH 'MBTI8FC4PDLFU 8FC4PDLFUčభᗥ؊ ေڿĎđ≾္ྌ७ਔϔĆ
Copyright © 2012 FITPI. All rights reserved. ቋࡄࢳ㢯ٚσĆ 29 http://socket.io/
4PDLFUJP္൞/PEFKT֥၂ἠสࡱ ॖၛሱྛ⊁Ṧ⏟´ఖὔa㢯קေ㍇Ⴈޅ⊕ٚσ ֥ӱൔᆺေ⇔၂ٺࣼॖၛঝ%
Copyright © 2012 FITPI. All rights reserved. ᄝ҂⏟´ఖ⊋ྛ 30 http://f2eclass.com/lab/node/socket-io.js
Ἥҳुु⏟´ఖ൞㍇Ⴈޅ⊕ٚم౼֤ྍ⇫༏֥b
Copyright © 2012 FITPI. All rights reserved. ℯቔᅶோᅟ֥๙ᆩ 31 ằႵದഈẖਔ၂≵ྍᅶோ
ఃᆞᄝ䍛ഈ֥ದି൬֞๙ᆩ http://f2eclass.com/lab/node/notification.js
Copyright © 2012 FITPI. All rights reserved. ཌྷἬ⊷ჷ 32 ๏
ܥקऊğ/PEFKT5BJXBO1BSUZ IUUQOPEFKTUX ๏ /PEFKT↉ഠಕ⇐ቔểሰℼ IUUQCPPLOPEFKTUX ๏ $/PEF/PEFKTህြᇏ໓ഠ⃯ IUUQDOPEFKTPSH ๏ /PEF1BDLBHFE.PEVMFT IUUQTOQNKTPSH
Copyright © 2012 FITPI. All rights reserved. 33 Q &
A