Category: Web Development

Tips & Tricks in Web Development

How to load environment variables in Svelte

applications. In contrast to React, it does a lot of the heavy lifting in a compile step instead of in the browser. It’s very clever and comes with enormous advantages but can also have its pitfalls for developers used to the more popular frameworks. In case of the environment variables, one can’t just import dotenv wherever and assume it will work – a replace plugin of rollup (the bundler) has to be used instead. This tutorial uses yarn for a package manager and would work the same with npm.

Read More »

How to get an accurate position estimate from the Geolocation API in JavaScript

The Geolocation API has been introduced into modern browsers many years ago and hasn’t changed much since yet it still can waste many hours of your time if you don’t know how to work with it. There’s a lot of magic happening behind the scenes that isn’t properly explained in the documentation. Here’s a straightforward way to get an accurate estimate without you having to spend the 2 days I’ve spent figuring out why my location estimates look like out of a random number generator.

Read More »

The easiest way to extend or customize Create React App (v.3) service worker without ejecting

Create React App (version before 4.0.0) by default includes a hidden Service Worker that will do some background magic for you in order for your app to be recognized as a Progressive Web Application. But if there’s one pitfall of CRA, it’s definitely how closed the configuration is and how difficult it is to modify, extend, or customize it without ejecting (taking full control of the configuration) the application. Here, I discuss and present what I found to be the simplest way to extend the out-of-the-box service worker functionality.

Read More »