Contact Form (Single File Component + Fetch)

Challenge summary

Build a contact form in a Vue 3 single file component using the Composition API. The template and styles are already provided for you.

What you'll practice

• Use Vue 3's Composition API in a single-file component (App.Vue).
• Use refs to track form fields: name, email, and message.
• Make all fields required; validate email with a basic email pattern and require a minimum length for the message (e.g. at least 10 characters).
• Disable the submit button while the form is invalid or while a request is in progress.
• On submit, send a POST request with the form body to https://jsonplaceholder.typicode.com/posts.

What Premium unlocks

Premium unlocks the runnable workspace, behavioral checks, implementation walkthrough, and edge-case discussion.