Real-Time Web with Node.js

Real-Time Web with Node.js

Год выпуска: 2014
Производитель: frontendmasters
производителя: frontendmasters/courses/realtime-html5-nodejs/
Автор: Kyle Simpson
Продолжительность: 5 hours, 23 min
Тип раздаваемого материала: Видеоклипы
Язык: Английский
Описание: Learn the HTML5 APIs you need to know for real-time communications such as canvas/video, sockets, getUserMedia, and WebRTC. Then dive into Node.js and learn all about how to use it from the ground up in the command line to communicating with HTML5 in real-time through asynchronous code in Node.js.

Содержание
Table of Contents
HTML5 API's
Introduction

00:00:00 - 00:03:52
Introduction
Kyle begins the course with a brief introduction about his work experience and a few open-source projects he actively maintains. He also discusses the book series he's in the process of writing. - //getify.me
Into Node.js

00:03:53 - 00:10:19
Into Node.js
Kyle sets up the scope for what will be covered in this course. He'll be focusing on three major topics: HTML5, Node.js, and WebRTC.
HTML5 Facades

00:10:20 - 00:14:37
HTML5 Facades
Before jumping into the HTML5 APIs topic, Kyle talks a little about the facades he likes to wrap around these APIs. Facades add a thin layer of abstraction between the actual API and the production code using it. - //github/getify/h5ive
Storage API

00:14:38 - 00:24:11
Storage API
Local storage and sessions storage are two APIs that have been around for a long time. They give applications the ability to persist data in the browser. The difference between local storage and session storage is the duration the data is stored.
Canvas API

00:24:12 - 00:29:22
Canvas API
Graphics can be dynamically drawn in the browser using the canvas API. Kyle walks through the façade he created to simplify the canvas methods and enable features like chaining.
getUserMedia

00:29:23 - 00:33:56
getUserMedia
The getUserMedia API allows the browser to attach to media streams from the user. This can be a webcam, a microphone, or even the user's screen in the case of desktop sharing.
requestAnimationFrame

00:33:57 - 00:41:26
requestAnimationFrame
The requestAnimationFrame API allows developers to ask the browser to make visual updates at the most optimal time. This is often used for animating objects but could apply for any visual update that's supposed to occur periodically.
Web Sockets

00:41:27 - 00:51:53
Web Sockets
Web Sockets make an initial request to the server, but unlink a traditional request, the connections remains open. This allows for less latency and faster communication. Kyle demonstrates using the socket.io framework to work with Web Sockets.
Node.js
Node.js Observations

00:51:54 - 01:08:19
Node.js Observations
Before diving into code, Kyle shares his personal opinions about where Node.js sits in today's technology stack and where he sees it in the future. He sees Node.js as the 'middle end'.
Hello World

01:08:20 - 01:15:53
Hello World
For this first example, Kyle begins by adding some code into '1.js'. He demonstrates the way Node provides a hosting environment for the JavaScript code it compiles.
Accepting Input

01:15:54 - 01:25:59
Accepting Input
Building on the Hello World example, Kyle modifies the Node application to accept command-line input. He then imports a module called Minimist that will help parse command-line variables.
Adding Help

01:26:00 - 01:35:33
Adding Help
Most command-line programs have a help system that provides instructions for how to use the program. Kyle adds a printHelp() method that will display these help messages. Hey also spends a few minutes talking more about the 'middle end' area where he sees a place for Node.
File IO & Modules

01:35:34 - 01:47:01
File IO & Modules
Kyle's next task is to add the ability for the Node application to read a file from the file system. The application will then pull in the contents of the file and display the contents to the screen. Kyle separates this task into its own module
Asynchronous File IO

01:47:02 - 01:57:28
Asynchronous File IO
Kyle changes the program to read the file asynchronously and passes the readFile method a callback function. This function will be called when the file stream is completed. Kyle also demonstrates how to handle errors in Node.
Asynquence

01:57:29 - 02:09:04
Asynquence
Kyle continues his demonstration of working with asynchronous calls. In this example, though, he is using the Asynquence library. Asynquence adds promise-like syntax to environments that are not promise aware.
Using Asynquence

02:09:05 - 02:12:52
Using Asynquence
Now that the HelloWorld2.js module is updated to use Asynquence, Kyle adds the chained calls into the main application. He uses the val() method and the or() method to hand the success and failure results.
Kickstarter Survey

02:12:53 - 02:17:47
Kickstarter Survey
Kyle steps away from the current application to show a little code from a GitHub project the created to survey his Kickstarter contributors. In this code, he demonstrates another use of the Asynquence response stream.
Creating NPM Modules

02:17:48 - 02:28:53
Creating NPM Modules
One method for distributing Node Modules is to publish them to npmjs. This site has tons of Node Modules that can be installed via the npm command-line tool. Kyle demonstrates how to package and distribute a Node module using NPM.
Publishing NPM Modules

02:28:54 - 02:38:46
Publishing NPM Modules
Now that the module has a package.json file, it can be published to the NPM server for distribution. Once the module has been converted into an NPM module, the require() include can simply reference the module name.
Extending Modules

02:38:47 - 02:45:03
Extending Modules
Libraries like Browserify allow the modules to be packaged and loaded directly into the browser. Kyle also demonstrates some shell code that allows the same module code to run in the Node, the browser, and other loading scenarios like AMD.
Grunt & Gulp

02:45:04 - 02:47:48
Grunt & Gulp
Whether it's minifying code, using JSLint, or any other build task, modules like Grunt and Gulp add automation to these types of build tasks.
File Streams

02:47:49 - 02:55:28
File Streams
Rather than reading an external file in one large chuck, data from the file can be loaded piece by piece using the file stream API. The file stream API uses event listeners. For example, the 'data' event is fired each time a chunk of data is received.
Piping Streams

02:55:29 - 03:01:49
Piping Streams
The output from one file stream can be piped to the input of another file stream. Piping typically uses both the read-stream and write-stream APIs. Kyle also demonstrate a great streams resource nodestreams - nodestreams
Node as a Webserver

03:01:50 - 03:13:01
Node as a Webserver
Kyle transitions away from the command-line to explore how Node behaves as a webserver. He starts by creating a server file and importing the http module.
Handling Requests

03:13:02 - 03:20:17
Handling Requests
Kyle modifies the handleHTTP method to return the correct headers for the incoming request. He also incorporates request routing. For example, responding differently to GET and POST requests.
Framework Discussion

03:20:18 - 03:27:38
Framework Discussion
While fielding a few audience questions, Kyle expresses his general opinions about JavaScript frameworks and how the should look once they are in production code.
Simulating Asyncronicity

03:27:39 - 03:32:52
Simulating Asyncronicity
Kyle tasks the audience with adding a couple setTimeout statements to simulate an asynchronous behavior.
Adding Asynquence

03:32:53 - 03:40:27
Adding Asynquence
The next task Kyle gives to the audience is to convert the nested setTimeout statements into Asynquence chains.
Serving Static Files

03:40:28 - 03:52:06
Serving Static Files
Up to this point, Node has been pushing content to the browser using the write-stream API. Kyle now modifies the node application to serve static HTML files. Kyle also field a few questions about keeping track of useful node modules.
Socket.io
Setting Up Socket.io

03:52:07 - 04:01:42
Setting Up Socket.io
Socket.io is a Node module that enables real-time bidirectiona