Question: Web page implementation about super-simple-rgb-wifi-lamp

[thebigpotatoe]

You make some excellent points, both of which I am aware of myself. The problem is I have played around with many implementations of web pages on the ESP8266, and found that all methods had pro's and con's depending on what was trying to be implemented.

I haven't published how I make changes to the web page, but essentially, I have the website.html file which is packaged in this repo. In there is the exact copy of the website written into C found in the Web_Server.ino file.

What I do is make changes in the HTML file in something like visual studio code with a HTML editing add on. This allows me to make changes and debug it much faster as I can load the HTML file in a browser and make changes very quickly.

After editing I found the best way to get it onto the ESP was a couple of search and replace tricks leveraging REGEX inside the find and replace option in VS code. This at line 19 is in the Web_Server.ino file so I can remember it. Through copy and paste, it takes no time at all to just overwrite the html section of the Arduino code with the new updated webserver.

The reason I wrap each line instead of just copy and pasting the whole document into say flash or a .index file like you have linked, is that it reduces the amount of RAM used at one time. I am no expert on this, so I could be approaching this completely wrong, but when compiled the total amount of global RAM used is much less. Especially for a large website like this one. And from what I have found, the website still loads pretty quickly anyway.

There was the option of uploading it to the SPIFFS, but I wanted to avoid this extra step for beginners as it is just another possible step to fail on. Thus the website is copy pasted directly into code like I mentioned above.

As for the maintainability and user friendliness of adding new items, you are right, it's pretty awful even in a HTML editor. This was just due to the fact I wrote it in a week for the competition on Instructables. So there is definitely potential to improve how it is written and if it can possibly dynamically create itself.

Perhaps a move towards having a really basic HTML template which adds menu items dynamically and allows the main C++ program to send it HTML code written by users for their mode (like in b). This would allow users to write how their mode should look in a tab on the web page. Something along these line perhaps?

[LarsMichelsen]

Sounds good. I also believe that the best way would be to make the pages partly dynamic. Maybe I'll take a closer look when I'm working on the next animation. Thanks! Closing this for the moment.