Create forms and embed them in your application using Embed

Create forms and embed them in your application using Embed

Embed: Appwrite Hashnode Hackathon

Team Details

Description of Project

Embed is a low-code tool to create and embed contact and feedback forms in your web application using iframe without framework agnostic.

Unique Value Proposition

  • Using Embed one can create contact and feedback forms and embed them in any web application without framework agnostic using iframe.

  • Also, the tools provide customization for form style. Apart from the default form style, it supports Material Design (a design system from Google) form fields.

  • At the moment, a contact form can be created but all types of forms can be implemented very soon namely a user feedback form, emoji feedback form, and a low-code comment section that can be implemented in any blog post.

  • The responses from the forms can be viewed in the Responses tab. Plans to send emails to the form creator for all responses in the future.

  • The motivation behind the creation of the tool is used to make anyone create and embed forms even in plain HTML websites with no javascript.

Tech Stack

  • Vue.js

  • Appwrite Cloud

    • Authentication

    • Database

  • Vercel

OAuth service is implemented in Embed for quick and reliable authentication. Also to save the form configuration and response a Database service is used.

Challenges I Faced

  • Building a low-code tool, required a clear thought process for connecting different components into one. The process took much trial and error until I came up with a maintainable and scalable approach connecting different components that'll work together.

  • In every Appwrite service integration either authentication or database, some issues (namely, user roles, and db attributes) make me thinks, about why thing are not working. But the well-written documentation and community support make the process less tedious.

Public Code Repo

Here's the source code,

Here's the video to know more about working with the tool,

The application is hosted on Vercel, and here's the link to try it out,

Did you find this article valuable?

Support Roopesh Saravanan by becoming a sponsor. Any amount is appreciated!