Thanks to this I've learnt about poi, yarn, the Fira Code font...
Show HN: Generate high-res images of code samples with Chrome Headless
81–90 of 92 posts
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#82Vim can do this 1. Open your script/code in vim editor 2. Enable syntax & set the required color scheme :syntax on :colorscheme darkblue 3. Print the file in PS file format :hardcopy >/tmp/filename.ps 4. Convert the PS file to PDF format $ ps2pdf /tmp/filename.ps 5. Now you can open filename.pdf
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#83What's wrong with pygments? I've been using it to get highlighted code as latex, html, whatever, since forever. I'm all for reinventing deficient wheels, but is there anything wrong with this? pygmentize -f png -l python -o test.png test.py Spinning up a browser for it seems like an odd choice. At least the author acknowledges that.
The interesting bit here would be to tie pygmentize into git. I want to be able to generate all the code samples for a deck in one go even as I make changes to the underlying files. At some point this breaks down but managing line numbers for simple changes shouldn't be required.
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#84This kind of projects are always interesting, although not for the problem they try to solve (I ain't downloading >500mb of deps just to take a screenshot of code) but for discovering what are the trendiest technologies right now. Thanks to this I've learnt about poi, yarn, the Fira Code font...
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#85An over engineered solution for what is super easy with Powerpoint and Notepad++.
* Insert in Text-Editor or IDE with Syntax highlighting * Take a screengrab
I mean it's still nice in terms of being able to script the generation if you have code that updates frequently and you want to keep the pictures current.
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#86Earlier quoted context omitted.
Thanks! I built this for Keynote presentations specifically. I wanted to be able to write code samples as snippet files, then generate a batch of images I can drop into my presentations. If you're posting code on a website, you're right – you should prefer and prism.js or highlight.js :)
I like the idea too, but :) would be Chrome Headless capable of producing SVG somehow? Aside usability I think about indexability/SEO aspect of the material. SVG with texts would be excellent for on-line presentations without lecturer, PDFs, books and maybe even partially editable.
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#87Seems to want to use Fira Code for some reason. I'd expect it to let the user choose which font should be used but, if not, at least don't require one with those ridiculous ligatures.
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#88I like how people come up with new uses cases for headless Chrome. But for his use case ('presentation') there are tons of presentation libs/franeworks in HTML/JS/CSS which support code embeddings with syntax highlighting. Same quality but much easier workflow since code stays editable.
Re: Show HN: Generate high-res images of code samples with Chrome Headless
#89Interesting idea! I'm not sure about the implementation though. I mean couldn't you just skip the whole Poi/live-reloading steps and just output a html file with some and tags? Why bother with the live-reloading/poi complexity?