Augmented Reality using AFrame: Tips & Tricks

AFrame is a very cool javascript library which allows you to create Virtual Reality environments completely within the browser. Aframe also combines with AR.js to allow you to create Augmented Reality environments through the use of "markers" or "anchors". Anchors are very similar to simple QR codes which allow AR.js to project shapes onto the … Continue reading Augmented Reality using AFrame: Tips & Tricks

A JavaScript reverse CSS selector

In plain Javascript, you can get a reference to a particular HTML element by using the querySelector method. For example: document.querySelector('div') Will give you a reference to the first "div" that's encountered in the page. Give it a try in DevTools Sample querySelector What if we want to do the reverse? That is, given an … Continue reading A JavaScript reverse CSS selector

Living without React Router

How do you handle the scenario when a user taps the "back button" in your ReactJS app? In a plain vanilla ReactJS app you'll end up with the user navigating off your app since it's a SPA. Most devs would tell you to use React-Router. What if you can't, or - how does React-Router work? … Continue reading Living without React Router

Adding tile caching to maps in React-Leaflet

While writing a toy project that heavily relies on maps, I chose Leaflet as the map rendering library. From their site: Leaflet is the leading open-source JavaScript library for mobile-friendly interactive maps. Weighing just about 38 KB of JS, it has all the mapping features most developers ever need. The ease of use and ability to use different tile … Continue reading Adding tile caching to maps in React-Leaflet

Embedding Bokeh into a ReactJS app using BokehJS

This project highlights how to use BokehJS to (very) easily include Bokeh visualizations in an HTML webpage. The project uses the following tech: Bootstrapped with Create React App. Bokeh is an excellent python vizualization library that is quite popular among data scientists. Bokeh Homepage Flask is a python webserver microframework that allows you to quickly … Continue reading Embedding Bokeh into a ReactJS app using BokehJS

Exploring the WebAuthn API; a bare-bones JS app

I had no idea the WebAuthn API even existed until I came across this article by @herrjemand. In that article, the author used WebAuthn to automatically generate and save passwords in the Chrome credential manager. What more can this browser API do? How would you use it? What is WebAuthn - and why the buzz? We know passwords are a necessary evil. Credential managers are a hassle to setup and use, passwords are re-used across sites and applications - and we often choose weak or easily-guessed passwords. WebAuthn is oft touted as a "password killer". We've seen … Continue reading Exploring the WebAuthn API; a bare-bones JS app

Inspired by Gatsby.js : Rolling your own GraphQL powered WordPress API

Gatsby.js has been making the rounds in the Twitterverse and it's easy to see why. By cleverly combining various opensource projects they've made it easy to build web applications which are "static" in that the code can be hosted on any CDN, and it's the client (web-browser or mobile app) which does the work of … Continue reading Inspired by Gatsby.js : Rolling your own GraphQL powered WordPress API