JavaScript Tutorials

  • By
    JavaScript waitForever

    Writing mochitests for new features in DevTools can be difficult and time-consuming.  There are so many elements interacting in an async manner that I oftentimes find myself using the debugger to debug the debugger!  In the case where it's unclear what interaction isn't working properly, I...

  • By
    Get Viewport Lines and Columns in CodeMirror

    CodeMirror is an amazing utility for presenting code in a browser environment.  Syntax highlighting, widgets, and a number of advanced functions make it a unique, useful tool.  When using CodeMirror inside the Firefox DevTools debugger, I found that adding hundreds of column breakpoint widgets to very...

  • By
    Object.fromEntries

    The Object object has been buffed with useful methods over the past few years.  Object.keys, Object.values, Object.freeze, and Object.assign all address frequently desired functionality.  One of the new Object methods is fromEntries, which accepts a Map or map-like array nesting and converts it to a useful object literal! Convert Map...

  • By
    How to Get and Set CSS Variable Values with JavaScript

    CSS variables are a very welcome addition to the language, despite them being incredibly basic.  Sure we could use SASS or stylus but languages should never count on developers relying on frameworks and toolkits to accomplish what we know we need.  And just like every other...

  • By
    Aliases with JavaScript Destructuring

    Destructuring in JavaScript has totally changed the way JavaScript is written these days;  code is more concise to write but but, from a visual standpoint, the syntax of the language has changed so much.  Any good developer knows, however, that change is the constant we live...

  • By
    Object.freeze: Immutable Objects

    One of my favorite part of JavaScript has always been mutability of objects.  I loved that MooTools and likewise frameworks could modify native prototypes to enhance them with functionality we knew the language need; in fact, I credit MooTools with pushing the web forward. There are cases...

  • By
    Array and Boolean

    One of the annoyances of old-school JavaScript was side effects; then Array.prototype got methods like filter, map, and forEach so we didn't need to burn variables before looping over values.  I can't explain how happy I am that the JavaScript language continues to evolve. Every once in a...

  • 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...