← Index
March 2021 · Code · For: Myself

Styled Printer

→ NodeJS scripts to print styled layouts on Adafruit/Sparkfun and other thermal printers. View Code on Github

printer icon by thermal printer.
svg support

Motivation

The idea was simple: People should be able to send a message to a remote thermal printer hooked up to a raspberrypi. Since the built in layout capabilities of the thermal printer and its library are really limited, I wanted to enable things like custom Fonts, proper typography, svgs and more. The Input should be located on a react-app with a live chat displaying all sent messages, while the server should archive sent messages in a database.

Features

🎨 Custom Layouts – Go beyond default styling parameters

⚡️ React – Send from anywhere via react-app with a live-feed

🐘 Postgres – Connect to database and archive prints

Frontend and Server

A website provides an input mask and a live feed of all printed messages. The live feed is enabled via a websocket cross-device in real time. A server, for example hosted on Heroku, handles the communication with the clients (printers as well as the web frontend on numerous devices) and stores all received messages in a Postgres database. When a new message arrives on the server, it is sent to the printer but also to all other connected frontends. Thus everyone has an overview of all printed messages.

typographic layout by thermal printer
custom fonts and what not

Printer

The printer listens to the websocket and calls a headless browser when a new message arrives which receives the data via query parameters in the url. This data is then inserted into a styled html page which is then screenshotted with pupeteer. The resulting png image can be printed via the firmware of the thermal printer.

animation of various layouts
various layouts using styled-printer code

Credits

This Project had its origins at the development of owe.zone. Original Idea & huge amount of help by Timo Lins. Demo Picture features Faune Typeface by Alice Savoie / Cnap.