feedback_widget_demo_PR
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
This project demonstrates a reusable feedback widget library for Val Town projects.
- 🎨 Clean, minimizable UI that floats at the bottom-right
- 📱 Mobile-responsive design
- 💾 Automatically saves feedback to feedback.md
- ⚡ Easy to integrate - just 2 lines of code
- 🎪 Smooth animations and hover effects
- Copy
feedbackWidget.tsinto your project - Import and use in your main entry point:
import { renderFeedbackWidget, handleFeedbackSubmission } from "./feedbackWidget.ts";
// Add to your HTML template
const html = `
<body>
<!-- Your content -->
${renderFeedbackWidget()}
</body>
`;
// Add feedback route
app.post("/feedback", async (c) => {
return await handleFeedbackSubmission(c.req.raw, import.meta.url);
});
- Create a
feedback.mdfile in your project root
That's it! Users can now submit feedback through the widget.
feedbackWidget.ts- The reusable widget libraryindex.ts- Demo implementationfeedback.md- Where feedback gets storedREADME.md- This file
Visit the live demo to see the widget in action: Demo Link
The widget can be easily customized by modifying the CSS in feedbackWidget.ts. Change colors, positioning, animations, and more to fit your project's design.