2015
Lynda
Alex Banks
3:56
English
Socket technology is a natural fit for presentation and chat applications. This course helps you use Socket IO in combination with powerful JavaScript libraries to develop an interactive polling application that processes data in real time, allowing presenters to interact with audience members and graph their responses. Alex Banks shows each step in the process, starting with setting up the node environment and express app for development. You'll then create and connect sockets for real-time data sharing and set up routing and interface elements with React.js, refactoring those components for ES6 integration. This setup will allow you to program functionality for running presentations, joining presentations, asking and answering questions, and graphing the results of the poll.
Introduction
Welcome
What you should know before watching this course
Using the exercise files
1. Setting Up the Environment
Building the Node.js server app
Setting up React build with webpack
Setting up npm scripts
2. Connecting Sockets
Incorporating Socket IO
Adding a header React element
Displaying connection status
Handling disconnects
3. App State and Routes
Understanding application state
Adding a default title
Setting up the React router
Passing state to child components as properties
Adding a NotFoundRoute handler
4. Joining the Presentation
Creating a display component
Creating the join form
Emitting a join event
Responding with a joined event
Saving audience state
Removing disconnected audience members
Automatically rejoin audience members
5. Starting the Presentation
Build speaker form
Starting the presentation
Broadcasting speaker data
Leaving and rejoining the speaker
Display attendance
6. Questions and Answers
Loading and displaying questions
Asking a question
Setting up multiple choices
Answering a question
7. Graphing Results on a Scoreboard
Connecting the board
Graphing the results
8. Upgrading to ES6 Syntax
Using ES6 imports
Using ES6 class syntax
React ES6 properties
ES6 arrow functions
React ES6 class state
Conclusion
Next steps
Download File Size:684.4 MB
|
