Scraping Recipes on the Web – Now with Display and Print

A few weeks back I wrote up the process of building an API that looks for JSON-LD on a web page containing recipe information, parses it, and returns it as pure data. You can (and should before continuing on) find that post here: Scraping Recipes Using Node.js, Pipedream, and JSON-LD. When I first shared this, someone (I forget your name, but thank you!) asked the natural follow-up question – can we then render this to HTML or PDF? The answer is, of course, I just had to stop being lazy and build a proper web app. I fired up Glitch and created the following little demo. It isn’t the prettiest demo, but it gets the job done – converting a recipe site that’s 90% adds/commentary... more →
Posted in: JavaScript

JavaScript print Events

Media queries provide a great way to programmatically change behavior depending on viewing state. We can target styles to device, pixel ratio, screen size, and even print. That said, it’s also nice to have JavaScript events that also allow us to change behavior. Did you know you’re provided events both before and after printing? I’ve always used @media print in stylesheets to control print display, but JavaScript provides beforeprint and afterprint events: function toggleImages(hide = false) { document.querySelectorAll('img').forEach(img ={ img.style.display = hide ? 'none' : ''; }); } // Hide images to save toner/ink during printing window.addEventListener('beforeprint',... more →
Posted in: JavaScript