It’s normal to have a back-end on your website for your forms to be functional. Say no More!

Netlify offers hosting to static websites and serverless technologies, and it comes with super great features including form handling without a back-end.

Let’s build a form with Netlify:

What you will need:

  • Netlify account
  • GitHub account

First off let’s start with a simple html form:

Create a new html file and paste the snippet below:

      <form method="post" name="Friends">
        <p>
          <label for="friend-name">Name:</label>
          <input type="text" name="name" id="name" />
        </p>
        <p>
          <label for="Country">Country Of Residence:</label>
          <input type="text" name="country" id="country" />
        </p>
        <p>
          <label for="stack">Your Tech Stack:</label>
          <select id="stack" name="stack">
            <option value="front-end">Front-End</option>
            <option value="back-end">Back-End</option>
            <option value="mobile-developer">Mobile-Developer</option>
            <option value="full-stack">Full-Stack</option>
          </select>
        </p>
        <p>
          <input type="submit" />
        </p>
      </form>

The Complete Html File

We have a simple form that takes in few input from a user., so let’s deploy the site from Netlify. (Add the file to your new GitHub Repository and deploy form netlify by linking the repo)

Netlify Forms

To start using Netlify forms, you only need to add a few attributes to your

tag. You can either use netlify or data-netlify="true"

<form method="post" name="Friends" netlify>

<form method="post" name="Friends" data-netlify="true">