Hello,
I am a student of computer engineering and learning to use the microcontroller for my project. I chose the ESP32 and have read about it in detail through the link below:
I am working on the automatic plant watering system and using DHT sensors, LCDs, and MySQL. For the front end, I am using Webflow. I am stuck at the point to connect the ESP32 webserver with the webflow. Can anyone help me here? I can share my project.
Two ways you could probably do this-
Export, modify, upload.
I don’t know the capabilities of the ESP32 web server, but if you’re building a UX, you can export the Webflow HTML, adjust it for your specific application and upload the page(s) into the microcontroller.
Be careful about over-styling, large images, etc, your storage space is likely quite limited and Webflow tends to generate large CSS and JS. In particular, I’d avoid adding interactions, lotties, rive elements to your project. Here’s a feature/cost breakdown on Webflow.js size.
Webflow hosting + JS to API
Another possibility might be to remote-control your device.
If the ESP32 web server is on a public IP, then instead of building a website there, you could focus on building an API.
Then, you could host a much more robust website on Webflow hosting, complete with things like User Accounts and ECom. Device control would occur through Javascript calls from that site to your API.
Note that your API would likely need to be CORS-compatible in order to be called by browser-executed JS. Note also, security considerations, depending on what you’re building.
Plant watering, probably fine. Water treatment plant, not so much.
Hey, thanks for this information. This is what I was searching for. I’ll use the API because the main motto is to control the project remotely.