Adding the form-fields for the chat page

To do this, we're going to create a few divs. They're all going to look identical so we'll make them once and duplicate them. We're going to add a class equal to form-field. Now we'll use this four times: title, name, room name, and button. In order to get that done, what we're going to do is simply copy the line and paste it four times:

<body class="centered-form">
  <div class="centered-form__form">
    <div class="form-field"></div>
    <div class="form-field"></div>
    <div class="form-field"></div>
    <div class="form-field"></div>
  </div>

Now all of this needs to go inside a form tag. The whole goal of this page is to take that data and submit it, redirecting the user to the chat page where we can then bring ...

Get Advanced Node.js Development now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.