Load VSCode Editor

Load Node.js

Create a folder to work in called "webexercise" then download and copy into it these 2 zip files

Node starter code
Boston City starter code
chatApp starter code

Hello World using Node

node hello.js

Ex0: Our first Web Server

Ex0: Load and Run http-server.

navigate to folder BostonCity
open command window and type
npm install http-server
then run it by typing
http-server

Ex1: Read contacts.json File From Local Machine

Ex1: We will use JavaScript read0.js

var obj = require('./contact.json');
console.log(obj);

Ex2: Read bostonsmall.json File From Local Machine

Boston City Data

Ex2: Use read1.js and notice how it filters the json data

var obj = require('./bostonsmall.json');

var list = obj.data;

var greatercheck = function(row){
  return parseInt(row[18])>= 100000; // returns true or false
};

var newlist = list.filter(greatercheck);
console.log(newlist);
console.log(newlist.length);

Ex3: We put up a Web Server now to serve up bostonsmall.json

Ex3a: Use read2.js and http to go out to our Web Sever to pick up bostonsmall.json

Ex3b: Can you change read2.js to filter the data and only write out salaries above 100000 ?

Ex4: Running our own Web Server using "node"

Ex4: Use test0.js to run your own Web Server

var express = require('express');

var app = express();
app.get('/', function(req, res) {
    var num = Math.floor(Math.random() * 10);
    res.send('my lucky number is ' + num);
});
// listen on port 9000
app.listen(9000, function() {
    console.log('Example app listening on port 9000');
});

Ex5: Using "routes" to call another web server

Ex5: Use http-server to run Web Server No. 1. Then use test1.js to run Web Server No. 2.

var express = require('express');

var app = express();
app.get('/', function(req, res) {
    var num = Math.floor(Math.random() * 10);
    res.send('my lucky number is ' + num);
});
app.get('/color', function(req, res) {
    var num = Math.floor(Math.random() * 10);
    res.send('my lucky color is ' + num);
});
app.listen(9081, function() {
    console.log('Example app listening on port 9000');
});

// lets make an http.request to another machine
var http = require('http');
app.get('/mit', function(req, res) {
    var options = {
        host: 'localhost',
        port: 8080,
        path: 'bostonsmall.json'
    };
    var callback = function(response) {
        var str = '';

        //another chunk of data has been recieved, so append it to `str`
        response.on('data', function(chunk) {
            str += chunk;
        });

        //the whole response has been recieved, so we just print it out here
        response.on('end', function() {
            res.send(str);
            console.log(str);
        });
    };

    http.request(options, callback).end();
});

Ex6: Change the code above to return only salaries above 150K

Ex6: review read2.js below. Can we copy part of this into code above to return salaries above 150000

var obj = require("./bostonsmall.json");

var list = obj.data;

// define a function to check salaries
var greatercheck = function(row){
  return parseInt(row[18])>= 100000;
};
// filter salaries to return only those that pass check
var newlist = list.filter(greatercheck);
console.log(newlist);
console.log(newlist.length); // how many we found

Ex7: Demo of updating code to run on full data in bostoncitydata.json

Ex8: Chat App using Firebase

Ex8: Load your own photo by hosting either on Google Drive or on your own machine

npm install http-server

Chat App

Web Programming Mini Course at CCHS - Lecturer John R. Williams, assisted by Chao Cheng