JavaScript Tutorials

  • By
    prefers-color-scheme: CSS Media Query

    One device and app feature I've come to appreciate is the ability to change between light and dark modes. If you've ever done late night coding or reading, you know how amazing a dark theme can be for preventing eye strain and the headaches that result.

  • By
    React indeterminate

    I've fallen in love with React.js and JSX over the years; state-based rendering and a logical workflow have made me see the light of this modern framework. That doesn't mean I don't sometimes get a bit frustrated that the "simple" things seem harder than they should...

  • By
    JavaScript Labels

    No matter how long you've been a JavaScript developer, there will always be language features that you didn't know about until you saw them in a fringe piece of code. Your reaction generally is a bit like:One of those features I see developers quizically trying...

  • By
    Background Sync with Service Workers

    Service workers have been having a moment. In March 2018, iOS Safari began including service workers -- so all major browsers at this point support offline options. And this is more important than ever -- 20% of adults in the United States are without Internet at...

  • By
    Nested Destructuring

    Destructuring in JavaScript can initially feel confusing but the truth is that destructuring can make your code a bit more logical and straight forward. Destructuring does look a bit more complex when you're looking for a property several objects deep, so let's have a look...

  • By
    Force Download with JavaScript

    Force download scripts have been an important part of internet usability for a long time.  I can attest to that by the number of times I've implemented this feature on the server side and the popularity of my PHP Force Download post, even to this...

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