• Monday morning: finish N queens animation and present my work
• Monday afternoon:

JS aside: First-Class Functions and Functions Expressions: you can treat functions like primitive data such as strings, numbers -> you can pass functions around, set them as variables, use them as another function's params

An expression = a block of codes that results in a value -> function expressions are possible because functions are first-class.

Objects and Object Literals:

Objects are collections of name-value pairs

JS Fundamentals: strong relationship between objects, functions and closures. 2 underused features: timer and regexp

Prototypal Inheritance and Function Construction:

• Inheritance: one object can access properties and methods of another one
• Function constructor: a normal function that is used to construct objects. "this" points to a new empty object

Object1.prototype.methodName -> add new methods to the prototype object -> the prototype is for all objects created from Object1

When a new object is created by function constructor -> all new objects' prototypes are pointed to prototype property.

• Tuesday morning: clean redundant codes in N queens animation

Udemy course: Learn and understand NodeJs: understand require, module.exports, different pattern of using module.exports

REQUIRE

• E.g. var greet = require(./greet) -> automatically assume extension name ".js" -> look for greet.js -> if not exist and greet is a folder, it looks into the folder and take index.js
• Wednesday afternoon: Socket.io for real time communication -> make a simple chat app
• Wednesday evening: make a to-do list shared between clients
• Thursday morning:

Socket.io is a framework. Socket.io allows us to utilise WebSocket and has fallback support.

WebSocket is a protocol on top of HTTP.

XHR Polling vs WebSocket vs SSE: all three protocols start with HTTP request - response at the beginning to open connection.

After that, browser and server will check each other protocol support to upgrade to WS if possible.

XHR Polling: server only responses when there are requests, client - to - server

WS: bidirectional communication -> server and clients send data back and forth whenever they have data

SSE: Server-Sent Events: servers send data to clients whenever the server has data

HTTP2 - SPDY: minimise response time

GZIP - can be used to compress HTML and then send to client, browser in client side will decompress and render HTML

TODO: read abt WS, Socket.io

To tell Socket.IO to use WebSocket only instead of a few XHR requests first, just add this to the Node server:

io.set('transports', ['websocket']);

and client side:

var socket = io({transports: ['websocket']});

Socket.io configuration middleware

io.use(function(socket, next) {
/* ... */
next(null, true);
});

Socket.io namespaces

Server :

io.of('/someNamespace').on('connection', function(socket){
    socket.on('customEvent', function(customEventData) {
       /* ... */
    });
});

io.of('/someOtherNamespace').on('connection', function(socket){
    socket.on('customEvent', function(customEventData) {

   /* ... */

    });
});

Client:

var someSocket = io('/someNamespace');`

someSocket.on('customEvent', function(customEventData) {`

   /* ... */`

});`

var someOtherSocket = io('/someOtherNamespace');`

someOtherSocket.on('customEvent', function(customEventData) {`

   /* ... */`

});`

Socket.io rooms: divide groups dynamically, clients join and leave rooms; manage rooms and emit events to subset of sockets in a room

io.on('connection', function(socket) {
   socket.on('join', function(roomData) {
       socket.join(roomData.roomName);
   })

   socket.on('leave', function(roomData) {
       socket.leave(roomData.roomName);
   })
});

Emit events to all sockets in a room

io.on('connection', function(socket){
   io.in('someRoom').emit('customEvent', customEventData);
});

Emit events everyone except the sender

io.on('connection', function(socket){
   socket.broadcast.to('someRoom').emit('customEvent', customEventData);
});

• Thursday afternoon & Friday morning: make a chat with multiple rooms and namespaces

• Friday afternoon:

####SERVER-SIDE RENDERING: traditional way

####CLIENT-SIDE RENDERING

• Saturday morning: talk with Nguyen about side project - algorithm and animation with D3js

#### WEEKEND TODO: SELECTION SORT ALGORITHMS -