Fun with JavaScript and Emoji

Today Wes Bos tweeted a few fun things one can do with JavaScript and Emoji: It’s possible to spread emoji sequences into their single parts: […’👨‍👩‍👧‍👦’] // [“👨”, “‍”, “👩”, “‍”, “👧”, “‍”, “👦”] Combining Emoji is also possible: [“👨”, “‍”, “👩”, “‍”, “👧”].reduce((prev, curr) => prev + curr) // “👨‍👩‍👧” And oh, you can …

Distributing your React Component as a Standalone Version

At work we’ve been building quite some stuff on top of React the past few months. We use Grunt (and more recently Webpack) to run browserify with the babelify transform to transpile our ES6 code into ES5. Earlier this week I came to the point where I wanted to distribute a built component as a …

Uploading files using AJAX directly to S3

Chris White, Laravel Developer: For most situations using S3 is a no brainer, but the majority of developers transfer their user’s uploads to S3 after they have received them on the server side. This doesn’t have to be the case, your user’s web browser can send the file directly to an S3 bucket. You don’t …

Prevent overscroll/bounce in iOS MobileSafari and Chrome (CSS only)

UPDATE 2017.12: For non-Safari browsers (e.g. Chrome, Firefox) you can use overscroll-behavior to solve exactly this. Simply apply overscroll-behavior-y: none; on html, body and be done with it. html, body { overscroll-behavior-y: none; } Safari however does not support it … UPDATE 2021.06: The workaround below no longer seems to work in recent iOS/MobileSafari versions …

JavaScript Unary + Operator

Today I learned: In JavaScript it is possible to use the + operator alone before a single element. This indicates a math operation and tries to convert the element to a number. If the conversion fails, it will evaluate to NaN. This is especially useful when one wants to convert a string to a number …

Setting up React for ES6 ES2015 with Webpack and Babel

This resource came in quite handy when setting up React in combination with ES6 ES2015, Webpack and Babel. Installing all the required dependencies: # Install Webpack npm install –save-dev webpack # Install the Babel Loader, for use with Webpack npm install –save-dev babel-loader # Install the es2015 and react presets, for use with Babel npm …

Getting the share count of a URL

At work I’m working on a project in which we need to track the share count of a URL. Below are my quick notes. In all examples I’m getting the share count of https://www.facebook.com/. Note that I’m using the jq notation to extract the actual result from the response. Just GET it Facebook Request: curl …

EV-Point MyEV – Start/stop charging your electric vehicle from your smartphone

Early September “EV-Point MyEV” got released in the App Store (UPDATE mid-October: And in the Play Store). Using the 3RDS moniker – the name of my company by which I freelance – I developed this application for EV-Point, a Belgian Mobile Service Provider that builds and operates a network of public chargepoints to charge your …

ionic/cordova emulate vs. Xcode 7

After the App Store automatically updated Xcode to version 7 (without me actually wanting this for now, but hey …) running ionic emulate ios -c -l would not do much anymore: The app would launch but get stuck at the loading screen No console.log() calls would be logged Fixing it manually To fix this, update …

ion-drawer-vertical – A vertical slide out panel (toggle panel) for Ionic

For a current Ionic project I’m working on I needed a vertical slide out panel (toggle panel) to store in some content that may be hidden by the user. As I couldn’t immediately find such a component in Ionic itself I decided to create one myself: ion-drawer-vertical (source available on GitHub). The result is a …