JavaScript Tutorials

  • By
    React Emoji Picker

    When emojis first hit the web scene I rolled my eyes -- they seemed like a lame communication method for giggling kids.  After years more experience working remotely, managing open source communities, and communicating with people that may not get my sense of humor, I've realized...

  • By
    Replace Repeated Characters with JavaScript

    URLs can be tricky to work with because they can be more complicated than the traditional URL format you type in.  I was again reminded of this when I was parsing Webpack URLs when I saw this beauty: I parsed the URL with new URL("....") but saw that...

  • By
    Create gists from Command Line

    One of the best ways to gain contributors for your open source project is by providing a rough patch for the contributor to start from.  One of the best ways to ask for help is by providing what you have so far and letting a mentor...

  • By
    Get and Set Volume with JavaScript

    The <audio> and <video> tags provide a wealth more functionality than most people know. For instance, did you know that you could detect supported video formats and audio formats using a few JavaScript tricks?  It got me to thinking about the possibilities of detecting system volume...

  • By
    Array Destructuring

    Destructuring has become a major language feature in JavaScript, most prominently seen with imports, but also in function declarations and so on.  While object literals are the usual case for destructuring, remember that you can also destructure Arrays and Sets. Let's have a look at how...

  • By
    Create Custom Video Player Controls with CanJS

    In this guide, you will learn how to create a custom video player using the <video> element and CanJS. The custom video player will: Have custom play and pause buttons. Show the current time and duration of the video. Have a <input type="range"> slider that can adjust the position...

  • By
    Fix Flow Node Issue &#8220;property querySelector of unknown&#8221;

    Flow, the static type checker used in many React projects, feels like a gift and a curse at times; a gift in that it identifies weaknesses in your code, and a curse that sometimes you feel like you're needlessly adjusting your code to satisfy Flow. ...

  • By
    Convert HTML to Markdown

    One of my biggest mistakes with this blog was not finding a WordPress plugin that would allow me to write my posts with markdown; to this day I still need to write posts in "Visual" mode and then manually convert the post to HTML for "Text"...

  • By
    console.timeLog

    I work on a really complex debugger at Mozilla but, and don't tell my colleagues, I sometimes enjoy simply using console.log and other console commands to get some simple output.  I know, I know, but hey -- whatever gets the job done.  A few years ago I...

  • By
    Detect WebVR Support with JavaScript

    It's been two years since I was heavily involved with WebVR at Mozilla but, despite not contributing every day, I can see VR making leaps and bounds, from Firefox making an increased effort to Chrome pushing VR and Oculus and HTC (Vive) improving their offerings.  Native...