Chapter 10. Web Frontends for Things

Screens and displays are useful ways to give a device user direction and feedback. Some embedded devices operate “headless,” meaning without an attached display, which reduces the complexity and power requirements. Others build displays into the device design. Internet-connected and embedded devices can compromise: the device itself can be headless, but it can provide a display (and sometimes interactivity) on another Internet-connected device, such as a phone or computer. In this chapter, we’ll discuss building displays and interactions with embedded devices through web browsers.

Web browsers render documents in HTML. Combined with JavaScript, HTML increasingly allows humans to interact with hardware remotely over a physical link or a network.

With the newer HTML5 standard, browsers also support new ways of rendering graphics and video. When HTML was first conceived in 1989, computers were dealing mainly with textual documents. The modern landscape has evolved to meet the ever-expanding variety of digital media. This chapter discusses some new concepts and special libraries to handle graphics with JavaScript.

For many programmers, the first steps into browser and graphical programming start with jQuery, a popular library that we will briefly review in this chapter. From there, separation between application state and rendering logic is discussed. This is commonly called the model-view-controller (MVC) pattern, and you will find some variations ...

Get Node.js for Embedded Systems now with the O’Reilly learning platform.

O’Reilly members experience live online training, plus books, videos, and digital content from nearly 200 publishers.