Apple Live Photos for JavaScript Developers

In a rather surprising move Apple has released a JavaScript library to play Live Photos on the web on NPM: Use the LivePhotosKit JS library to play Live Photos on your web pages. The JavaScript API presents the player in the form of a DOM element, much like an image or video tag, which can …

React VR – Build VR websites and interactive 360 experiences with React

React VR is a framework for the creation of VR applications that run in your web browser. It pairs modern APIs like WebGL and WebVR with the declarative power of React, producing experiences that can be consumed through a variety of devices. Leveraging web technologies and the existing React ecosystem, React VR aims to simplify …

Phishing with Unicode Domains

When visiting a domain name containing a Unicode character that visually resembles an ASCII character, your browser will transform the Unicode characters to Punycode in the address bar to prevent homograph attacks. For example: the Cyrillic а (codepoint U+0430) totally looks like the Latin a (codepoint U+0061). When visting brаm.us (with the Cyrillic а in …

Styling React Components with “Glamorous 💄”

Glamorous 💄 is a styled-components 💅 and jsxstyle inspired solution for styling ⚛ React Components. It allows you to do stuff like this: // Create a <Title> react component that renders an <h1> which is // centered, palevioletred and sized at 1.5em const Title = glamorous.h1({ fontSize: '1.5em', textAlign: 'center', color: 'palevioletred', }) // Create …

Tilt.js – A tiny parallax tilt effect for jQuery

A tiny requestAnimationFrame powered 60+fps lightweight parallax hover tilt effect for jQuery. Might come in handy for a quick project. Also love the fact that it’s highly customizable: maxTilt: 20, perspective: 1000, // Transform perspective, the lower the more extreme the tilt gets. easing: “cubic-bezier(.03,.98,.52,.99)”, // Easing on enter/exit. scale: 1, // 2 = 200%, …

AutoDraw: Fast Drawing for Everyone

After Quickdraw a few months ago – in which A.I. guesses what you are doodling – now comes AutoDraw from Google. AutoDraw is a new kind of drawing tool. It pairs machine learning with drawings from talented artists to help everyone create anything visual, fast. AutoDraw’s suggestion tool uses the same technology used in QuickDraw, …

Text Escaping and Unescaping in JavaScript with strutil

Today the package strutil came in handy, after receiving (*) this UTF-8 Quoted Printable text in my hands: =?UTF-8?Q?Test_=F0=9F=91=BB?= Thanks to strutil#unescapeFromMime() I was able to regain the original string: Test 👻 Upon further investigation of strutil it turns out that this package is really powerful as it can do a truckload of things when …

Copycat JavaScript Game

Fun little game in which you control more than one character at once in a level, all bound to the same controls. Using walls and other obstacles you can sync up the locations between characters in order for each character to reach its own target. The game itself is written in “vanillaJS”, sans external libraries, …

Getting ready for Symonfy 4.0

Fabien Potencier, founder and project lead of Symfony: Symfony 4.0 will be released at the end of November 2017. During the next few weeks, I will publish articles about my ideas and the main changes I want to implement for Symfony 4. So far 4 articles have been released by now, with more to follow: …