Load FontAwesome Fonts with Webpack 2

Posted by in Software

TL;DR:: Add the (s)css dependency to your main (s)css file and specify where to find the fonts too. Then use the proper loaders in your webpack.config.js file. The past few days I had trouble loading the font-awesome fonts with webpack. I tried quite a few solutions: Using the font-awesome-sass-loader Manual solution webpack + font-awesome test Looking at SO (How to configure font file output directory …) and so on… Nothing seemed to work propoerly. I either had the fonts ignored or got errors of files not found. Finally, I have…read more

Change Packages Paths in NodeJS

Posted by in Software, Tutorial

TL;DR: Edit %appdata%\npm\etc\npmrc and add prefix and cache entries to specify the locations where node puts packages. Every time I install a new framework/dev environment I have to look where they put files. Having a roaming profile is a pain and I need to make sure it doesn’t get too crowded. Otherwise, logging in takes 30+ minutes. The latest victim is NodeJS. This installs a lot of files for all packages in 2 directories (I found so far): Cache – a cache of installed modules Global – a place where…read more

Debug Javascript – Some Methods

Posted by in Software

These days I’m trying to tweak a 3rd-party framework and I’m missing stuff sometimes (e.g. injected data). Below are some methods I’ve found useful when debugging the script. console.log – print all things Object inspection – see your object’s content HTH, A little experiment: If you find this post and ad below useful, please check the ad out :-)

Debug Javascript – Object Inspection

Posted by in Software

Many times, you have objects where you may or may not know their content. If you’re running in the browser, life is easy as you can pause the code and inspect the object. at command line is a bit more annoying. In this case, at least for the first run, you can execute something like:

where obj is your mystery object. HTH, A little experiment: If you find this post and ad below useful, please check the ad out :-)

Debug Javascript – console.log

Posted by in Software

This is the holy grail of debugging for me. It’s old school, simple and effective. It works both in browser and from command line. My code looks like:

You can make it fancier with debug levels (in if() statements or with your tiny library). I however tend to add/remove them progressively as I resolve the issues. HTH, A little experiment: If you find this post and ad below useful, please check the ad out :-)

Drawing QR-Code on Browser in Javascript

Posted by in Software

In my quest to make the pages of one site a bit more mobile-friendly, I’ve got the idea to provide a QR-Code for an unique identifier generated for users. This is part of a wizard and the end-product is: QR Code in JavaScript To reach this outcome, I’ve started by looking for a QR javascript snippet. There are lots, but two drew my attention: David Smith’s qrcode.js and Lars Jung’s qrcode jquery plugin I’ve finally settled on Lars Jung’s one, just because the info page looked a bit better, and…read more

Copy Text to Clipboard in HTML Page using JavaScript

Posted by in Software

I’ve got a problem on one of my sites: I have a unique identifier displayed on one page, which I need to make it easy to copy to clipboard. After looking online, I’ve found three approaches using only JS. Clipboard.js Clipboard.js is a new (September 2015) approach which uses only JS to copy the text transparently (using the Selection/execCommand APIs). The code is as simple as:

where trigger is a CSS selector. [Thanks Gabriel Gularte]. Popup approach This method opens a dialog box with a text. The code is…read more