Form handling in Express

How to handle forms using ExpressJS


In order to handle forms in ExpressJS, you must first have a basic understanding of ExpressJS. You can learn basic ExpressJS here.

Step 1: Setup app

Before you are able to create or handle forms, you must setup your app. You can do so with this NodeJS code:

const express = require("express");
const app = express();

app.use(express.urlencoded({ extended: true }));

// ...

app.listen(1010, () => {
  console.log("Server started");

If you don’t understand what this code does, go here.

Next, you must create the public directory. Create a folder named public, and in it, create a file named index.html.

In index.html, type !, which is an Emmet abbreviation, and press Tab to activate the abbreviation. Your boilerplate HTML code should instantly appear.

Step 2: Creating the HTML form

In the <body> tag of index.html, you will write the code for the form.

Example form:

<form method="post">
  <label for="input">Type anything you want below</label><br/>
  <input name="input"/>
  <button type="submit">Submit Form</button>

<form method="post"> creates the form, specifying that it should be submitted using the POST HTTP method.

<label for="input"> creates a label element in the form specifying what the user should enter in the input element below. It is recommended to have a <label> element for every user input element in the form. Each <label> element should have a for attribute that specifies the name of the element it is for.

<input name="input" /> creates an input element in the form where the user will enter data. A name element is required for every user input element in the form that you want to submit. If a form element does not have a name attribute, it will not be submitted to the server when a user submits the form.

<button type="submit"> creates a submit button that, when pressed, will submit the form and send the data to the server for processing.

Step 3: Processing the form

Then, when a user clicks the Submit Form button, the data will be sent to the server. In index.js, we need code to process it.

Use the following Node.js code:'/', () => {
  let data = req.body.input; // Use `req.body.<name attribute>` to access an element in the form
  res.send(data); // Send what the user typed

That’s it!

From here, you can do more advanced things, such as save the user input to a database, but that’s it for now.


bro please stop with the kbd abuse just use normal backticks, like here it’s fine

but not here

Nice resource! Want me to make it a wiki?


Sure! :thumbsup:

I wish I was TL3 so I could do it myself


I like how <kdb></kbd> looks and how it stands out.


Which is why I kept it in some places. I just removed it where backticks would do the trick.


You don’t need to install body-parser yourself - express already handles that for you:

app.use(express.urlencoded({extended: true}));


Isn’t that deprecated?

1 Like

No, I thought it was the other way around. (Or at least using body-parser directly isn’t recommended)

1 Like

Oh, damn. So I just searched it a lil’ bit and you’re right. Sorry about that!

1 Like