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:
We will use React to create the view of our application. With Stateless Functional Components, we can write pure functions that render the state.
lib/client/sheet.tsx, we will import React and functions and types that we created before: