Source: https://github.com/mo-thunderz/Esp32WifiPart3/tree/main

 Source: https://github.com/mo-thunderz/Esp32WifiPart3/tree/main
Same as above but follow author’s video from 3’10 to change code from Station Mode setup  to Access mode setup 

ens

Source: https://www.youtube.com/watch?v=VaNVrE7-AO8
Long and detailled video to turn the above program to a fully different firmware design and UI  experience to plot in ‘realtime” data from an analog input or sensor.
It uses the flash Pile storage function of the ESP32 (i.e. a board internal equivalent to the SD Card) to be used to store web files (HTML, CSS’ Javascipt…) to be displayed on the server.

Starting of his file from Part3 setup as a wfifi station controlling leds and displaying results from web files data implemented in the .ino file, the video maker Mo Thunders starts changing the setup as an Access points (min 2 to 4).

SPI DRIVER LIBRARIES

Then he explains how to used the internal SPI Driver of the ESP32 to store the web files. The SPIDriver is an internal memory that is smaller but faster than the SDCardsystem.
This takes to add new libraries starting with the ASyncWebServer library:
https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbEM5c1FtWktXMk91WFpKbzc2R20zVTBEMjVUUXxBQ3Jtc0tuMGxEdzNfYXZzSWlTOFo2SkVNdjMzOERYY2QzT2VneHZEcXVfZVZTOC1pNThNdHNTUkk2d0xsdnV1eDZhNEhObHlJN0dCU3pYeFRCSDQ2LWRPVHU5NWx1OWtNMjkzeHV5Zmk2X3FBRE51UzVTZlo2RQ&q=https%3A%2F%2Fgithub.com%2Fme-no-dev%2FESPAsyncWebServer&v=VaNVrE7-AO8 

and the ASyncTCP library: 

Note that you will not find these library as available from the Arduino Lirary MAnager like for the ESP32. Instead you need to download the libraries from the sources and properly unzip those in your workplace e.g. ./user/MyName/Arduino/library
Make sure this is properly done so that you can successfully include the ASyncWebServer.h  and and run ASyncTCP.h files on top of the ino file.

SPI DRIVER SETUP INITIALISATION

 The driver needs to be initialiserd with slightly different commands lines  than the previous server manager.
It requires to use and initialise a websocket prior to initalising the server.

SPI DRIVER USE DURING LOOP

the handle function used for the previous server library is not needed anymore with the ASyncWebServer library

 SENDING FILES TO THE SPI DRIVER

To send the html file to the SPI driver we need a third library called SPIFFS.
Dowload the file called ESP32FS-x,y.zip from the link https://github.com/me-no-dev/arduino-esp32fs-plugin/releases/

 You then need to put this unzipped content in a folder called tools in you workplace or Arduino sketchbook, so that you get something like: /user/MyName/arduino/tools/ESP32FS/tool/ESP32FS,jar

TEST UPLAD
If you are succesful with libraries installations you can now test after closing and repoening your arduino IDE. It should then detect your libraries and tools libraries and if you alsohave an ESP 32 selected, you should get offered a new option from the Tools menu: upload SSL Root Certificates.

So now, in practice, you need to put the files you want to upload in a data floder in the folder containing you .ino firmware file. Let’s then now say you have you webpage.html file in this data folder.

You can then now upload your file using the upload SSL Root Certificates function. Just make sure as usual that your serial monitor does not interfere leading to an error.

What’s next? Update the code.

The next thing do do consists in including the third library and implementing it in the code
#inclue ESP32FFS.h

 initialise just after Serial.begin() : ESP32FFS.begin()

In loop: set a request for the ESP32FFS whose inputs are slightly different than previously. Check in the final .ino

In loop also you need after the requests to add a server commands to  enable its access to the file. Check in the final .ino.

Next Tab details about html file info such as max size supported by the ESP

 => Found at” ” ” “Source::

Part 3 of a great tutorial series on ESP WIFI by Mo Thunderz: https://www.youtube.com/watch?v=ZJnXKD0LqDo

For installation, the following libraries need to be installed:

• “Websockets by Markus Sattler (can be tricky to find -> search for “Arduino Websockets”) ” => found it by gil maimon instead on arduino IDEArduinoJson by Benoit Blanchon found at: https://github.com/bblanchon/ArduinoJson

 Here we deal with adding a webserver socket to be able to update the wii client on multiple displays at the same time e.g. computers and phone.

ArduinoJson is a C++ JSON library for Arduino and IoT (Internet Of Things). JSON is a language-independent data format. It was derived from JavaScript, but many modern programming languages include code to generate and parse JSON-format data. JSON filenames use the extension .json.

Source: https://www.youtube.com/watch?v=VaNVrE7-AO8  from min 18 in the video
For your html and javascript file, you only have little memory (1MB) in the ESP SPI driver, so you need efficient libraries to build you files.

In the case of plotting data, the chart.js library is suggested (open-source, good on-line doc and relatively simple to use). https://www.chartjs.org/

Good practical examples in w3school: https://www.w3schools.com/js/js_graphics_chartjs.asp
Fron there the linegraph exmple is a good start base displaying a so far static graph.

 We then need the javascript to send continuously arrays of data instead of just a single data like previously for #3 tutorial so we need to add a new array v(of known size) ariable and addapt the code.
create: 
const int Array_Length = 10;
int Sensor_Values [] = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 0 ];

Then you need to update the previous functions made for single values to functions made for array, like sendJSon function turned into a sendJSon_Array function

Update HTML File
Modify the function called ProcesssCOmmand(envent)

Test your new versions:
Uploading the ISP over and over duiring development can lead to interference issues to access the IP (which remains always the same e.g. 192.168.4.1 but still it generates conflicts).
To slove this, disconnect and reconnect the esp connexion from the computer and recompile or else go to seerial monitor and reset the ESP with its reset button to reinitialise the server. The same IP should be given again, but acccessible this time.
Same issue with connecting to access points when setup like this. If you IP is not acessible, just close and reopen the wifi ssid connection from your computer.