-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
129 lines (114 loc) · 5.32 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=1024" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>Node.js | Teaching session presentation | by sirkitree</title>
<meta name="description" content="Introductions and basics of Node.js, socket.io, and what we're working on" />
<meta name="author" content="sirkitree" />
<link href="http://fonts.googleapis.com/css?family=Open+Sans:regular,semibold,italic,italicsemibold|PT+Sans:400,700,400italic,700italic|PT+Serif:400,700,400italic,700italic" rel="stylesheet" />
<link href="css/normalize.css" rel="stylesheet" />
<link href="css/tsp.css" rel="stylesheet" />
</head>
<body>
<div class="fallback-message">
<p>Your browser <b>doesn't support the features required</b> by impress.js, so you are presented with a simplified version of this presentation.</p>
<p>For the best experience please use the latest <b>Chrome</b>, <b>Safari</b> or <b>Firefox</b> browser.</p>
</div>
<div id="impress">
<!-- Slide 1 -->
<div class="step slide" data-x="-1000" data-y="-1500">
<h2><img id="logo" src="http://nodejs.org/images/logo.png" alt="node.js"> What is it?</h2>
<ul>
<li>server side</li>
<li>event driven<br>
<small><em>(enters a main loop, waiting for an event to occur and after responding to the event, returns to the loop and waits for the next event)</em></small></li>
<li>javascript</li>
</ul> ...that runs on the obscenely fast V8 engine from Google.
<p><a href="http://code.google.com/p/v8/" target="_blank">http://code.google.com/p/v8/</a></p>
</div>
<!-- Slide 2 -->
<div class="step slide" data-x="0" data-y="-1500" data-rotate-z="25">
<h2>What is it used for?</h2>
Here's an example of a very simple http server.
<script src="https://gist.github.com/500147.js?file=NodeServer-1.js"></script>
But there are many more uses.
</div>
<!-- Slide 2.1 -->
<div class="step slide sub-slide" data-x="0" data-y="-1500" data-rotate-y="90">
<ul>
<li>Static file servers</li>
<li>Web Application frameworks</li>
<li>Messaging middle ware</li>
<li>Servers for HTML5 multi player games</li>
</ul>
</div>
<!-- Slide 3 -->
<div class="step slide" data-x="1000" data-y="-1500" data-rotate-y="25">
<h2>Getting started:</h2>
<p>There are lots of ways to install.</p>
<ul>
<li><strong>OS X</strong>:<br>
<em>$ brew install node</em><sup>*</sup><br>
<em>$ port install node</em><sup>*</sup></li>
<li><strong>Linux</strong>:<br>
<em>$ apt-get install node</em></li>
<li><strong>Windows/all</strong>: <em><a href="http://nodejs.org/#download" target="_blank">http://nodejs.org/#download</a></em></li>
</ul>
<small><sup>*</sup> You'll need <a href="https://developer.apple.com/xcode/" target="_blank">Xcode</a> or this <a href="http://lb.cm/o2u" target="_blank">GCC Installer</a> for OS X</small>
</div>
<!-- Slide 4 -->
<div class="step slide" data-x="2000" data-y="-1500" data-rotate-z="115">
<h2>NVM: <small><a href="https://github.com/creationix/nvm" target="_blank">Node Version Manager</a></small></h2>
<p>Node Version Manager is a tool for switching between releases of node. This is useful for testing your code before deployment, or testing your open source code against different versions of node. There have been API changes lately so it’s worth having a sanity check against major releases.</p>
</div>
<!-- Slide 4.1 -->
<div class="step slide sub-slide" data-x="2000" data-y="-1500" data-rotate-z="90" data-rotate-x="-90">
<h2>NVM: Usage</h2>
<ul>
<li><strong>Install</strong>:<br>
<em>$ nvm install v0.6.12</em></li>
<li><strong>Use</strong>:<br>
<em>$ nvm use v0.6.12</em></li>
</ul>
</div>
<!-- Slide 5 -->
<div class="step slide" data-x="3000" data-y="-1500" data-rotate-z="25">
<h2>NPM: <small><a href="http://npmjs.org/" target="_blank">Node Package Manager</a></small></h2>
<h3 class="npm-logo">NPM</h3>
<p>This is a package manager that many people add to in order to make it very simple to install their code.</p>
</div>
<!-- Slide 5.1 -->
<div class="step slide sub-slide" data-x="3000" data-y="-1500" data-rotate-y="90">
<h2>NPM: Usage</h2>
<ul>
<li><strong>Install</strong>:<br>
<em>$ curl http://npmjs.org/install.sh | sh </em>
<small><em>(included by default with Node.JS, since v0.6.3)</em></small></li>
<li><strong>Use</strong>:<br>
<em>$ npm install socket.io</em><br>
<small><em>(installs in ./node_modules)</em> OR</small><br>
<em>$ sudo npm install -g socket.io</em><br>
<small><em>(installs globally, typically in ~/node_modules)</em></small></li>
</ul>
</div>
<!-- Finis -->
<div id="finis" class="step slide">
<h1>Finis</h1>
</div>
</div>
<div class="hint">
<p>Use a spacebar or arrow keys to navigate</p>
</div>
<script>
if ("ontouchstart" in document.documentElement) {
document.querySelector(".hint").innerHTML = "<p>Tap on the left or right to navigate</p>";
}
</script>
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/tsp.js"></script>
<script src="js/impress.js"></script>
<script>impress().init();</script>
</body>
</html>