Creating a Dynamic Favicon with Cloudinary

/ / No Comments
Ok, chalk this up to something I may never actually use in production, but I was curious how well the browser would handle changing the favicon of a tab on the fly, and combining that with Cloudinary to dynamically modify the source. The inspiration for this was something simple – Google Calendar’s favicon is unique per day, so for example, right now I see this: As there is – at most – 31 days in a month – my assumption is that they simply generated all 31 at some point and in their code serving up the web page, they select the right one. To be honest, it’s subtle and I don’t always notice it, but it’s a nice effect. I decided to take a look... more →
Posted in: JavaScript Tagged with: , , ,

Executing Dynamic Code in a Reveal.js Presentation

/ / No Comments
Please take what follows with a Titanic-sized grain of salt and do your best not to do what I did, but despite that, I thought this little hack was interesting and I figured I’d share it anyway. I typically use Reveal.js for my presentations, especially when talking about the web platform, as it makes it easy to do slides and demos, all in my browser. Usually when I want to embed live code in a slide, I just use a CodePen embed. While this works well, sometimes it feels like overkill for real short code samples. I wondered if it would be possible to execute code directly in the slide itself such that I could show a one-liner in the slide, and then the result after. This is what I came up... more →
Posted in: JavaScript Tagged with: , , , ,

Setting Dynamic Objects Keys in JavaScript

/ / No Comments
It’s always a good day when you get pleasantly surprised by JavaScript, even more so when you find that it’s a feature that’s been around for a while (ES6, which according to Google was standardized in June of 2015). Earlier today I saw some syntax that didn’t look quite right to me. Here’s a simple example of it: let type = 'name';let person = { [type]:'Ray'} Specifically, the thing that surprised me was this portion: [type]:'Ray' If you console.log the code above, you get: { name: 'Ray' } And then it makes sense. This syntax allows you to set a dynamic key in an object literal, much like: person[type] = 'Ray'; Apparently, this has been around for nearly ten... more →
Posted in: JavaScript Tagged with: , , , ,