How to Get a Base64 Version of a File From Command Line
A while back I wrote an article on how to Convert Image to Data URI with JavaScript. It's a neat trick developers can use for any number of reasons. Instead of abusing canvas, however, why not simply get the base64 data from command line?
You can use base64 and pbcopy to convert a file to base64 and copy it to the clipboard:
# base64 gets data, pbcopy copies to clipboard
base64 -i logo.jpeg | pbcopy
Once you have the file data copied in base64 format, the URL format to use the data is:
# data:{mime-type};base64,{data}
data:image/jpeg;base64,/9j/4AAQSkZJRgAB......
While base64 data and data URIs do look cryptic, they're useful to avoid making requests to other files. I use them when creating presentations or when I can't count on a decent internet connection.
![Regular Expressions for the Rest of Us]()
Sooner or later you'll run across a regular expression. With their cryptic syntax, confusing documentation and massive learning curve, most developers settle for copying and pasting them from StackOverflow and hoping they work. But what if you could decode regular expressions and harness their power? In...
![Detect DOM Node Insertions with JavaScript and CSS Animations]()
I work with an awesome cast of developers at Mozilla, and one of them in Daniel Buchner. Daniel's shared with me an awesome strategy for detecting when nodes have been injected into a parent node without using the deprecated DOM Events API.
![PHP Woot Checker – Tech, Wine, and Shirt Woot]()
If you haven't heard of Woot.com, you've been living under a rock. For those who have been under the proverbial rock, here's the plot:
Every day, Woot sells one product.
Once the item is sold out, no more items are available for purchase.
You don't know how many...
![Redacted Font]()
Back when I created client websites, one of the many things that frustrated me was the initial design handoff. It would always go like this:
Work hard to incorporate client's ideas, dream up awesome design.
Create said design, using Lorem Ipsum text
Send initial design concept to the client...