Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions astro.config.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -477,6 +477,10 @@ export default defineConfig({
label: "Feedback",
link: "feedback/feedback-form",
},
{
label: "Feedback form documentation",
link: "feedback/feedback-form-documentation",
},
],
},
],
Expand Down
76 changes: 76 additions & 0 deletions src/content/docs/feedback/feedback form documentation.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
---
title: Feedback Form Implementation Documentation
description: Documentation of the feedback form setup for future maintenance and enhancement.
---

## Feedback Form Implementation Documentation

### Overview

This document outlines the implementation and setup of the feedback form used on the Thoth Tech
Documentation Website. It is intended to assist future students and developers in understanding the
current system and to facilitate further development and maintenance.

### Tools Used

- **HTML/CSS** for structuring and styling the form.
- **JavaScript** for front-end logic.
- **Web3Forms** for handling form submissions without server-side code.
- **Node.js** and **Express** for server-side logic in case of future custom backend integration.

### Form Setup and Design

The feedback form is designed to be simple yet functional, enabling users to quickly provide their
feedback on the Thoth Tech Documentation Website. It includes fields for user identification,
feedback content, and ratings:

- **Name**: Allows the user to enter their name.
- **Email**: Allows the user to enter their email for follow-ups.
- **Feedback Type**: Users can select whether they are submitting a general suggestion or specific
improvement ideas.
- **Rating**: Users can rate their experience using star ratings.
- **Comments**: A textarea for additional comments.

### Integration with Web3Forms

Web3Forms is used to manage form submissions. This service was selected for its simplicity and the
ability to handle form submissions without the need for additional backend code, making it ideal for
projects with limited server-side interaction:

#### How to Configure Web3Forms

1. **API Key**: An API key is required from Web3Forms, which is included in the form's hidden input
field to authenticate requests.
2. **Form Action**: The form's `action` attribute is set to the Web3Forms endpoint URL.
3. **Method**: POST method is used to send data to the Web3Forms service.

```html
<form action="https://api.web3forms.com/submit" method="post">
<input type="hidden" name="access_key" value="your_access_key_here" />
<!-- Additional form fields -->
</form>
```

## Cybersecurity Review and Licensing are required for the Web3Forms

### Cybersecurity Review

It is essential to conduct a cybersecurity review when using Web3Forms with a free account. This
review should assess the following aspects:

- **Data Security**: Ensure that the data submitted through the form is securely transmitted and
stored.
- **Vulnerabilities**: Identify any potential vulnerabilities that could be exploited.
- **Compliance**: Verify compliance with relevant data protection regulations and standards.

### Licensing Information

Using the free account of Web3Forms comes with certain limitations and licensing terms that must be
considered:

- **Usage Limits**: There may be limits on the number of submissions or features available in the
free tier.
- **Terms of Service**: Review the Web3Forms terms of service to ensure that the usage complies with
their guidelines.
- **Upgrade Options**: Consider the options for upgrading to a paid plan if additional features or
higher usage limits are needed.