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

Writing the view

The application will show an input box at the top of the screen, which is used to type the title of the spreadsheet. Below the title, a table is shown which contains all fields of the spreadsheet. When the user clicks on a field, a popup is created which allows the user to change the content of that field. If the field contains errors, these errors are shown in the popup:

Writing the view

We will use React to create the view of our application. With Stateless Functional Components, we can write pure functions that render the state.

Rendering the grid

In lib/client/sheet.tsx, we will import React and functions and types that we created before:

import ...

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