Receipt Printer with JavaScript

Show Notes

00:00 Welcome to Syntax!
01:10 What is Hack Week?
01:41 The project.
02:40 Why a receipt printer?
03:55 How do these printers work?
05:20 Communicating with the printer.
07:24 ESC/POS Encoder.
08:42 Socket issues.
10:48 Back to socket issues.
12:18 Integrating with Sentry.
15:01 Printing images with Playwright.
16:17 Was it worth it?

------------------------------------------------------------------------------
Hit us up on Socials!

#webdevelopment #webdeveloper #javascript

[kimwelch]

I got a receipt printer 2 weeks before you released this! I was thinking of doing this same method with sending a generated image!
Thank you for the inspiration. The industry I am in (amusement attractions), needs creative receipts like this!
Now I have to get it to work over Bluetooth 😊

[MaikelvandeLisdonk]

I once build a cashregister prototype in the browser early 2000's... it also included a receipt printer interface.. but I used an activex control build in Delphi to communicate with the printer..😂😊

[twitchizle]

Just in time. I needed this for my new upcoming startup. Haha

[MikeSwatek]

Just bought a refurbished Epson receipt printer for a library app I built for my daughter!

[codeman-dev]

I'm half disappointed by the screenshot solution. Maybe that's the next step? Proposing an extended / advanced version of the ESC/POS that supports more graphical widgets?

I still think something that will let you use JSX for rendering directly to the printer would be awesome.

[ur]

3:14 wow, nice goal. a vending machine with js!

[SudevAmbadi]

I'm trying to build a admin web portal where they can issue a print to the thermal printers. Is there a library that we can use to connect to printer from web and then issue the print? Or does it mean we can't issue a print or connect to printer directly from the web browser? Would you be able to share the codebase that you had tried?

[dadofbytes]

You mention a seperate podcast on a barcode scanner. Which ep is that

[leonscub]

anybody let me know can i print directly from the chrome browser without showing the print dialog (popup window)

[muhammadtariq]

I got the following error when try to connect via webusb

SecurityError: Failed to execute 'open' on 'USBDevice': Access denied.

async connectToPrinter() {
try {
this.device = await navigator.usb.requestDevice({ filters: [{ vendorId: 1046 }] }); // Replace with your actual vendor ID
await this.device.open();
if (this.device.configuration === null) {
await
}
await
console.log('Printer connected');
} catch (error) {
console.error('Failed to connect to printer:', error);
}
}

[nickwoodward]

Would love to do a till/till drawer (you might call them cash registers?) would work great with your receipt machine!

[ronaldgrootjebbink]

So nice! I'm still looking for a solution to print labels from a label printer from a web application without the print dialog. Someone here who has experience with that?

[everyhandletaken]

😃 I want all new issue tickets printed out like this when they arrive.. for no valid reason, other than it is just cool!

[NitinVarmaManthena]

Can you share the printer you are using?

[aschmelyun]

Receipt printers, receipt printers for everyone!

[aldierygonzalez]

I love it, a mini fax machine for bug reports, i imagine some lots devs would kill for that to be their workflow instead of teams or slack 😂