CategoryJavaScript

January 30, 2018 — One of the toughest challenges Harris Schneiderman came across is the reorderable drag-and-drop list. While a reorderable list is a somewhat commonly used widget with intuitive conventions for mouse users, it’s not clear how keyboard-only assistive technology users can perform this simple task. Dragon Drop seeks to fill this gap by providing means for all users to perform this somewhat common task. Due to the absence of supported ARIA attributes, Dragon Drop utilizes live regions to convey the information needed for all users to reorder a list. Read more…

January 24, 2018 — Rather than exploring features first, it is helpful to put them into context and to understand how they came to exist. In this series, Eric Baer wants to introduce you to GraphQL. By the end, you should understand what it is and also its origins, its drawbacks and the basics of how to work with it. Today, Eric will go over how and why we have arrived at GraphQL by looking at the lessons learned from the last 60 years of API development, from RPC to now. Read more…

January 22, 2018 — Intersection information is needed for many reasons, such as lazy loading of images. But there’s so much more. It’s time to get a better understanding and different perspectives on the Intersection Observer API. In this article, Denys Mishunov is going to go out of the scroll darkness and talk about the modern way of lazy-loading resources. Not just lazy-loading images, but loading any asset for that matter. And the technique he is going to talk about today is capable of much more than just lazy-loading assets. Ready? Read more…

January 18, 2018 — In part two of this two-part series, Brian Holt explains why large refactors are easy by using the Elm Compiler, how to handle side-effects, and how to work with JavaScript. He’ll work through large refactors by relying on the Elm compiler, and set up recurring events that interact with JavaScript to trigger drum samples. Elm has been the most invigorating language Brian has worked in lately. Using the Elm Architecture helps you focus on what matters to your users. Read more…

January 17, 2018 — Everything you need to know about REST APIs, from start to finish. How and why to use REST APIs, how to deal with headers, error messages and API versions. In this article, Zell Liew will show you everything you need to know about REST APIs to be able to read API documentations and use them effectively. In addition, you will also learn how to authenticate your requests with the -u option, and what HTTP statuses mean. Let’s get started! Read more…

January 15, 2018 — File selection inputs are difficult to style the way developers want to, so many simply hide it and create a button that opens the file selection dialog instead. Nowadays, though, there is an even fancier way of handling file selection: drag and drop. In this article, Joseph Zimmerman will be using “vanilla” ES2015+ JavaScript (no frameworks or libraries) to complete this project, and it is assumed you have a working knowledge of JavaScript in the browser. This example should be compatible with every evergreen browser plus IE 10 and 11. Read more…

January 11, 2018 — Writing in a new language requires time and practice. Front-end developer Brian Holt guides readers through building a drum sequencer in Elm. In part one of this two-part series, he’ll walk through the foundational concepts in Elm, i.e. getting started, using types, rendering views, and updating state. You will learn how to work with the Elm architecture in order to create simple applications. Read more…

January 9, 2018 — Why is Visual Studio Code (VS Code) so popular, and do we really need another text editor? In this article, we’ll take a look at how VS Code extends traditional text editor concepts and opens up entirely new avenues of productivity for developers. These are all the best things about VS Code that nobody ever bothered to tell you. Read more…

January 4, 2018 — The UI development became difficult in the last couple of years. That is because we pushed the state management to the browser. And managing state is what makes our job a challenge. If we do it properly, we will see how our application scales easily with no bugs. In this article, Krasimir Tsonev will see how to use the state machine concept for solving state management problems. Read more…

December 29, 2017 — Once web apps function like native apps, the design interactions would also change to address the use case — namely, the ubiquity of animations. As web developers, we need a good foundation to create animations that are both performant and maintainable, which is paramount to the native web app landscape. In this article Christopher Ng will show you how to go from After Effects to CSS transitions, animations and keyframes. Read more…