{"id":1323,"date":"2020-04-08T10:04:07","date_gmt":"2020-04-08T08:04:07","guid":{"rendered":"https:\/\/www.pschatzmann.ch\/home\/?p=1323"},"modified":"2020-11-21T22:22:45","modified_gmt":"2020-11-21T21:22:45","slug":"progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32","status":"publish","type":"post","link":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/","title":{"rendered":"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32)"},"content":{"rendered":"<p>The <strong>ESP32<\/strong> can provide the functionality of a Webserver. There are plenty of examples where this functionality is used to provide a GUI to control the Microcontroller or to provide information from it.<\/p>\n<p>What all have in common: they is very basic and often plain ugly. Therefore the question is, how to run a modern <strong>Progressive JavaScript Frameworks together with an ESP32<\/strong> in an easy way. Unfortunately it is out of the question to put the necessary files on the Microcontroller: there is just not enough space for this. So we need to define some alternative architecture:<br \/>\n&#8211; In a first thought one might be tempted to <strong>host the web application on a separate server<\/strong> and have a mechanism where the Microcontroller registers itself to it to make it&#8217;s address known. After that the web application will control the microcontroller with the help of REST calls.<br \/>\n&#8211; A alternative pattern that is also very easy to implement is to just pretend that the Microcontroller is hosting the application: The cool thing is, that the content does not really need to be located on the Microcontroller itself. It could be on <strong>Github or just anywhere on the Internet<\/strong>. We just need to have a web server running on the ESP32 where the <strong>requests to index.html are tunnelled<\/strong> to the physical location: This way all local REST calls automatically end up at the Microcontroller and we just need to handle them there. In order to improve the performance we can even avoid the tunnel for all other content and just use a <strong>301 Moved Permanently<\/strong> return code. In the following chapters I will provide a small demo for this approach.<\/p>\n<h2>Vue.js<\/h2>\n<p><a href=\"https:\/\/vuejs.org\/\">Vue.js<\/a> is my favourite Progressive JavaScript Framework which is approachable, versatile and performant. A <strong>minimal Example Vue.js application<\/strong> is available on Github at <a href=\"https:\/\/pschatzmann.github.io\/esp32_vue_example\/vue-demo\/dist\/index.html\">https:\/\/pschatzmann.github.io\/esp32_vue_example\/vue-demo\/dist\/index.html<\/a><\/p>\n<h2>ESP32<\/h2>\n<p>I am using the Arduino IDE with the <a href=\"https:\/\/github.com\/me-no-dev\/ESPAsyncWebServer\">ESPAsyncWebServer<\/a> ESP32 Library for the Server part. Here is the basic logic:<\/p>\n<p>First we need to setup the Serial Interface and WIFI.<\/p>\n<pre><code>Serial.begin(115200);\n\/\/WiFi.mode(WIFI_STA);\nWiFi.begin(\"your SSID\", \"your Password\");\n\nSerial.print(\"Connecting\");\nwhile (WiFi.status() != WL_CONNECTED)\n{\ndelay(500);\nSerial.print(\".\");\n}\n}\n<\/code><\/pre>\n<p>We declare the server and path to the Vue.js index file (that has a size of 1458 bytes).<\/p>\n<pre><code>\/\/ Web Server &amp; Services\nAsyncWebServer server(80);\nString indexPath = \"\/esp32_vue_example\/vue-demo\/dist\/index.html\";\n<\/code><\/pre>\n<p>Then we add some rewrites to make sure that the requests are ending at the right path<\/p>\n<pre><code>server.rewrite( \"\/\", indexPath) ;\nserver.rewrite( \"\/index.html\", indexPath);\n<\/code><\/pre>\n<p>We need to tunnel the request to the index. In order to reduce the complexity of the sketch, I have implemented the small helper class ClientRequestTunnel which just wrapps the HTTPClient.h.<\/p>\n<pre><code>\/\/ tunnel the index.html request\nserver.on(indexPath, HTTP_GET, [&amp;](AsyncWebServerRequest *request){\nClientRequestTunnel tunnel;\nif (tunnel.open(\"https:\/\/pschatzmann.github.io\", request-&gt;url())) {\nString result = tunnel.getString();\nrequest-&gt;send(200, \"text\/html\", result);\n} else {\nrequest-&gt;send(tunnel.getHttpCode());\n}\n});\n<\/code><\/pre>\n<p>All other requests can be redirected and do not need to go thru the Microcontroller. This consists of the Javascript files, the CSS and the icons:<\/p>\n<pre><code>server.on(\"\/esp32_vue_example\/*\", HTTP_GET, [&amp;](AsyncWebServerRequest *request){\nString moved_url = \"https:\/\/pschatzmann.github.io\"+request-&gt;url();\nrequest-&gt;redirect(moved_url);\n});\n\n<\/code><\/pre>\n<p>We can add our application specific services that can be accessed in Vue with the help of Axios.<\/p>\n<pre><code>\/\/ Generic Services\nserver.on(\"\/service\/info\", HTTP_GET, [](AsyncWebServerRequest *request){\nAsyncResponseStream *response = request-&gt;beginResponseStream(\"application\/json\");\nStaticJsonDocument&lt;200&gt; doc;\ndoc[\"heap\"] = ESP.getFreeHeap();\ndoc[\"ssid\"] = WiFi.SSID();\nserializeJson(doc, *response);\nrequest-&gt;send(response);\n});\n\n<\/code><\/pre>\n<p>Finally we can just start the server:<\/p>\n<pre><code>\/\/ start server\nserver.begin();\n<\/code><\/pre>\n<p>The <a href=\"https:\/\/github.com\/pschatzmann\/esp32_vue_example\/blob\/master\/esp32_vue_example.ino\">complete Sketch can be found on Github<\/a>.<br \/>\nWhen we deploy the sketch we will get the following output:<\/p>\n<pre><code>09:31:23.382 -&gt; [D][ESPAsyncTunnel.cpp:8] ClientRequestTunnel(): Constructor!\n09:31:23.483 -&gt; [D][WiFiGeneric.cpp:337] _eventCallback(): Event: 0 - WIFI_READY\n09:31:23.483 -&gt; [D][WiFiGeneric.cpp:337] _eventCallback(): Event: 2 - STA_START\n09:31:23.483 -&gt; Connecting[D][WiFiGeneric.cpp:337] _eventCallback(): Event: 4 - STA_CONNECTED\n09:31:23.656 -&gt; [D][WiFiGeneric.cpp:337] _eventCallback(): Event: 7 - STA_GOT_IP\n09:31:23.656 -&gt; [D][WiFiGeneric.cpp:381] _eventCallback(): STA IP: 192.168.1.43, MASK: 255.255.255.0, GW: 192.168.1.1\n09:31:24.001 -&gt; .\n09:31:24.001 -&gt; You can connect to 192.168.1.43\n<\/code><\/pre>\n<p>Now we can launch the application on the indicated address:<br \/>\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1-300x170.png\" alt=\"\" width=\"724\" height=\"410\" class=\"alignnone wp-image-1349\" srcset=\"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1-300x170.png 300w, https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1-768x436.png 768w, https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1.png 868w\" sizes=\"auto, (max-width: 724px) 100vw, 724px\" \/><\/p>\n<h2>Summary<\/h2>\n<p>The described solution approach is very easy to implement, very memory efficient and provides the major advantage that changes to the web GUI can be deployed w\/o any impact to the Microcontroller.<\/p>\n<p>The <a href=\"https:\/\/github.com\/pschatzmann\/esp32_vue_example\">complete source code for this demo project which contains the Vue and Arduino code can be found on Github.<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>The ESP32 can provide the functionality of a Webserver. There are plenty of examples where this functionality is used to provide a GUI to control the Microcontroller or to provide information from it. What all have in common: they is very basic and often plain ugly. Therefore the question is, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1349,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"categories":[20,5],"tags":[],"class_list":["post-1323","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-arduino","category-infrastructure"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32) - Phil Schatzmann<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32) - Phil Schatzmann\" \/>\n<meta property=\"og:description\" content=\"The ESP32 can provide the functionality of a Webserver. There are plenty of examples where this functionality is used to provide a GUI to control the Microcontroller or to provide information from it. What all have in common: they is very basic and often plain ugly. Therefore the question is, [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/\" \/>\n<meta property=\"og:site_name\" content=\"Phil Schatzmann\" \/>\n<meta property=\"article:published_time\" content=\"2020-04-08T08:04:07+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-11-21T21:22:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"868\" \/>\n\t<meta property=\"og:image:height\" content=\"493\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"pschatzmann\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"pschatzmann\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/\"},\"author\":{\"name\":\"pschatzmann\",\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/#\\\/schema\\\/person\\\/73a53638a4e34e8373405fd737dac9b1\"},\"headline\":\"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32)\",\"datePublished\":\"2020-04-08T08:04:07+00:00\",\"dateModified\":\"2020-11-21T21:22:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/\"},\"wordCount\":558,\"commentCount\":3,\"publisher\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/#\\\/schema\\\/person\\\/73a53638a4e34e8373405fd737dac9b1\"},\"image\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2020\\\/04\\\/Screen-Shot-2020-04-09-at-08.45.07-1.png\",\"articleSection\":[\"Arduino\",\"Infrastructure\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/\",\"url\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/\",\"name\":\"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32) - Phil Schatzmann\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2020\\\/04\\\/Screen-Shot-2020-04-09-at-08.45.07-1.png\",\"datePublished\":\"2020-04-08T08:04:07+00:00\",\"dateModified\":\"2020-11-21T21:22:45+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2020\\\/04\\\/Screen-Shot-2020-04-09-at-08.45.07-1.png\",\"contentUrl\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2020\\\/04\\\/Screen-Shot-2020-04-09-at-08.45.07-1.png\",\"width\":868,\"height\":493},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/2020\\\/04\\\/08\\\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/#website\",\"url\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/\",\"name\":\"Phil Schatzmann Consulting\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/#\\\/schema\\\/person\\\/73a53638a4e34e8373405fd737dac9b1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/home\\\/#\\\/schema\\\/person\\\/73a53638a4e34e8373405fd737dac9b1\",\"name\":\"pschatzmann\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2022\\\/08\\\/pschatzmann.png\",\"url\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2022\\\/08\\\/pschatzmann.png\",\"contentUrl\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2022\\\/08\\\/pschatzmann.png\",\"width\":305,\"height\":305,\"caption\":\"pschatzmann\"},\"logo\":{\"@id\":\"https:\\\/\\\/www.pschatzmann.ch\\\/wp-content\\\/uploads\\\/2022\\\/08\\\/pschatzmann.png\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32) - Phil Schatzmann","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/","og_locale":"en_US","og_type":"article","og_title":"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32) - Phil Schatzmann","og_description":"The ESP32 can provide the functionality of a Webserver. There are plenty of examples where this functionality is used to provide a GUI to control the Microcontroller or to provide information from it. What all have in common: they is very basic and often plain ugly. Therefore the question is, [&hellip;]","og_url":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/","og_site_name":"Phil Schatzmann","article_published_time":"2020-04-08T08:04:07+00:00","article_modified_time":"2020-11-21T21:22:45+00:00","og_image":[{"width":868,"height":493,"url":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1.png","type":"image\/png"}],"author":"pschatzmann","twitter_card":"summary_large_image","twitter_misc":{"Written by":"pschatzmann","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#article","isPartOf":{"@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/"},"author":{"name":"pschatzmann","@id":"https:\/\/www.pschatzmann.ch\/home\/#\/schema\/person\/73a53638a4e34e8373405fd737dac9b1"},"headline":"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32)","datePublished":"2020-04-08T08:04:07+00:00","dateModified":"2020-11-21T21:22:45+00:00","mainEntityOfPage":{"@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/"},"wordCount":558,"commentCount":3,"publisher":{"@id":"https:\/\/www.pschatzmann.ch\/home\/#\/schema\/person\/73a53638a4e34e8373405fd737dac9b1"},"image":{"@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#primaryimage"},"thumbnailUrl":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1.png","articleSection":["Arduino","Infrastructure"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/","url":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/","name":"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32) - Phil Schatzmann","isPartOf":{"@id":"https:\/\/www.pschatzmann.ch\/home\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#primaryimage"},"image":{"@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#primaryimage"},"thumbnailUrl":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1.png","datePublished":"2020-04-08T08:04:07+00:00","dateModified":"2020-11-21T21:22:45+00:00","breadcrumb":{"@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#primaryimage","url":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1.png","contentUrl":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2020\/04\/Screen-Shot-2020-04-09-at-08.45.07-1.png","width":868,"height":493},{"@type":"BreadcrumbList","@id":"https:\/\/www.pschatzmann.ch\/home\/2020\/04\/08\/progressive-javascript-frameworks-with-microcontrollers-vue-js-on-esp32\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.pschatzmann.ch\/home\/"},{"@type":"ListItem","position":2,"name":"Progressive JavaScript Frameworks with Microcontrollers (Vue.js on ESP32)"}]},{"@type":"WebSite","@id":"https:\/\/www.pschatzmann.ch\/home\/#website","url":"https:\/\/www.pschatzmann.ch\/home\/","name":"Phil Schatzmann Consulting","description":"","publisher":{"@id":"https:\/\/www.pschatzmann.ch\/home\/#\/schema\/person\/73a53638a4e34e8373405fd737dac9b1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.pschatzmann.ch\/home\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/www.pschatzmann.ch\/home\/#\/schema\/person\/73a53638a4e34e8373405fd737dac9b1","name":"pschatzmann","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2022\/08\/pschatzmann.png","url":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2022\/08\/pschatzmann.png","contentUrl":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2022\/08\/pschatzmann.png","width":305,"height":305,"caption":"pschatzmann"},"logo":{"@id":"https:\/\/www.pschatzmann.ch\/wp-content\/uploads\/2022\/08\/pschatzmann.png"}}]}},"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/posts\/1323","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/comments?post=1323"}],"version-history":[{"count":26,"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/posts\/1323\/revisions"}],"predecessor-version":[{"id":1352,"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/posts\/1323\/revisions\/1352"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/media\/1349"}],"wp:attachment":[{"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/media?parent=1323"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/categories?post=1323"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.pschatzmann.ch\/home\/wp-json\/wp\/v2\/tags?post=1323"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}