Now that we have our button in place, the only thing we need to do is add the little text field. This is going to be the text field where a user types their message. This is going to require us to use an input tag, and instead of opening and closing an input tag, we're going to use the self-closing syntax:
<form id="message-form">
<input/>
<button>Send</button>
</form>
Because we don't need to actually put anything inside it like we do for button, or for form, we are going to be adding quite a few attributes onto input, first up, name, we want to give this field a unique name, something like message is going to get the job done. We also want to go ahead and set the type. There are a lot of different types for input tags. Types could include something like a checkbox, or in our case the type we're going to use inside quotes is text:
<input name="message" type="text"/>
The last attribute we're going to add to input is called placeholder. We're going to set this value equal to, inside quotes, a string. This string is going to get rendered in the field in a light gray before the user actually enters a value. I'm going to tell the user that this is where their Message goes:
<form id="message-form"> <input name="message" type="text" placeholder="Message"/> <button>Send</button> </form>
With this in place we can actually test out our form's rendering.