Guest Blogger Tutorials
Adding Search to Your Site with JavaScript
Static website generators like Gatsby and Jekyll are popular because they allow the creation of complex, templated pages that can be hosted anywhere. But the awesome simplicity of website generators is also limiting. Search is particularly hard. How do you allow users to search...
Chris Coyier’s Favorite CodePen Demos IV
Did you know you can triple-heart things on CodePen? We’ve had that little not-so-hidden feature forever. You can click that little heart button on any Pen (or Project, Collection, or Post) on CodePen to show the creator a little love, but you can click it again...
Using Slack Slash Commands to Send Data from Slack into Google Sheets
Since I work from home, most of my daily work interactions happen through Slack. It’s my equivalent to the water cooler. A place to hang out and discuss ideas with friends.I’m part of a book recommendations channel. People share books all the time, but they disappear...
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...
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...The Dark Side of Promises
Since the release of es6 many new features have found their way into NodeJS, but non had quite the same impact as promises. Promises have been developed for the browser before es6 was even a thing. There were several implementations that have been used like jQuery's...
5 Crucial Concepts for Learning d3.js and How to Understand Them
You may have already heard about d3.js, the dazzling JavaScript library that lets you create beautiful charts and graphics with just a few lines of code. You might have seen some of the fantastic examples of D3 in action, or you may have heard that...
Using Storybook with Nuxt
Nuxt.js has been a lot of fun to use in production web apps and side projects. It's simple, fast, and seems very in line with web standards when it comes to creating components, importing plugins, etc. Equally as exciting has been the rise of...
Better Debugging with Conditional Breakpoints
I love conditional breakpoints. Really! They're my favorite debugging tool. When I got started in web development, "debugging" for me meant creating a
<pre id='log'></pre>
and appending strings to its contents to act as a log. But once Firebug rolled around—and then when browsers started...Observing Intersection Observers
As developing for the web has matured and JavaScript engines have become faster, one area remains a significant bottleneck - rendering. It's because of this that so many of the recent development efforts have been focused around rendering, with virtual DOM being one of the more...