Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Supper Club × JavaScript on Hardware, Micro Controllers, ESP32 with Nick Hehr

Syntax - Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

<p class="has-line-data" data-line-start="0" data-line-end="1">In this supper club episode of Syntax, Wes and Scott talk with Nick Hehr about the fun ways to get started with micro controllers, writing JavaScript for hardware, and ideas for projects to build involving hardware and software.</p> <h2 class="code-line" data-line-start="2" data-line-end="3"><a id= "Show_Notes_2"></a>Show Notes</h2> <ul> <li class="has-line-data" data-line-start="4" data-line-end="5"> <strong><a href="#t=00:36">00:36</a></strong> Welcome to Syntax</li> <li class="has-line-data" data-line-start="5" data-line-end="6"> <strong><a href="#t=01:04">01:04</a></strong> Introducing Nick Hehr</li> <li class="has-line-data" data-line-start="6" data-line-end="7"> <a href="https://twitter.com/hipsterbrown?lang=en">Nick Hehr (@hipsterbrown)</a></li> <li class="has-line-data" data-line-start="7" data-line-end="8"> <a href="https://toot.cafe/@hipsterbrown">HipsterBrown (@hipsterbrown@toot.cafe) - Toot Café</a></li> <li class="has-line-data" data-line-start="8" data-line-end="9"> <a href="https://www.hipsterbrown.com/">HipsterBrown</a></li> <li class="has-line-data" data-line-start="9" data-line-end="10"> <a href="https://github.com/HipsterBrown">HipsterBrown (Nick Hehr)</a></li> <li class="has-line-data" data-line-start="10" data-line-end="11"> <a href="https://codepen.io/HipsterBrown/">Nick Hehr on CodePen</a></li> <li class="has-line-data" data-line-start="11" data-line-end="12"> <strong><a href="#t=03:58">03:58</a></strong> Running JavaScript on microcontrollers</li> <li class="has-line-data" data-line-start="12" data-line-end="13"> <strong><a href="#t=06:20">06:20</a></strong> What was your first project that got you into this?</li> <li class="has-line-data" data-line-start="13" data-line-end="14"> <strong><a href="#t=12:12">12:12</a></strong> Is the ESP32 the most popular controller?</li> <li class="has-line-data" data-line-start="14" data-line-end="15"> <strong><a href="#t=14:12">14:12</a></strong> Where do you buy hardware?</li> <li class="has-line-data" data-line-start="15" data-line-end="16"> <a href="https://www.arduino.cc/">Arduino - Home</a></li> <li class="has-line-data" data-line-start="16" data-line-end="17"> <a href="https://www.adafruit.com/">Adafruit Industries, Unique & fun DIY electronics and kits</a></li> <li class="has-line-data" data-line-start="17" data-line-end="18"> <a href="https://www.aliexpress.com/">AliExpress - Online Shopping for Popular Electronics, Fashion, Home & Garden, Toys & Sports, Automobiles and More products - AliExpress</a></li> <li class="has-line-data" data-line-start="18" data-line-end="19"> <a href="https://www.sparkfun.com/">SparkFun Electronics</a></li> <li class="has-line-data" data-line-start="19" data-line-end="20"> <a href="https://xs-dev.js.org/en/introduction/">Introduction ? xs-dev Documentation</a></li> <li class="has-line-data" data-line-start="20" data-line-end="21"> <a href="https://robo-wizard.js.org/">Welcome to Robo Wizard | Robo Wizard</a></li> <li class="has-line-data" data-line-start="21" data-line-end="22"> <strong><a href="#t=16:52">16:52</a></strong> What are people building with boards?</li> <li class="has-line-data" data-line-start="22" data-line-end="23"> <strong><a href="#t=18:30">18:30</a></strong> What does the JavaScript look like?</li> <li class="has-line-data" data-line-start="23" data-line-end="24"> <strong><a href="#t=22:16">22:16</a></strong> Can you make a Fetch request?</li> <li class="has-line-data" data-line-start="24" data-line-end="25"> <strong><a href="#t=25:45">25:45</a></strong> What about Arduino?</li> <li class="has-line-data" data-line-start="25" data-line-end="26"> <strong><a href="#t=31:54">31:54</a></strong> What’s a good starter project?</li> <li class="has-line-data" data-line-start="26" data-line-end="27"> <a href="https://johnny-five.io/">Johnny-Five: The JavaScript Robotics & IoT Platform</a></li> <li class="has-line-data" data-line-start="27" data-line-end="28"> <a href= "https://github.com/meganetaaan/stack-chan/tree/dev/v1.0">meganetaaan/stack-chan: A JavaScript-driven M5Stack-embedded super-kawaii robot.</a></li> <li class="has-line-data" data-line-start="28" data-line-end="29"> <a href= "https://www.ecma-international.org/technical-committees/tc53/">TC53 - Ecma International</a></li> <li class="has-line-data" data-line-start="29" data-line-end="30"> <a href="https://github.com/dtex/j5e">dtex/j5e: Framework for embedded devices using ECMA-419, the ECMAScript® embedded systems API specification, based on Johnny-Five’s API</a></li> <li class="has-line-data" data-line-start="30" data-line-end="31"> <a href= "https://github.com/HipsterBrown/on-air-light">HipsterBrown/on-air-light: An offline-first IoT on-air light for video meetings, using ESP32 & JS</a></li> <li class="has-line-data" data-line-start="31" data-line-end="32"> <a href="https://esphome.io/">ESPHome — ESPHome</a></li> <li class="has-line-data" data-line-start="32" data-line-end="33"> <a href= "https://thekidshouldseethis.com/post/be-the-video-game-with-augmented-climbing"> Being in the video game with Augmented Climbing | The Kid Should See This</a></li> <li class="has-line-data" data-line-start="33" data-line-end="34"> <strong><a href="#t=36:03">36:03</a></strong> Emulation and debugging</li> <li class="has-line-data" data-line-start="34" data-line-end="35"> <strong><a href="#t=39:13">39:13</a></strong> What else have you made?</li> <li class="has-line-data" data-line-start="35" data-line-end="36"> <strong><a href="#t=44:31">44:31</a></strong> ESP Home</li> <li class="has-line-data" data-line-start="36" data-line-end="37"> <strong><a href="#t=54:35">54:35</a></strong> SIIIIICK ××× PIIIICKS ×××</li> <li class="has-line-data" data-line-start="37" data-line-end="39"> <strong><a href="#t=00:32">00:32</a></strong> Shameless Plugs</li> </ul> <h2 class="code-line" data-line-start="39" data-line-end="40"> <a id="_SIIIIICK__PIIIICKS__39"></a>××× SIIIIICK ××× PIIIICKS ×××</h2> <ul> <li class="has-line-data" data-line-start="41" data-line-end="42"> <a href= "https://fellowproducts.com/products/the-opus-intro-kit?variant=41516160385124"> The Opus Intro Kit – Fellow</a></li> <li class="has-line-data" data-line-start="42" data-line-end="43"> <a href="https://github.com/jdxcode/rtx">jdxcode/rtx: Runtime Executor (asdf rust clone)</a></li> <li class="has-line-data" data-line-start="43" data-line-end="45"> <a href= "https://www.amazon.ca/dp/0137909101?crid=2QRJ0XCK7OHGB&keywords=Code:+The+Hidden+Language+of+Computer+Hardware+and+Software&sprefix=code+the+hidden+language+of+computer+hardware+and+software+,aps,108&language=en_US&sr=8-1&linkCode=gs2&linkId=ea6a456d08c423866beeb49df1eae111&tag=isi777-20"> Code: The Hidden Language of Computer Hardware and Software: Petzold, Charles: 9780137909100: Books - Amazon.ca</a></li> </ul> <h2 class="code-line" data-line-start="45" data-line-end="46"> <a id="Shameless_Plugs_45"></a>Shameless Plugs</h2> <ul> <li class="has-line-data" data-line-start="47" data-line-end="49"> <a href="https://xs-dev.js.org/en/introduction/">Introduction ? xs-dev Documentation</a></li> </ul> <h2 class="code-line" data-line-start="49" data-line-end="50"> <a id="Tweet_us_your_tasty_treats_49"></a>Tweet us your tasty treats</h2> <ul> <li class="has-line-data" data-line-start="51" data-line-end="52"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="52" data-line-end="53"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="53" data-line-end="54"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="54" data-line-end="55"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="55" data-line-end="56"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="56" data-line-end="57"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="57" data-line-end="58"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> <li class="has-line-data" data-line-start="58" data-line-end="59"> <a href="https://bsky.app/profile/wesbos.com">Wes Bos on Bluesky</a></li> <li class="has-line-data" data-line-start="59" data-line-end="60"> <a href="https://bsky.app/profile/tolin.ski">Scott on Bluesky</a></li> <li class="has-line-data" data-line-start="60" data-line-end="61"> <a href="https://bsky.app/profile/syntax.fm">Syntax on Bluesky</a></li> </ul>

In this supper club episode of Syntax, Wes and Scott talk with Nick Hehr about the fun ways to get started with micro controllers, writing JavaScript for hardware, and ideas for projects to build involving hardware and software.
 Show Notes  00:36 Welcome to Syntax
 01:04 Introducing Nick Hehr
 Nick Hehr (@hipsterbrown)

 HipsterBrown (@hipsterbrown@toot.cafe) - Toot Café

 HipsterBrown

 HipsterBrown (Nick Hehr)

 Nick Hehr on CodePen

 03:58 Running JavaScript on microcontrollers
 06:20 What was your first project that got you into this?
 12:12 Is the ESP32 the most popular controller?
 14:12 Where do you buy hardware?
 Arduino - Home

 Adafruit Industries, Unique & fun DIY electronics and kits

 AliExpress - Online Shopping for Popular Electronics, Fashion, Home & Garden, Toys & Sports, Automobiles and More products - AliExpress

 SparkFun Electronics

 Introduction 🚀 xs-dev Documentation

 Welcome to Robo Wizard | Robo Wizard

 16:52 What are people building with boards?
 18:30 What does the JavaScript look like?
 22:16 Can you make a Fetch request?
 25:45 What about Arduino?
 31:54 What’s a good starter project?
 Johnny-Five: The JavaScript Robotics & IoT Platform

 meganetaaan/stack-chan: A JavaScript-driven M5Stack-embedded super-kawaii robot.

 TC53 - Ecma International

 dtex/j5e: Framework for embedded devices using ECMA-419, the ECMAScript® embedded systems API specification, based on Johnny-Five’s API

 HipsterBrown/on-air-light: An offline-first IoT on-air light for video meetings, using ESP32 & JS

 ESPHome — ESPHome

  Being in the video game with Augmented Climbing | The Kid Should See This

 36:03 Emulation and debugging
 39:13 What else have you made?
 44:31 ESP Home
 54:35 SIIIIICK ××× PIIIICKS ×××
 00:32 Shameless Plugs
  ××× SIIIIICK ××× PIIIICKS ×××  The Opus Intro Kit – Fellow

 jdxcode/rtx: Runtime Executor (asdf rust clone)

  Code: The Hidden Language of Computer Hardware and Software: Petzold, Charles: 9780137909100: Books - Amazon.ca

  Shameless Plugs  Introduction 🚀 xs-dev Documentation

  Tweet us your tasty treats  Scott’s Instagram

 LevelUpTutorials Instagram

 Wes’ Instagram

 Wes’ Twitter

 Wes’ Facebook

 Scott’s Twitter

 Make sure to include @SyntaxFM in your tweets
 Wes Bos on Bluesky

 Scott on Bluesky

 Syntax on Bluesky

Aplikace Youradio Talk

Supper Club × JavaScript on Hardware, Micro Controllers, ESP32 with Nick Hehr

Poslechněte si podcast