O'Reilly logo

TypeScript: Modern JavaScript Development by Ivo Gabe de Wolff, Vilic Vane, Remo H. Jansen

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Connecting to the server

We can connect to the server with the WebSocket class:

const socket = new WebSocket("ws://localhost:8800/"); 

Since we're using React, we add the following to the state. We create a new component, App, that will show the menu or a chat room based on the state. In lib/client/index.tsx, we first define the state and props of that component:

import * as React from "react"; import * as ReactDOM from "react-dom"; import * as api from "../shared/api"; import * as model from "./model"; import { Menu } from "./menu"; import { Room } from "./room"; interface Props { apiUrl: string; } interface State { socket: WebSocket; username: string; connected: boolean; completions: string[]; room: model.Room; } class App extends React.Component<Props, ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required