ESP32 Arduino Setup: Difference between revisions

From Hackers & Designers
(Created page with "work in progress == Installation == First download the Arduino IDE * Download the Arduino software here: [https://www.arduino.cc/en/Main/Software '''Arduino Download'''] These instructions are for Arduino IDE version 1.x, but should mostly make sense for version 2.x as well. * '''Installing Arduino''' ** [https://www.arduino.cc/en/Guide/Windows Windows] ** [https://www.arduino.cc/en/Guide/MacOSX Mac OSX] ** [https://www.arduino.cc/en/Guide/Linux Linux] '''Arduino I...")
 
mNo edit summary
 
(19 intermediate revisions by the same user not shown)
Line 1: Line 1:
work in progress
[[Category:Tools]]
[work in progress]
 
== Arduino IDE setup for ESP32 ==
 
This guide walks you through setting up the legacy Arduino IDE for use with ESP32 devkit v1 module as well as installation of the libraries we most use during H&D workshops.
The instructions are for Arduino IDE version 1.x, but should mostly make sense for version 2.x as well. The reason we're using the older version of the IDE is because there isn't any way in the new version to upload files to the ESP32 board.
 
This page only documents the installation of the ESP32 support for the Arduino IDE. Next steps may involve:
 
* [[Installing ESP32/Arduino libraries]]
* [[Uploading a website to the ESP32 module]]


== Installation ==
== Installation ==


First download the Arduino IDE
=== Download IDE ===
 
First, download the Legacy Arduino IDE.
* Download the Arduino software here: [https://www.arduino.cc/en/Main/Software '''Arduino Download''']


These instructions are for Arduino IDE version 1.x, but should mostly make sense for version 2.x as well.
* Download the Arduino software here: [https://www.arduino.cc/en/Main/Software '''Arduino Download'''].  
Pick the installer appropriate for your system.


If necessary you can follow one of these guides:
* '''Installing Arduino'''
* '''Installing Arduino'''
** [https://www.arduino.cc/en/Guide/Windows Windows]
** [https://www.arduino.cc/en/Guide/Windows Windows]
** [https://www.arduino.cc/en/Guide/MacOSX Mac OSX]
** [https://www.arduino.cc/en/Guide/MacOSX Mac OSX]
** [https://www.arduino.cc/en/Guide/Linux Linux]
** [https://www.arduino.cc/en/Guide/Linux Linux]
=== Install ESP32 Boards ===
Next we need to install an extension that makes it possible to program the ESP32 modules from the Arduino IDE.


'''Arduino IDE settings'''
'''Arduino IDE settings'''
Open  
Open the Arduino Setting by going to:
- Windows/Linux: Menu > File > Preferences...
- MacOS: Menu > Arduino > Preferences...
 
* Copy and paste the following into ‘Additional Boards Manager URLs’ and click ‘Ok’.
* Copy and paste the following into ‘Additional Boards Manager URLs’ and click ‘Ok’.
<pre>https://dl.espressif.com/dl/package_esp32_index.json</pre>
<pre>https://dl.espressif.com/dl/package_esp32_index.json</pre>
[[File:Arduino board url.png|thumb|alt=Screenshot of the popup window for adding board urls ]]
[[File:Arduino board url.png|500px|frame|none|alt=Screenshot of the popup window for adding board urls|Screenshot of the popup window for adding board urls ]]
 
Optional:
Optional:
* Change the compilation and upload process display mode to ‘verbose mode’
* Change the compilation and upload process display mode to ‘verbose mode’
Line 25: Line 44:
<!-- [https://github.com/espressif/arduino-esp32/blob/master/docs/arduino-ide/boards_manager.md '''Adding ESP32 boards to the Arduino IDE’s board list'''] -->
<!-- [https://github.com/espressif/arduino-esp32/blob/master/docs/arduino-ide/boards_manager.md '''Adding ESP32 boards to the Arduino IDE’s board list'''] -->


'''Launch the Board Manager'''
Go to the menu Tools > Boards > Board manager...
[[File:Arduino-board-manager.png|500px|frame|none|alt=Screenshot showing where to find the board manager panel: Menu > Tools > Board > Boards Manager|Screenshot showing where to find the board manager panel: Menu > Tools > Board > Boards Manager]]
[[File:Arduino-board-manager-popup.png|500px|frame|none|alt=arduino board manager popup window|Arduino board manager popup window]]


'''Type ‘esp32’ in the search box and click ‘Install’'''
[[File:Arduino-board-manager-esp32.png|500px|frame|none|alt=board manager pop-up with esp32 typed into search box|Board manager pop-up with esp32 typed into search box]]


== Install drivers ==


</li>
For your computer to be able to communicate with the ESP32 board you need device drivers. If you have already installed the SiLabs driver you can skip this step. If you're unsure, check the step [[#Check_if_the_USB_driver_are_working|Check if the USB driver are working]] below.
<li><p>'''Launch the Board Manager'''</p>
<p><img src="./images/arduino-board-manager.png" alt="screenshot showing where to path to find the board manager panel: > Tools &gt; Board xxxx &gt; Boards Manager ” width=“550”/&gt;</p></li>
<li><p>'''Select the Board Manager pop-up window'''</p>
<p><img src="./images/arduino-board-manager-popup.png" alt="arduino board manager popup window" width="600"/></p></li>
<li><p>'''Type ‘esp32’ in the search box and click ‘Install’'''</p>
<p><img src="./images/arduino-board-manager-esp32.png" alt="board manager pop-up with esp32 typed into search box" width="600"/></p></li></ul>
 
<span id="download-our-github-repository-for-all-the-required-code-and-html-templates"></span>
== Download our github repository for all the required code and HTML templates ==
 
Do this if you haven’t done so previously.
 
<ul>
<li><p>Navigate to the [https://github.com/hackersanddesigners/WifiZineThrowie_ScavengerHunt H&amp;D Scavenger hunt Github Repository]</p></li>
<li><p>On the top right of the page, click ‘Clone or download’ -&gt; ‘Download ZIP’</p>
<p><img src="./images/repositoryHD.png" alt="H&D repository on github" width="650"/></p></li>
<li><p>'''Renaming and moving the folder'''</p>
<ul>
<li>Decompress the .zip file by doubleclicking</li>
<li>If necessary, move the folder to some place where you would like to keep it and can find it for a while.</li>
<li>It’s good practice to change the name of the folder by deleting the part “-master” from the folder name (see images below)</li></ul>
</li></ul>
 
<span id="downloading-and-installing-the-espasyncwebserver-and-asynttcp-libraries"></span>
== Downloading and installing the ESPAsyncWebServer and AsyntTCP libraries ==
 
Next, we need some libraries. They are in the .zip file you downloaded before, but just in case they are updated in the future: here are the links to the developers’ repositories. You still need to move them to the right folders on your system.
 
<ul>
<li><p>Click ‘Clone or download’ -&gt; ‘Download ZIP’ on the github page for the [https://github.com/me-no-dev/ESPAsyncWebServer ESPAsyncWebServer].</p>
<p><img src="./images/arduino-00001.png" alt="Screenshot of the ESPAsyncWebServer repository on github" width="650"/></p></li>
<li><p>Rename folder after decompression (remove the part “-master”)</p>
<ul>
<li>[[./images/arduino-00003.png|[[File:./images/arduino-00003.png|arduino-00003]]]]</li>
<li>[[./images/arduino-00004.png|[[File:./images/arduino-00004.png|arduino-00004]]]]<br>''Screenshots showing folder name, one with -master at the and and one with that part removed.''</li></ul>
</li>
<li><p>Click ‘Clone or download’ -&gt; ‘Download ZIP’ on the github page for the [https://github.com/me-no-dev/AsyncTCP AsyncTCP library].</p>
<p>[[./images/arduino-00006.png|[[File:./images/arduino-00006.png|arduino-00006]]]]<br>''Screenshot showing github repository of the AsyncTCP library''</p>
<ul>
<li><p>Rename folder after decompression (remove the part “-master”)</p>
<p>[[./images/arduino-00007.png|[[File:./images/arduino-00007.png|arduino-00007]]]] [[./images/arduino-00008.png|[[File:./images/arduino-00008.png|arduino-00008]]]]<br>''Screenshots showing folder name, one with -master at the and and one with that part removed.''</p></li>
<li><p>Copy these 2 renamed folders to ~/Documents/Arduino/libraries. It should look like this:</p>
<p>[[./images/arduino-00009.png|[[File:./images/arduino-00009.png|arduino-00009]]]]<br>''Screenshot of finder window showing Arduino’s libraries folder with within that the a readme.txt file and two folders, one containing AsyncTCP and the other ESPAsyncWebServer.''</p></li></ul>
</li></ul>
 
<span id="confirming-code-compilation"></span>
== Confirming code compilation ==
 
* Restart the Arduino IDE (the Arduino software)
* Open ‘WifiZineThrowie.ino’ sketch that is inside the WiFiZineThrowie folder (in your downloads folder or on your desktop probably.
* Select the ESP32 Dev Module board
 
<img src="./images/arduino-wifizine-select-board.png" alt="Screenshot of Arduino menu open at > Tools &gt; Board &gt; ESP32 Dev Module” width=“450”/&gt;
 
<br><br>


<span id="adjust-esp32-dev-module-board-settings"></span>
Installing a USB device driver to communicate with the ESP32 module (chip name: SiliconLabs CP2012)
== '''Adjust ESP32 Dev Module board settings''' ==


<ul>
<li><p>Look up the board settings under &gt; Tools &gt; Most of these settings are correct by default, you just have to change QIO to DIO</p>
<pre>* Board: ESP32 Dev module
* Upload Speed : 921600
* CPU Frequency : 240MHz (WiFi BT)
* Flash Frequency : 80MHz
* Flash Mode : **DIO** (is QIO by default)
* Flash Size : 4MB (32Mb)
* Partition Scheme : Default
* Core Debug Level : None
* PSRAM : Disabled</pre>
<p><img src="./images/arduino-wifizine-config-board.png" alt="Screenshot of board settings under > Tools in Arduino window” width=“350”/&gt;</p>
<p><br><br></p></li></ul>
<span id="compile"></span>
== '''Compile''' ==
<ul>
<li><p>'''Click on the compile button in the top left of the editor (see red arrow in pic beneath)'''</p>
<p><img src="./images/arduino-wifizine-popup.png" alt="arduino window with red arrow pointing to the compile button on the top left" width="350"/></p>
<ul>
<li><p>'''If the compilation process is successful, it will say “DONE COMPILING” at the bottom'''</p></li>
<li><p>This means Arduino confirms it can find everything it needs to upload working code</p></li>
<li><p>Don’t upload the code to the board yet, first we need some more stuff</p>
<p>[[./images/arduino-00009.png|[[File:./images/arduino-wifizine-compile-done.png|arduino-wifizine-compile-done]]]]<br>''Screenshot of Arduino window with “done compiling” message in the bottom bar of the window''</p></li></ul>
</li>
<li><p>'''If the compilation process ends abnormally, it will give an orange error'''</p></li>
<li><p>If necessary, troubleshoot using the error messages (if you don’t get any, check that “verbose” is checked in settings of Arduino.</p>
<p><img src="./images/arduino-wifizine-compile-failed.png" alt="Arduino window with an orange error message" width="350"/></p></li></ul>
<span id="installing-a-usb-device-driver-to-communicate-with-the-esp32-module-chip-name-siliconlabs-cp2012"></span>
== Installing a USB device driver to communicate with the ESP32 module (chip name: SiliconLabs CP2012) ==
<span id="linux-3.x.x-4.x.x"></span>
=== Linux 3.x.x &amp; 4.x.x ===
=== Linux 3.x.x &amp; 4.x.x ===
* Driver installation not required (included in kernel)
* Driver installation not required (included in kernel)
** [https://docs.platformio.org/en/latest/faq.html#platformio-udev-rules udev rules update required]
** [https://docs.platformio.org/en/latest/faq.html#platformio-udev-rules udev rules update required]
** [https://raw.githubusercontent.com/platformio/platformio-core/develop/scripts/99-platformio-udev.rules 99-platformio-udev.rules]
** [https://raw.githubusercontent.com/platformio/platformio-core/develop/scripts/99-platformio-udev.rules 99-platformio-udev.rules]


<span id="linux-2.6.x"></span>
=== Linux 2.6.x ===
=== Linux 2.6.x ===
[https://www.silabs.com/documents/login/software/Linux_2.6.x_VCP_Driver_Source.zip Linux 2.6.x] - No information
[https://www.silabs.com/documents/login/software/Linux_2.6.x_VCP_Driver_Source.zip Linux 2.6.x] - No information


<span id="windows"></span>
=== Windows ===
=== Windows ===
* [https://www.silabs.com/documents/public/software/CP210x_Universal_Windows_Driver.zip Windows 10]
* [https://www.silabs.com/documents/public/software/CP210x_Universal_Windows_Driver.zip Windows 10]
* [https://www.silabs.com/documents/public/software/CP210x_Windows_Drivers.zip Windows 7/8/8.1]
* [https://www.silabs.com/documents/public/software/CP210x_Windows_Drivers.zip Windows 7/8/8.1]
* [https://www.pololu.com/docs/0J7/all Installation process]
* [https://www.pololu.com/docs/0J7/all Installation process]


<span id="mac-os"></span>
=== Mac OS ===
=== Mac OS ===
* Check if you already have this driver installed by searching your machine for a file named “SiLabsUSBDriver.kext” AND/OR “SiLabsUSBDriverYos.kext” AND/OR “SiLabsUSBDriver64.kext”. On a Mac, they can be in either of these folders listed below, depending on your system. If you find nothing, proceed to install. Otherwise, uninstall using the uninstaller provided, before re-installing (drag the uninstall.sh file into a terminal window and hit enter to uninstall.
* Check if you already have this driver installed by searching your machine for a file named “SiLabsUSBDriver.kext” AND/OR “SiLabsUSBDriverYos.kext” AND/OR “SiLabsUSBDriver64.kext”. On a Mac, they can be in either of these folders listed below, depending on your system. If you find nothing, proceed to install. Otherwise, uninstall using the uninstaller provided, before re-installing (drag the uninstall.sh file into a terminal window and hit enter to uninstall.
** /Library/Extensions/SiLabsUSBDriver.kext
** /Library/Extensions/SiLabsUSBDriver.kext
Line 148: Line 77:
** /System/Library/Extensions/SiLabsUSBDriver64.kext
** /System/Library/Extensions/SiLabsUSBDriver64.kext
** /System/Library/Extensions/SiLabsUSBDriver.kext
** /System/Library/Extensions/SiLabsUSBDriver.kext
* Download the driver: [https://www.silabs.com/products/development-tools/software/usb-to-uart-bridge-vcp-drivers Silabs USB communication chip driver download]
* Download the driver: [https://www.silabs.com/products/development-tools/software/usb-to-uart-bridge-vcp-drivers Silabs USB communication chip driver download]
* Doubleclick “Install CP210x VCP Driver.app” to install it.
* Doubleclick “Install CP210x VCP Driver.app” to install it.
* When it gives a security message, follow the instructions to allow the install to continue
* When it gives a security message, follow the instructions to allow the install to continue


<span id="check-if-the-usb-driver-is-working"></span>
== Check if the USB driver are working ==
== Check if the USB driver is working ==


<ul>
* If you just installed the driver, restart your computer.
<li><p>If you just installed the driver, restart your computer.</p></li>
* For Mac OS users: after restarting, make sure GateKeeper does not interfere with driver loading.
<li><p>For Mac OS users: after restarting, make sure GateKeeper does not interfere with driver loading.</p>
* If you have problems, please check out this [[ESP32_Mac_troubleshooting|MacOS troubleshooting page]].
<ul>
<li><p>System Preferences -&gt; Security &amp; Privacy -&gt; General</p>
<p><img src="./images/gatekeeper-check.png" alt="screenshot of mac os settings pane with the tile security & privacy highlighted" width="550"/></p>
<p><img src="./images/gatekeeper-check-popup.png" alt="screenshot of the security & privacy menu at the tab general, with the window under allow apps downloaded from highlighted, this is where potential errors will show up, if any" width="550"/></p></li>
<li><p>If there is an error message in the red box area, GateKeeper is interrupting the driver’s operation. If this is the case, click ‘Allow’ and confirm with administrator password, '''then restart your computer'''.</p></li></ul>


<p><img src="./images/security_and_privacy_kextload_approval.png" alt="screenshot of the settings pane - security and privacy with message System software from developer Intel Corporation Apps was blocked from loading and a button ALLOW next to it" width="550"/></p></li>
* If communication is possible, you should be able to select the port under: Menu > Tools > Port > ...
<li><p>If the problem persists, troubleshoot using the following instructions as per your operating system</p></li></ul>
The name of the port may vary depending on your operating system.
** On Windows it will probably called COM* where * is a number, ie. COM4.
** On linux it will be called /dev/ttyUSB* where * is a number, ie /dev/ttyUSB0
** On MacOS it will be called /dev/cu.SLAB_USBtoUART as shown in the picture below.[[File:Arduino-esp32-comm.png|500px|frame|none|alt=screenshot of Arduino window with menu Tools-Port-SLAB_USBtoUART selected|screenshot of Arduino window with menu Tools-Port-SLAB_USBtoUART selected]]


<span id="bypassing-gatekeeper-on-mac-os"></span>
== Install libraries ==
=== Bypassing gatekeeper on Mac OS ===


<ul>
At this point you probably continue [[Installing ESP32/Arduino libraries|installing necessary libraries and uploading to the ESP32]]
<li>[https://www.silabs.com/documents/public/software/Mac_OSX_VCP_Driver.zip Mac OSX]
<ul>
<li><p>You need to work around a safety measure called gatekeeper which is a little different per OS operating system. Follow instructions below for your OS or google “disable gatekeeper on mac [insert your version here, e.g. monterey]” [https://support.apple.com/en-us/HT202491 More info here]</p></li>
<li><p>Mojave (10.14.x)</p>
<ul>
<li><p>[http://osxdaily.com/2016/09/27/allow-apps-from-anywhere-macos-gatekeeper/ How to disable GateKeeper]</p>
<pre>sudo spctl --master-disable</pre></li></ul>
</li>
<li><p>High Sierra (10.13.x)</p>
<ul>
<li>[https://stackoverflow.com/questions/47109036/cp2102-device-is-not-listed-in-dev-on-macos-10-13 How to disable GateKeeper]</li>
<li>[https://pikeralpha.wordpress.com/2017/08/29/user-approved-kernel-extension-loading/ How to disable GateKeeper]</li>
<li>[https://www.silabs.com/community/interface/knowledge-base.entry.html/2018/03/30/usb_to_uart_bridgev-Dnef How to disable GateKeeper]</li>
<li>https://stackoverflow.com/questions/47109036/cp2102-device-is-not-listed-in-dev-on-macos-10-13</li>
<li>The allow button in the settings menu might not werk, then to disable checking altogether:
<ol style="list-style-type: decimal;">
<li>Shut down your Mac</li>
<li>Start again while holding mac+ R during boot to enter recovery mode</li>
<li>Open a terminal window</li>
<li>type the following command and press enter</li></ol>


<pre>spctl kext-consent disable</pre>
== Optional additional steps ==
<ol start="5" style="list-style-type: decimal;">
<li>Reboot</li>
<li>Try install driver again</li></ol>
</li></ul>
</li>
<li><p>Sierra (10.12.x)</p>
<ul>
<li><p>[https://www.tekrevue.com/tip/gatekeeper-macos-sierra/ How to disable GateKeeper]</p>
<pre>  sudo spctl --master-disable</pre></li></ul>
</li>
<li><p>El capitan (10.11.x)</p>
<ul>
<li>[https://medium.com/@krukmat/macos-el-capitan-enabling-usb-for-cp2102-usb-to-ttl-3b63449e02e9 How to disable GateKeeper]</li>
<li>[https://forums.developer.apple.com/thread/17452 csrutil enable –without kext]</li></ul>
</li>
<li><p>Yosemite (10.10.x)</p>
<ul>
<li>[https://www.silabs.com/community/interface/forum.topic.html/latest_vcp_driverfo-96RK Legacy driver must be installed, instead normal one.]</li></ul>


<p><img src="./images/yosemite-cp2102.png" alt="screenshot of silabs installer window, with on the left folder called Legacy MacVCP driver" width="550"/></p>
=== Adjust ESP32 Dev Module board settings ===
<p><img src="./images/yosemite-cp2102-legacy.png" alt="screenshot of the contents of the Legacy MacVCP driver folder, containing LegacyDriverReadme, ReleaseNotes and Silicon Labs VCP Driver" width="550"/></p></li></ul>
</li></ul>


<span id="after-starting-the-arduino-ide-make-sure-it-can-communicate-with-the-esp32-module"></span>
Changing the settings below will increase the speed with which your webpages will be uploaded to the board.
=== '''After starting the Arduino IDE, make sure it can communicate with the ESP32 module''' ===


<ul>
Look up the board settings under &gt; Tools &gt; Most of these settings are correct by default, you just have to change QIO to DIO
<li><p>If communication is possible, you can select /dev/cu.SLAB_USBtoUART (for other than Mac OSX, this name might be different) as shown in the picture below.</p>
* Board: ESP32 Dev module
<p><img src="./images/arduino-esp32-comm.png" alt="screenshot of Arduino window with menu Tools-Port-SLAB_USBtoUART selected" width="450"/></p></li>
* Upload Speed : 921600
<li><p>If communication is not possible, SLAB_USBtoUART will not show up (for other than Mac OSX, this name might be different.)</p></li></ul>
* CPU Frequency : 240MHz (WiFi BT)
* Flash Frequency : 80MHz
* Flash Mode : **DIO** (is QIO by default)
* Flash Size : 4MB (32Mb)
* Partition Scheme : Default
* Core Debug Level : None
* PSRAM : Disabled


<img src="./images/arduino-esp32-comm-failed.png" alt="arduino-esp32-comm-failed" width="550"/>
[[File:Arduino-wifizine-config-board.png|500px|frame|none|alt=Screenshot of board settings under > Tools in Arduino window|Screenshot of board settings under > Tools in Arduino window]]


<span id="upload-to-the-board"></span>
=== Increasing the upload capacity of the board (at your own risk) ===
=== Upload to the Board ===


<ul>
It is possible to increase the upload capacity of the board so you can make slightly bigger websites. This is documented by Doohoyi from Dianaband, but we haven’t tried it. Proceed at your own risk!
<li><p>Click on the Upload button (arrow pointing right on top of the Arduino window), and then '''''while''''' the text ‘''Connecting …''’ displays in the control window at the bottom of the screen, [https://randomnerdtutorials.com/solved-failed-to-connect-to-esp32-timed-out-waiting-for-packet-header/ press and hold the’ BOOT ’button on the ESP board for one second].</p>
<p><img src="./images/arduino-connecting.png" alt="when the output window in Arduino says CONNECTING, push the boot button on the board" width="650"/></p></li>
<li><p>'''If the upload was successful, you will see this screen''':</p>
<p><img src="./images/arduino-wifizine-upload-done.png" alt="output window in Arduino stating Leaving...Hard resetting via RTS pin...." width="450"/></p></li>
<li><p>'''If the upload was unsuccessful, you will see this error'''</p>
<p>[[./images/arduino-wifizine-upload-failed.png|[[File:./images/arduino-wifizine-upload-failed.png|arduino window with an orange error message]]]]</p></li>
<li><p>[https://randomnerdtutorials.com/esp32-troubleshooting-guide/ Troubleshooting tips for various problem factors here]</p></li>
<li><p>'''Mac OS Monterey issue during upload'''</p>
<ul>
<li><p>If you’re using Mac OS Monterey, you might get an error like this in the Arduino output window:</p>
<p>” ''exec: “python”: executable file not found in $PATH error on mac monterey'' ”</p></li>
<li><p>If that happens, open a Terminal window, and paste the code below to install the right version of Python in the right place. Then hit enter.</p>
<pre>sed -i -e 's/=python /=python3 /g' ~/Library/Arduino15/packages/esp32/hardware/esp32/*/platform.txt
</pre></li>
<li><p>Now restart the Arduino application and try uploading the code to the board again.</p></li></ul>
</li></ul>


<span id="publishing-your-first-mini-webpage-to-the-module"></span>
[https://github.com/applecargo/WifiZineThrowie/blob/master/docs/index.md#increasing-the-upload-capacity-of-the-board-optional Dianaband’s workshop documentation]
== Publishing your first mini webpage to the module ==
 
<ul>
<li><p>The content of the small webpage we will put on the wifi modules is stored separately from the running code that takes care of publishing it. Therefore, it goes through a separate process from the usual Arduino IDE code upload process. To do this, you need to install a separate extension plug-in.</p></li>
<li><p>'''Download and install''' [https://github.com/me-no-dev/arduino-esp32fs-plugin/releases '''the ESP32FS plug-in''']</p>
<p>Create a folder called ‘~/Documents/Arduino/tools’</p>
<p>[[./images/arduino-esp32fs-00002.png|[[File:./images/arduino-esp32fs-00002.png|Screenshot of finder window open at Arduino, showing subfolders tools]]]]</p>
<p>Copy unpacked ESP32FS into the subfolder tools</p>
<p>[[./images/arduino-esp32fs-00003.png|[[File:./images/arduino-esp32fs-00003.png|screenshot of finder window open at tools with subfolder ESP32FS inside it]]]]</p>
<p>Be mindful with the construction of the folders. It should be installed as shown in the following figure. (Note also that the folder name is ESP32FS!)</p>
<p>[[./images/arduino-esp32fs-00004.png|[[File:./images/arduino-esp32fs-00004.png|Screenshot of finder wiindow open at tools, showing filepath - ESP32FS - tool - esp32fs.jar]]]]</p>
<p>After restarting the Arduino IDE, verify that the plug-in installation was successful. If successful, you will see a menu called ‘ESP32 Sketch Data Upload’ added.</p>
<p>[[./images/arduino-esp32fs-00005.png|[[File:./images/arduino-esp32fs-00005.png|Screenshot of Arduino window with menu open at - Tools - ESP32 Sketch Data Upload]]]]</p>
<p>When you click this menu option, it will move all the files in the ‘~/Documents/Arduino/WifiZineThrowie/data’ folder to the ESP32 module’s web page store.</p></li></ul>
 
<span id="changing-the-name-of-your-wifi-network"></span>
=== Changing the name of your wifi network ===
 
The arduino code (WifiZineThrowie.ino) specifies the name of your personal mini network by looking for a file in the data folder that ends with .ssid. In the files you downloaded you can see it is now called: “solarpunk-schat.ssid”. You can change this filename to the name you like for your network (avoid symbols to be sure). E.g. Clue1-Loes.
 
<img src="./images/ssid_name.png" alt="screenshot of finder window showing contents of the data folder, with the ssid file solarpunk-schat selected" width="450"/>
 
<span id="uploading-your-website-to-the-module"></span>
=== Uploading your website to the module ===
 
Then, in the Arduino software, go to &gt; Tools and select &gt; ESP32 Sketch Data Upload
 
[[./images/arduino-wifizine-webpage-upload.png|[[File:./images/arduino-wifizine-webpage-upload.png|screenshot of arduino software with the WifiZineThrowie sketch open and output window saying SPIFFS uploading image…]]]]
 
Please execute the upload. The color of the message output during upload is displayed in white instead of red.
 
While ‘Connecting …’ displays, [https://randomnerdtutorials.com/solved-failed-to-connect-to-esp32-timed-out-waiting-for-packet-header/ press and hold the’ BOOT ’button on the ESP board for one second].


Screen when upload is completed successfully
== Troubleshooting ==
We have collected various troubleshooting tips on the [[ESP32 Mac troubleshooting]] page


[[./images/arduino-wifizine-webpage-upload-done.png|[[File:./images/arduino-wifizine-webpage-upload-done.png|Screenshot of arduino window stating SPIFFS image uploaded]]]]
== Acknowledgments ==


Success! You can now find your private internet spot. Open the network settings on your phone, and select your network. Your website should pop up automatically, but some patience might help :)
Is document is heavily based on the wonderful documentation of Dianaband: https://github.com/applecargo/WifiZineThrowie/blob/master/docs/index.md
 
<span id="find-your-wifi-network"></span>
=== Find your wifi network! ===
 
Look up the list of available networks on your phone with the name you provided to the .ssid file earlier. You should see your network popping up there. Try connecting to it. Your website should come up automatically with a pop-up window.
 
<img src="./images/login_network.png" alt="LEFT - screenshot of android phone open at wifi menu, showing all the available networkds, with network solarpunk-schat highlighted. RIGHT - screenshot of pop-up window displaying the website contents of the html file we made" width="650"/>
 
<span id="optional---increasing-the-upload-capacity-of-the-board-at-your-own-risk"></span>
=== OPTIONAL - Increasing the upload capacity of the board (at your own risk) ===
 
It is possible to increase the upload capacity of the board so you can make slightly bigger websites. This is documented by Doohoyi from Dianaband, but we haven’t tried it. Proceed at your own risk!
 
[https://github.com/applecargo/WifiZineThrowie/blob/master/docs/index.md#increasing-the-upload-capacity-of-the-board-optional Dianaband’s workshop documentation]

Latest revision as of 15:53, 8 March 2023

[work in progress]

Arduino IDE setup for ESP32

This guide walks you through setting up the legacy Arduino IDE for use with ESP32 devkit v1 module as well as installation of the libraries we most use during H&D workshops. The instructions are for Arduino IDE version 1.x, but should mostly make sense for version 2.x as well. The reason we're using the older version of the IDE is because there isn't any way in the new version to upload files to the ESP32 board.

This page only documents the installation of the ESP32 support for the Arduino IDE. Next steps may involve:

Installation

Download IDE

First, download the Legacy Arduino IDE.

Pick the installer appropriate for your system.

If necessary you can follow one of these guides:

Install ESP32 Boards

Next we need to install an extension that makes it possible to program the ESP32 modules from the Arduino IDE.

Arduino IDE settings Open the Arduino Setting by going to: - Windows/Linux: Menu > File > Preferences... - MacOS: Menu > Arduino > Preferences...

  • Copy and paste the following into ‘Additional Boards Manager URLs’ and click ‘Ok’.
https://dl.espressif.com/dl/package_esp32_index.json
Screenshot of the popup window for adding board urls
Screenshot of the popup window for adding board urls

Optional:

  • Change the compilation and upload process display mode to ‘verbose mode’
  • Check ‘compile’ and ‘upload’ in ‘Show verbose output during:’

Launch the Board Manager Go to the menu Tools > Boards > Board manager...

Screenshot showing where to find the board manager panel: Menu > Tools > Board > Boards Manager
Screenshot showing where to find the board manager panel: Menu > Tools > Board > Boards Manager
arduino board manager popup window
Arduino board manager popup window

Type ‘esp32’ in the search box and click ‘Install’

board manager pop-up with esp32 typed into search box
Board manager pop-up with esp32 typed into search box

Install drivers

For your computer to be able to communicate with the ESP32 board you need device drivers. If you have already installed the SiLabs driver you can skip this step. If you're unsure, check the step Check if the USB driver are working below.

Installing a USB device driver to communicate with the ESP32 module (chip name: SiliconLabs CP2012)

Linux 3.x.x & 4.x.x

Linux 2.6.x

Linux 2.6.x - No information

Windows

Mac OS

  • Check if you already have this driver installed by searching your machine for a file named “SiLabsUSBDriver.kext” AND/OR “SiLabsUSBDriverYos.kext” AND/OR “SiLabsUSBDriver64.kext”. On a Mac, they can be in either of these folders listed below, depending on your system. If you find nothing, proceed to install. Otherwise, uninstall using the uninstaller provided, before re-installing (drag the uninstall.sh file into a terminal window and hit enter to uninstall.
    • /Library/Extensions/SiLabsUSBDriver.kext
    • /Library/Extensions/SiLabsUSBDriverYos.kext
    • /System/Library/Extensions/SiLabsUSBDriver64.kext
    • /System/Library/Extensions/SiLabsUSBDriver.kext

Check if the USB driver are working

  • If you just installed the driver, restart your computer.
  • For Mac OS users: after restarting, make sure GateKeeper does not interfere with driver loading.
  • If you have problems, please check out this MacOS troubleshooting page.
  • If communication is possible, you should be able to select the port under: Menu > Tools > Port > ...

The name of the port may vary depending on your operating system.

    • On Windows it will probably called COM* where * is a number, ie. COM4.
    • On linux it will be called /dev/ttyUSB* where * is a number, ie /dev/ttyUSB0
    • On MacOS it will be called /dev/cu.SLAB_USBtoUART as shown in the picture below.
      screenshot of Arduino window with menu Tools-Port-SLAB_USBtoUART selected
      screenshot of Arduino window with menu Tools-Port-SLAB_USBtoUART selected

Install libraries

At this point you probably continue installing necessary libraries and uploading to the ESP32

Optional additional steps

Adjust ESP32 Dev Module board settings

Changing the settings below will increase the speed with which your webpages will be uploaded to the board.

Look up the board settings under > Tools > Most of these settings are correct by default, you just have to change QIO to DIO

  • Board: ESP32 Dev module
  • Upload Speed : 921600
  • CPU Frequency : 240MHz (WiFi BT)
  • Flash Frequency : 80MHz
  • Flash Mode : **DIO** (is QIO by default)
  • Flash Size : 4MB (32Mb)
  • Partition Scheme : Default
  • Core Debug Level : None
  • PSRAM : Disabled
Screenshot of board settings under > Tools in Arduino window
Screenshot of board settings under > Tools in Arduino window

Increasing the upload capacity of the board (at your own risk)

It is possible to increase the upload capacity of the board so you can make slightly bigger websites. This is documented by Doohoyi from Dianaband, but we haven’t tried it. Proceed at your own risk!

Dianaband’s workshop documentation

Troubleshooting

We have collected various troubleshooting tips on the ESP32 Mac troubleshooting page

Acknowledgments

Is document is heavily based on the wonderful documentation of Dianaband: https://github.com/applecargo/WifiZineThrowie/blob/master/docs/index.md