Control Any Arduino from your Browser via Serial using pfodWeb and pfodWebDesigner

Post updated for pfodWeb V2 with Serial, BLE and HTTP connections

The free pfodWeb.html allows any Arduino board to be controlled by its own custom GUI from your browser via Serial. This Led On/Off example is served by an Arduino UNO via Serial
twoButtons

pfodWeb.html comes with the pfodParser library, available via the Arduino library manager, and is completely stand alone. No other downloads or internet access needed.

pfodWebDesigner lets you design the GUI and then generates complete Arduino sketches that connect to pfodWeb via Serial or BLE or HTTP.

pfodWebDesigner completely stand alone with no internet access needed once it is installed.

See the updated V2 tutorials at pfodWeb and pfodWebDesigner

All the code can be downloaded from there but it is also available on Github under GitHub - drmpf/pfodWebDesigner: Web based designer for pfodWeb and pfodApp GUI's
and GitHub - drmpf/pfodParser: pfodParser Arduino Library for pfodWeb.html and it source files

Quick Overview of pfodWeb and pfodWebDesigner

pfodWeb is a free web based partial replacement for the paid Android app, pfodApp. pfodWeb runs in a browser and connects to your Arduino board via either Serial or BLE or HTTP. Using Serial you can connect to any Arduino board and display the interactive controls it serves. pfodWeb runs competely off-line. No internet connection is needed. Just install the pfodParser library and open the index.html in the pfodWeb sub-directory of the pfodParser library. The interactive controls are completely defined by the code (generated by pfodWebDesigner) in your Arduino. Very compact pfod messages are used to send the controls and receive the user's commands.

If your Arduino board supports HTTP and has a file system of 200Kb, then you can load the all pfodWeb files onto your microprocessor and serve them directly from there.

pfodWebDesigner is a free web based replacement for the free Android app, pfodGUIdesigner. pfodWebDesigner allows you to design interactive and responsive user interfaces for your microprocessor. pfodWebDesigner generates Arduino code that works with all pfodDevices that connect via Serial, Bluetooth, BLE, SMS and WiFi, not just those that have WiFi support. See How to install pfodWebDesigner and Using pfodWeb Designer to Create GUI's. Individual pfodWebDesigner controls are stored as JSON files which you can duplicate, modify and reuse in other designs. Each reused control can be individually scaled and positioned in the final design.

Here are some sample GUI's designed in the tutorials listed on pfodWeb and pfodWebDesigner Custom Web Page Controls for your Arduino

This GUI is served via Serial by an Arduino UNO
LedNoOffGUI

This GUI is served via Serial by an Arduino Mega
SliderWithHelp

2 Likes

Thanks for letting us know.

Updated original post for pfodWeb V2 which allows Serial and BLE connection in addition to HTTP.

2 Likes