<!DOCTYPE html>
< html lang = "en" class = "no-js" >
< head >
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width,initial-scale=1" >
< meta http-equiv = "x-ua-compatible" content = "ie=edge" >
< meta name = "description" content = "ESP8266/ESP32 WLAN configuration at run time with web interface" >
< link rel = "canonical" href = "https://Hieromon.github.io/AutoConnect/index.html" >
< meta name = "author" content = "Hieromon Ikasamo" >
< meta name = "lang:clipboard.copy" content = "Copy to clipboard" >
< meta name = "lang:clipboard.copied" content = "Copied to clipboard" >
< meta name = "lang:search.language" content = "en" >
< meta name = "lang:search.pipeline.stopwords" content = "True" >
< meta name = "lang:search.pipeline.trimmer" content = "True" >
< meta name = "lang:search.result.none" content = "No matching documents" >
< meta name = "lang:search.result.one" content = "1 matching document" >
< meta name = "lang:search.result.other" content = "# matching documents" >
< meta name = "lang:search.tokenizer" content = "[\s\-]+" >
< link rel = "shortcut icon" href = "./assets/images/favicon.png" >
< meta name = "generator" content = "mkdocs-0.17.3, mkdocs-material-2.7.0" >
< title > AutoConnect for ESP8266/ESP32< / title >
< link rel = "stylesheet" href = "./assets/stylesheets/application.78aab2dc.css" >
< link rel = "stylesheet" href = "./assets/stylesheets/application-palette.6079476c.css" >
< script src = "./assets/javascripts/modernizr.1aa3b519.js" > < / script >
< link href = "https://fonts.gstatic.com" rel = "preconnect" crossorigin >
< link rel = "stylesheet" href = "https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono" >
< style > body , input { font-family : "Roboto" , "Helvetica Neue" , Helvetica , Arial , sans-serif } code , kbd , pre { font-family : "Roboto Mono" , "Courier New" , Courier , monospace } < / style >
< link rel = "stylesheet" href = "https://fonts.googleapis.com/icon?family=Material+Icons" >
< link rel = "stylesheet" href = "./css/paragraph.css" >
< / head >
< body dir = "ltr" data-md-color-primary = "indigo" data-md-color-accent = "indigo" >
< svg class = "md-svg" >
< defs >
< svg xmlns = "http://www.w3.org/2000/svg" width = "416" height = "448"
viewBox="0 0 416 448" id="github">
< path fill = "currentColor" d = "M160 304q0 10-3 . 125 20 . 5t-10 . 75 19-18 . 125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
19-18.125 8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19
18.125-8.5 18.125 8.5 10.75 19 3.125 20.5zM360
304q0-30-17.25-51t-46.75-21q-10.25 0-48.75 5.25-17.75 2.75-39.25
2.75t-39.25-2.75q-38-5.25-48.75-5.25-29.5 0-46.75 21t-17.25 51q0 22 8
38.375t20.25 25.75 30.5 15 35 7.375 37.25 1.75h42q20.5 0
37.25-1.75t35-7.375 30.5-15 20.25-25.75 8-38.375zM416 260q0 51.75-15.25
82.75-9.5 19.25-26.375 33.25t-35.25 21.5-42.5 11.875-42.875 5.5-41.75
1.125q-19.5 0-35.5-0.75t-36.875-3.125-38.125-7.5-34.25-12.875-30.25-20.25-21.5-28.75q-15.5-30.75-15.5-82.75
0-59.25 34-99-6.75-20.5-6.75-42.5 0-29 12.75-54.5 27 0 47.5 9.875t47.25
30.875q36.75-8.75 77.25-8.75 37 0 70 8 26.25-20.5
46.75-30.25t47.25-9.75q12.75 25.5 12.75 54.5 0 21.75-6.75 42 34 40 34
99.5z" />
< / svg >
< / defs >
< / svg >
< input class = "md-toggle" data-md-toggle = "drawer" type = "checkbox" id = "drawer" >
< input class = "md-toggle" data-md-toggle = "search" type = "checkbox" id = "search" >
< label class = "md-overlay" data-md-component = "overlay" for = "drawer" > < / label >
< a href = "#autoconnect-for-esp8266esp32" tabindex = "1" class = "md-skip" >
Skip to content
< / a >
< header class = "md-header" data-md-component = "header" >
< nav class = "md-header-nav md-grid" >
< div class = "md-flex" >
< div class = "md-flex__cell md-flex__cell--shrink" >
< a href = "https://Hieromon.github.io/AutoConnect/" title = "AutoConnect for ESP8266/ESP32" class = "md-header-nav__button md-logo" >
< img src = "./images/arduino-logo.svg" width = "24" height = "24" >
< / a >
< / div >
< div class = "md-flex__cell md-flex__cell--shrink" >
< label class = "md-icon md-icon--menu md-header-nav__button" for = "drawer" > < / label >
< / div >
< div class = "md-flex__cell md-flex__cell--stretch" >
< div class = "md-flex__ellipsis md-header-nav__title" data-md-component = "title" >
< span class = "md-header-nav__topic" >
AutoConnect for ESP8266/ESP32
< / span >
< span class = "md-header-nav__topic" >
Overview
< / span >
< / div >
< / div >
< div class = "md-flex__cell md-flex__cell--shrink" >
< label class = "md-icon md-icon--search md-header-nav__button" for = "search" > < / label >
< div class = "md-search" data-md-component = "search" role = "dialog" >
< label class = "md-search__overlay" for = "search" > < / label >
< div class = "md-search__inner" role = "search" >
< form class = "md-search__form" name = "search" >
< input type = "text" class = "md-search__input" name = "query" placeholder = "Search" autocapitalize = "off" autocorrect = "off" autocomplete = "off" spellcheck = "false" data-md-component = "query" data-md-state = "active" >
< label class = "md-icon md-search__icon" for = "search" > < / label >
< button type = "reset" class = "md-icon md-search__icon" data-md-component = "reset" tabindex = "-1" >

< / button >
< / form >
< div class = "md-search__output" >
< div class = "md-search__scrollwrap" data-md-scrollfix >
< div class = "md-search-result" data-md-component = "result" >
< div class = "md-search-result__meta" >
Type to start searching
< / div >
< ol class = "md-search-result__list" > < / ol >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< div class = "md-flex__cell md-flex__cell--shrink" >
< div class = "md-header-nav__source" >
< a href = "https://github.com/Hieromon/AutoConnect" title = "Go to repository" class = "md-source" data-md-source = "github" >
< div class = "md-source__icon" >
< svg viewBox = "0 0 24 24" width = "24" height = "24" >
< use xlink:href = "#github" width = "24" height = "24" > < / use >
< / svg >
< / div >
< div class = "md-source__repository" >
Hieromon/AutoConnect
< / div >
< / a >
< / div >
< / div >
< / div >
< / nav >
< / header >
< div class = "md-container" >
< nav class = "md-tabs" data-md-component = "tabs" >
< div class = "md-tabs__inner md-grid" >
< ul class = "md-tabs__list" >
< li class = "md-tabs__item" >
< a href = "index.html" title = "Overview" class = "md-tabs__link md-tabs__link--active" >
Overview
< / a >
< / li >
< / ul >
< / div >
< / nav >
< main class = "md-main" >
< div class = "md-main__inner md-grid" data-md-component = "container" >
< div class = "md-sidebar md-sidebar--primary" data-md-component = "navigation" >
< div class = "md-sidebar__scrollwrap" >
< div class = "md-sidebar__inner" >
< nav class = "md-nav md-nav--primary" data-md-level = "0" >
< label class = "md-nav__title md-nav__title--site" for = "drawer" >
< span class = "md-nav__button md-logo" >
< img src = "./images/arduino-logo.svg" width = "48" height = "48" >
< / span >
AutoConnect for ESP8266/ESP32
< / label >
< div class = "md-nav__source" >
< a href = "https://github.com/Hieromon/AutoConnect" title = "Go to repository" class = "md-source" data-md-source = "github" >
< div class = "md-source__icon" >
< svg viewBox = "0 0 24 24" width = "24" height = "24" >
< use xlink:href = "#github" width = "24" height = "24" > < / use >
< / svg >
< / div >
< div class = "md-source__repository" >
Hieromon/AutoConnect
< / div >
< / a >
< / div >
< ul class = "md-nav__list" data-md-scrollfix >
< li class = "md-nav__item md-nav__item--active" >
< input class = "md-toggle md-nav__toggle" data-md-toggle = "toc" type = "checkbox" id = "toc" >
< label class = "md-nav__link md-nav__link--active" for = "toc" >
Overview
< / label >
< a href = "index.html" title = "Overview" class = "md-nav__link md-nav__link--active" >
Overview
< / a >
< nav class = "md-nav md-nav--secondary" >
< label class = "md-nav__title" for = "toc" > Table of contents< / label >
< ul class = "md-nav__list" data-md-scrollfix >
< li class = "md-nav__item" >
< a href = "#overview" title = "Overview" class = "md-nav__link" >
Overview
< / a >
< nav class = "md-nav" >
< ul class = "md-nav__list" >
< li class = "md-nav__item" >
< a href = "#no-need-pre-coded-ssid-password" title = " No need pre-coded SSID & password" class = "md-nav__link" >
No need pre-coded SSID & password
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#simple-usage" title = " Simple usage" class = "md-nav__link" >
Simple usage
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#store-the-established-connection" title = " Store the established connection" class = "md-nav__link" >
Store the established connection
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#easy-to-embed-in" title = " Easy to embed in" class = "md-nav__link" >
Easy to embed in
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#lives-with-the-your-sketches" title = " Lives with the your sketches" class = "md-nav__link" >
Lives with the your sketches
< / a >
< / li >
< / ul >
< / nav >
< / li >
< li class = "md-nav__item" >
< a href = "#installation" title = "Installation" class = "md-nav__link" >
Installation
< / a >
< nav class = "md-nav" >
< ul class = "md-nav__list" >
< li class = "md-nav__item" >
< a href = "#requirements" title = "Requirements" class = "md-nav__link" >
Requirements
< / a >
< nav class = "md-nav" >
< ul class = "md-nav__list" >
< li class = "md-nav__item" >
< a href = "#supported-hardware" title = "Supported hardware" class = "md-nav__link" >
Supported hardware
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#required-libraries" title = "Required libraries" class = "md-nav__link" >
Required libraries
< / a >
< / li >
< / ul >
< / nav >
< / li >
< li class = "md-nav__item" >
< a href = "#install-the-autoconnect" title = "Install the AutoConnect" class = "md-nav__link" >
Install the AutoConnect
< / a >
< / li >
< / ul >
< / nav >
< / li >
< / ul >
< / nav >
< / li >
< li class = "md-nav__item" >
< a href = "gettingstarted/index.html" title = "Getting started" class = "md-nav__link" >
Getting started
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "menu/index.html" title = "AutoConnect menu" class = "md-nav__link" >
AutoConnect menu
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "basicusage/index.html" title = "Basic usage" class = "md-nav__link" >
Basic usage
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "advancedusage/index.html" title = "Advanced usage" class = "md-nav__link" >
Advanced usage
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "api/index.html" title = "Library APIs" class = "md-nav__link" >
Library APIs
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "examples/index.html" title = "Examples" class = "md-nav__link" >
Examples
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "faq/index.html" title = "FAQ" class = "md-nav__link" >
FAQ
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "changelog/index.html" title = "Change log" class = "md-nav__link" >
Change log
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "license/index.html" title = "License" class = "md-nav__link" >
License
< / a >
< / li >
< / ul >
< / nav >
< / div >
< / div >
< / div >
< div class = "md-sidebar md-sidebar--secondary" data-md-component = "toc" >
< div class = "md-sidebar__scrollwrap" >
< div class = "md-sidebar__inner" >
< nav class = "md-nav md-nav--secondary" >
< label class = "md-nav__title" for = "toc" > Table of contents< / label >
< ul class = "md-nav__list" data-md-scrollfix >
< li class = "md-nav__item" >
< a href = "#overview" title = "Overview" class = "md-nav__link" >
Overview
< / a >
< nav class = "md-nav" >
< ul class = "md-nav__list" >
< li class = "md-nav__item" >
< a href = "#no-need-pre-coded-ssid-password" title = " No need pre-coded SSID & password" class = "md-nav__link" >
No need pre-coded SSID & password
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#simple-usage" title = " Simple usage" class = "md-nav__link" >
Simple usage
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#store-the-established-connection" title = " Store the established connection" class = "md-nav__link" >
Store the established connection
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#easy-to-embed-in" title = " Easy to embed in" class = "md-nav__link" >
Easy to embed in
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#lives-with-the-your-sketches" title = " Lives with the your sketches" class = "md-nav__link" >
Lives with the your sketches
< / a >
< / li >
< / ul >
< / nav >
< / li >
< li class = "md-nav__item" >
< a href = "#installation" title = "Installation" class = "md-nav__link" >
Installation
< / a >
< nav class = "md-nav" >
< ul class = "md-nav__list" >
< li class = "md-nav__item" >
< a href = "#requirements" title = "Requirements" class = "md-nav__link" >
Requirements
< / a >
< nav class = "md-nav" >
< ul class = "md-nav__list" >
< li class = "md-nav__item" >
< a href = "#supported-hardware" title = "Supported hardware" class = "md-nav__link" >
Supported hardware
< / a >
< / li >
< li class = "md-nav__item" >
< a href = "#required-libraries" title = "Required libraries" class = "md-nav__link" >
Required libraries
< / a >
< / li >
< / ul >
< / nav >
< / li >
< li class = "md-nav__item" >
< a href = "#install-the-autoconnect" title = "Install the AutoConnect" class = "md-nav__link" >
Install the AutoConnect
< / a >
< / li >
< / ul >
< / nav >
< / li >
< / ul >
< / nav >
< / div >
< / div >
< / div >
< div class = "md-content" >
< article class = "md-content__inner md-typeset" >
< h1 id = "autoconnect-for-esp8266esp32" > AutoConnect < small > for ESP8266/ESP32< / small > < a class = "headerlink" href = "#autoconnect-for-esp8266esp32" title = "Permanent link" > ¶ < / a > < / h1 >
< p > An Arduino library for ESP8266/ESP32 WLAN configuration at run time with web interface.< / p >
< h2 id = "overview" > Overview< a class = "headerlink" href = "#overview" title = "Permanent link" > ¶ < / a > < / h2 >
< p > To the dynamic configuration for joining to WLAN with SSID and PSK accordingly. It an Arduino library united with < em > ESP8266WebServer< / em > class for ESP8266 or < em > WebServer< / em > class for ESP32.
Easy implementing the Web interface constituting the WLAN for ESP8266/ESP32 WiFi connection. With this library to make a sketch easily which connects from ESP8266/ESP32 to the access point at runtime by the web interface without hard-coded SSID and password.< / p >
< p > < img style = "display:inline-block;width:460px;margin-right:30px;" src = "./images/ov.png" / > < span style = "display:inline-block;width:182px;height:322px;border:solid 1px lightgrey;" > < img data-gifffer = "./images/ov.gif" data-gifffer-width = "180" style = "width:180px;" / > < / span > < / p >
< h3 id = "no-need-pre-coded-ssid-password" > < i class = "fa fa-arrow-circle-right" aria-hidden = "true" > < / i > No need pre-coded SSID & password< a class = "headerlink" href = "#no-need-pre-coded-ssid-password" title = "Permanent link" > ¶ < / a > < / h3 >
< p > < span class = "lead" > It is no needed hard-coding in advance the SSID and Password into the sketch to connect between ESP8266/ESP32 and WLAN. You can input SSID & Password from a smartphone via the web interface at runtime.< / span > < / p >
< h3 id = "simple-usage" > < i class = "fa fa-arrow-circle-right" aria-hidden = "true" > < / i > Simple usage< a class = "headerlink" href = "#simple-usage" title = "Permanent link" > ¶ < / a > < / h3 >
< p > < span class = "lead" > AutoConnect control screen will be displayed automatically for establishing new connections. It aids by the < a href = "https://en.wikipedia.org/wiki/Captive_portal" > captive portal< / a > when vested the connection cannot be detected.< br > By using the < a href = "menu/index.html" > AutoConnect menu< / a > , to manage the connections convenient.< / span > < / p >
< h3 id = "store-the-established-connection" > < i class = "fa fa-arrow-circle-right" aria-hidden = "true" > < / i > Store the established connection< a class = "headerlink" href = "#store-the-established-connection" title = "Permanent link" > ¶ < / a > < / h3 >
< p > < span class = "lead" > The connection authentication data as credentials are saved automatically in EEPROM of ESP8266/ESP32 and You can select the past SSID from the < a href = "menu/index.html" > AutoConnect menu< / a > .< / span > < / p >
< h3 id = "easy-to-embed-in" > < i class = "fa fa-arrow-circle-right" aria-hidden = "true" > < / i > Easy to embed in< a class = "headerlink" href = "#easy-to-embed-in" title = "Permanent link" > ¶ < / a > < / h3 >
< p > < span class = "lead" > AutoConnect can be placed easily in your sketch. It's "< strong > begin< / strong > " and "< strong > handleClient< / strong > " only.< / span > < / p >
< h3 id = "lives-with-the-your-sketches" > < i class = "fa fa-arrow-circle-right" aria-hidden = "true" > < / i > Lives with the your sketches< a class = "headerlink" href = "#lives-with-the-your-sketches" title = "Permanent link" > ¶ < / a > < / h3 >
< p > < span class = "lead" > The sketches which provide the web page using ESP8266WebServer there is, AutoConnect will not disturb it. AutoConnect can use an already instantiated ESP8266WebServer object, or itself can assign it.< br > This efficacy can also be applied to ESP32. The corresponding class for ESP32 will be the WebServer.< / span > < / p >
< h2 id = "installation" > Installation< a class = "headerlink" href = "#installation" title = "Permanent link" > ¶ < / a > < / h2 >
< h3 id = "requirements" > Requirements< a class = "headerlink" href = "#requirements" title = "Permanent link" > ¶ < / a > < / h3 >
< h4 id = "supported-hardware" > Supported hardware< a class = "headerlink" href = "#supported-hardware" title = "Permanent link" > ¶ < / a > < / h4 >
< ul class = "task-list" >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > Generic ESP8266 modules (applying the ESP8266 Community's Arduino core)< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > Adafruit HUZZAH ESP8266 (ESP-12)< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > ESP-WROOM-02< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > Heltec WiFi Kit 8< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > NodeMCU 0.9 (ESP-12) / NodeMCU 1.0 (ESP-12E)< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > Olimex MOD-WIFI-ESP8266< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > SparkFun Thing< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > SweetPea ESP-210< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > ESP32Dev Board (applying the Espressif's arduino-esp32 core)< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > SparkFun ESP32 Thing< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > WEMOS LOLIN D32< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > Ai-Thinker NodeMCU-32S< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > Heltec WiFi Kit 32< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > M5Stack< / li >
< li class = "task-list-item" > < input type = "checkbox" disabled checked / > And other ESP8266/ESP32 modules supported by the Additional Board Manager URLs of the Arduino-IDE.< / li >
< / ul >
< div class = "admonition info" >
< p class = "admonition-title" > About flash size on the module< / p >
< p > The AutoConnect sketch size is relatively large. Large flash capacity is necessary. 512Kbyte (4Mbits) flash inclusion module such as ESP-01 is not recommended.< / p >
< / div >
< h4 id = "required-libraries" > Required libraries< a class = "headerlink" href = "#required-libraries" title = "Permanent link" > ¶ < / a > < / h4 >
< p > AutoConnect requires the following environment and libraries.< / p >
< p > < i class = "fa fa-download" > < / i > < strong > Arduino IDE< / strong > < / p >
< p > The current upstream at the 1.8 level or later is needed. Please install from the < a href = "https://www.arduino.cc/en/Main/Software" > official Arduino IDE download page< / a > . This step is not required if you already have a modern version.< / p >
< p > < i class = "fa fa-download" > < / i > < strong > ESP8266 Arduino core< / strong > < / p >
< p > AutoConnect targets sketches made on the assumption of < a href = "https://github.com/esp8266/Arduino" > ESP8266 Community's Arduino core< / a > . The < a href = "https://github.com/esp8266/Arduino/releases/latest" > latest release< / a > is recommended.< br / >
Install third-party platform using the < em > Boards Manager< / em > of Arduino IDE. Package URL is < a href = "http://arduino.esp8266.com/stable/package_esp8266com_index.json" > http://arduino.esp8266.com/stable/package_esp8266com_index.json< / a > < / p >
< p > < i class = "fa fa-download" > < / i > < strong > ESP32 Arduino core< / strong > < / p >
< p > Also, to apply AutoConnect to ESP32, the < a href = "https://github.com/espressif/arduino-esp32" > arduino-esp32 core< / a > provided by Espressif is needed. The < a href = "https://github.com/espressif/arduino-esp32/releases/latest" > latest release< / a > is recommended.< br / >
Install third-party platform using the < em > Boards Manager< / em > of Arduino IDE. You can add multiple URLs into < em > Additional Board Manager URLs< / em > field, separating them with commas. Package URL is < a href = "https://dl.espressif.com/dl/package_esp32_index.json" > https://dl.espressif.com/dl/package_esp32_index.json< / a > < / p >
< p > < i class = "fa fa-download" > < / i > < strong > Additional necessary library< / strong > < / p >
< p > The < a href = "https://github.com/Hieromon/PageBuilder" > PageBuilder< / a > library to build HTML for ESP8266WebServer is needed.< br / >
To install the PageBuilder library into your Arduino IDE, you can use the < em > Library Manager< / em > . Select the board of ESP8266 series in the Arduino IDE, open the library manager and search keyword '< strong > PageBuilder< / strong > ' with the topic '< strong > Communication< / strong > ', then you can see the < em > PageBuilder< / em > . The latest version is required 1.1.0 later for ESP32.< / p >
< p > < img src = "./images/lm.png" width = "640" / > < / p >
< h3 id = "install-the-autoconnect" > Install the AutoConnect< a class = "headerlink" href = "#install-the-autoconnect" title = "Permanent link" > ¶ < / a > < / h3 >
< p > Clone or download from the < a href = "https://github.com/Hieromon/AutoConnect" > AutoConnect GitHub repository< / a > .< / p >
< p > < img src = "./images/gitrepo.png" width = "640" / > < / p >
< p > When you select Download, you can import it to Arduino IDE immediately. After downloaded, the AutoConnect-master.zip file will be saved in your download folder. Then in the Arduino IDE, navigate to < em > "Sketch > Include Library"< / em > . At the top of the drop down list, select the option to < em > "Add .ZIP Library..."< / em > . Details for < a href = "https://www.arduino.cc/en/Guide/Libraries#toc4" > Arduino official page< / a > .< / p >
< p > < img src = "./images/ins_lib.png" / > < / p >
< div class = "admonition info" >
< p class = "admonition-title" > Supported by Library manager.< / p >
< p > AutoConnect was added to the Arduino IDE library manager. It can be used with the PlatformIO library also.< / p >
< / div >
< script >
window.onload = function() {
Gifffer();
}
< / script >
< / article >
< / div >
< / div >
< / main >
< footer class = "md-footer" >
< div class = "md-footer-nav" >
< nav class = "md-footer-nav__inner md-grid" >
< a href = "gettingstarted/index.html" title = "Getting started" class = "md-flex md-footer-nav__link md-footer-nav__link--next" rel = "next" >
< div class = "md-flex__cell md-flex__cell--stretch md-footer-nav__title" >
< span class = "md-flex__ellipsis" >
< span class = "md-footer-nav__direction" >
Next
< / span >
Getting started
< / span >
< / div >
< div class = "md-flex__cell md-flex__cell--shrink" >
< i class = "md-icon md-icon--arrow-forward md-footer-nav__button" > < / i >
< / div >
< / a >
< / nav >
< / div >
< div class = "md-footer-meta md-typeset" >
< div class = "md-footer-meta__inner md-grid" >
< div class = "md-footer-copyright" >
< div class = "md-footer-copyright__highlight" >
Copyright © 2018 Hieromon Ikasamo
< / div >
powered by
< a href = "http://www.mkdocs.org" > MkDocs< / a >
and
< a href = "https://squidfunk.github.io/mkdocs-material/" >
Material for MkDocs< / a >
< / div >
< div class = "md-footer-social" >
< link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" >
< a href = "https://github.com/Hieromon" class = "md-footer-social__link fa fa-github" > < / a >
< a href = "https://twitter.com/hieromon" class = "md-footer-social__link fa fa-twitter" > < / a >
< / div >
< / div >
< / div >
< / footer >
< / div >
< script src = "./assets/javascripts/application.8eb9be28.js" > < / script >
< script > app . initialize ( { version : "0.17.3" , url : { base : "." } } ) < / script >
< script src = "./js/gifffer.min.js" > < / script >
< script > ! function ( e , a , t , n , o , c , i ) { e . GoogleAnalyticsObject = o , e . ga = e . ga || function ( ) { ( e . ga . q = e . ga . q || [ ] ) . push ( arguments ) } , e . ga . l = 1 * new Date , c = a . createElement ( t ) , i = a . getElementsByTagName ( t ) [ 0 ] , c . async = 1 , c . src = "https://www.google-analytics.com/analytics.js" , i . parentNode . insertBefore ( c , i ) } ( window , document , "script" , 0 , "ga" ) , ga ( "create" , "UA-116150854-1" , "auto" ) , ga ( "set" , "anonymizeIp" , ! 0 ) , ga ( "send" , "pageview" ) ; var links = document . getElementsByTagName ( "a" ) ; if ( Array . prototype . map . call ( links , function ( e ) { e . host != document . location . host && e . addEventListener ( "click" , function ( ) { var a = e . getAttribute ( "data-md-action" ) || "follow" ; ga ( "send" , "event" , "outbound" , a , e . href ) } ) } ) , document . forms . search ) { var query = document . forms . search . query ; query . addEventListener ( "blur" , function ( ) { if ( this . value ) { var e = document . location . pathname ; ga ( "send" , "pageview" , e + "?q=" + this . value ) } } ) } < / script >
< / body >
< / html >