Close

Serial Connection over browser

A project log for Barnabas Robotics - Interactive Curriculum

Curriculum beyond worksheets

Andrew ThomasAndrew Thomas 06/05/2020 at 17:100 Comments

I recently was able to use the experimental features in chrome to make a serial connection to my Arduino Uno. The first thing I had to do was turn it on by going to `chrome://flags`  and enabling Experimental Web Platform features.  Next I had to write some code to talk to my device and fortunately there is an excellent tutorial at codelabs where you can work your way through a glitch example using a BBC micro:bit, a nifty little learning device. "But Coach Andrew,

---------- more ----------

I thought you said you wanted to communicate with an Arduino not a micro:bit?" Oh, I did but the fundamental part is using the browser to communicate with a connected device.

Browsers were designed to render text, specifically using the Hyper Text Markup Language [HTML] and what is great about browsers is that you can use them on many different devices with many different Operating Systems and expect pretty much the same experience. While presenting only images and text might be the primary focus of a browser it does have the capability to execute scripts and people have been doing all kinds of fascinating things with these scripts so glitch is going to help us learn what scripts are useful to get us going. 

After following along and putting the useful code in the proper javascript files I was able to understand what was essentially my paper, marker, scissors, and tape. I took most of the script.js file and added it to the other files in my project. This gave me access to connect/disconnect and read/write. Then I had to test it out. 

I just went crazy at first and tried to shove an entire hex file onto my board. Lights flickered and the console informed me that things were happening but somewhere on the other end I was not finishing the lap. Discouraged but not defeated I went to one of my coaches. Coach Ed. Coach Ed asked if I had attempted one of the tried and true first tests of many projects;  

Hello World

 On my way, with a excitement in my heart, this was something I was confident I could do. Now that we can can break down the steps into the simplest of pieces, we are ready to say hello from the browser

Discussions