Before we can start coding, we have to set up the project. The directory structure will be the same as in
Chapter 3, Note-Taking App with Server; static contains the static files for the webserver, lib/client contains the client-side code, lib/server contains the code for the server, lib/shared contains the code that can be used on both sides, and lib/typings contains the type definitions for React.
We can install all dependencies, for gulp, the server, and React, as follows:
npm init npm install react react-dom ws --save npm install gulp gulp-sourcemaps gulp-typescript gulp-uglify small --save-dev
The type definitions can be installed using npm:
cd lib npm install @types/node @types/react @types/react-dom @types/ws --save
We create static/index.html, which will load the compiled JavaScript file:
<!DOCTYPE HTML>
<html>
<head>
<title>Chat</title>
<link href="style.css" rel="stylesheet" />
...