Skip to content

Commit c29ce91

Browse files
noelkingnoelking
committed
Added CoderDojo introduction to node.js course
0 parents  commit c29ce91

File tree

3 files changed

+233
-0
lines changed

3 files changed

+233
-0
lines changed

‎README.md‎

Lines changed: 172 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
# CoderDojo - Start Node
2+
3+
This is an introduction to server side programming in Node.js and was created for CoderDojo members.
4+
5+
## Step 1 Install Node
6+
7+
Install Node from http://nodejs.org
8+
9+
## Step 2 Setup the project
10+
11+
Create the project folder
12+
13+
````
14+
mkdir coderdojo-start-node
15+
````
16+
17+
Now create a folder called __public__, this is the folder whereyou will add the html, css and javascript code
18+
19+
````
20+
cd coderdojo-start-node
21+
mkdir public
22+
````
23+
24+
## Install express
25+
26+
__npm__ is Node Package Manager allows you to install Node Packages, to run a web server we are going to use a node package called __express__ will enable us to create a server easily that can accept web requests.
27+
28+
Now run
29+
30+
````
31+
npm install express
32+
````
33+
34+
## Now lets create our Node.js file
35+
36+
Now in the home directory __coderdojo-start-node__ save a new file called __app.js__. Inside app.js add the following code
37+
38+
````
39+
var express = require('express');
40+
var app = express();
41+
42+
43+
app.get('/coderdojo', function(req, res){
44+
res.send('Be cool');
45+
});
46+
47+
var server = app.listen(3000, function() {
48+
console.log('Listening on port %d', server.address().port);
49+
});
50+
51+
````
52+
This code creates your first server and first http call
53+
54+
## Run your code
55+
56+
From inside directory __coderdojo-start-node__ open a command terminal and run
57+
58+
````
59+
node app
60+
61+
````
62+
We are running __app__ because the file is called __app.js__
63+
64+
You should see the following output from this command
65+
66+
````
67+
$ node app
68+
Listening on port 3000
69+
````
70+
71+
This is tell you that a server has started on your machine at port __3000__
72+
73+
You can stop the server at any time by running ````CTRL+C````
74+
75+
## Open your browser
76+
77+
Navigate to
78+
79+
````
80+
http://localhost:3000
81+
````
82+
83+
You get an error right! But remember in your code you told the server to reference __/coderdojo__ so you need to navigate to
84+
85+
````
86+
http://localhost:3000/coderdojo
87+
````
88+
89+
Now see what happens
90+
91+
## We now need update app.js to read your html code from the public folder
92+
93+
Update app.js with the following code
94+
95+
````javascript
96+
var express = require('express');
97+
var app = express();
98+
var path = require('path');
99+
100+
app.use(express.static(path.join(__dirname, 'public')));
101+
102+
app.get('/coderdojo', function(req, res){
103+
res.send('Be cool');
104+
});
105+
106+
var server = app.listen(3000, function() {
107+
console.log('Listening on port %d', server.address().port);
108+
});
109+
````
110+
111+
## Now add your html and css code
112+
113+
114+
````html
115+
<html>
116+
<head>
117+
<style rel="stylesheet" type="text/css">
118+
body {
119+
background: blue;
120+
color: white;
121+
font-family: Tahoma;
122+
}
123+
124+
h1 {
125+
color: pink;
126+
}
127+
128+
div.code {
129+
width: 300px;
130+
padding: 5px;
131+
border: 1px solid black;
132+
background: lightgray;
133+
color: navy;
134+
}
135+
136+
div.url {
137+
width: 300px;
138+
padding: 5px;
139+
border: 1px solid orange;
140+
background: navy;
141+
color: lightgray;
142+
}
143+
</style>
144+
</head>
145+
<body>
146+
<h1>CoderDojo Web Development</h1>
147+
<p>Welcome to CoderDojo DCU Introduction to Node.js</p>
148+
<h2>Install Node:</h2>
149+
<p>Go to <br/>
150+
<div class="url">http://nodejs.org</div>
151+
</p>
152+
<h2>Install express: </h2>
153+
<p><div class="code">npm install express</div>
154+
</p>
155+
<h2>To run your new website: </h2>
156+
<p><div class="code">node app</div>
157+
</p>
158+
<h2>Open your website: </h2>
159+
<p><div class="url">http://localhost:3000</div>
160+
</p>
161+
</body>
162+
</html>
163+
````
164+
165+
166+
167+
168+
169+
170+
171+
172+

‎app.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
var express = require('express');
2+
var app = express();
3+
var path = require('path');
4+
5+
app.use(express.static(path.join(__dirname, 'public')));
6+
7+
app.get('/coderdojo', function(req, res){
8+
res.send('Be cool');
9+
});
10+
11+
var server = app.listen(3000, function() {
12+
console.log('Listening on port %d', server.address().port);
13+
});

‎public/index.html‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
<html>
2+
<head>
3+
<style rel="stylesheet" type="text/css">
4+
body {
5+
background: blue;
6+
color: white;
7+
font-family: Tahoma;
8+
}
9+
10+
h1 {
11+
color: pink;
12+
}
13+
14+
div.code {
15+
width: 300px;
16+
padding: 5px;
17+
border: 1px solid black;
18+
background: lightgray;
19+
color: navy;
20+
}
21+
22+
div.url {
23+
width: 300px;
24+
padding: 5px;
25+
border: 1px solid orange;
26+
background: navy;
27+
color: lightgray;
28+
}
29+
</style>
30+
</head>
31+
<body>
32+
<h1>CoderDojo Web Development</h1>
33+
<p>Welcome to CoderDojo DCU Introduction to Node.js</p>
34+
<h2>Install Node:</h2>
35+
<p>Go to <br/>
36+
<div class="url">http://nodejs.org</div>
37+
</p>
38+
<h2>Install express: </h2>
39+
<p><div class="code">npm install express</div>
40+
</p>
41+
<h2>To run your new website: </h2>
42+
<p><div class="code">node app</div>
43+
</p>
44+
<h2>Open your website: </h2>
45+
<p><div class="url">http://localhost:3000</div>
46+
</p>
47+
</body>
48+
</html>

0 commit comments

Comments
 (0)