A backend for your Nuxt.js forms

Keep full control over the look and feel of your Nuxt.js forms.

Nuxt.js is a progressive framework based on Vue.js to create modern web applications.

Getting started with Nuxt.js is simple

Start collecting data in a matter of clicks.

Let Formspark take care of the servers, databases, and analytics.

Set up any form in seconds.

Vue Out of the box Vue support

Compatible with Jamstack

markup

<script setup>
import { ref } from "vue";

const FORMSPARK_ACTION_URL = "https://submit-form.com/your-form-id";

const message = ref("");

// $fetch is Nuxt's built-in client, so the body is passed as an object
// rather than a JSON string.
const submitForm = async () => {
  await $fetch(FORMSPARK_ACTION_URL, {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Accept: "application/json",
    },
    body: {
      message: message.value,
    },
  });
  alert("Form submitted");
};
</script>

<template>
  <form @submit.prevent="submitForm">
    <label>
      <span>Message</span>
      <textarea name="message" v-model="message"></textarea>
    </label>
    <button type="submit">Submit</button>
  </form>
</template>

A backend for your Nuxt.js forms

Getting started with Nuxt.js is simple

Links