DOM changes can be frequent, and as a result, there are instances where your app might need to respond to a specific change to the DOM. Monitoring for changes to the DOM is sometimes needed in complex web apps and frameworks. By means of explanations along with interactive demos, Louis Lazaris will show you how you can use the MutationObserver API to make observing for DOM changes relatively easy.
Read more…
Currently, with WordPress supporting Markdown, the format has become even more widely used. In this article, Sameer Borate will show you how to use Node.js and the Express framework to create an API endpoint. The context in which we will be learning this is by building an application that converts Markdown syntax to HTML. Along the way, you will also add authentication to your API endpoint, and you will also find ways to test your application endpoint using Postman.
Read more…
Exploiting a security flaw is often about getting multiple small pieces to line up. Every bit of JavaScript you add to a site is a potential way in for a hacker. This is doubly true if that JavaScript is hosted by someone else, such as on a public CDN. Subresource Integrity is a browser feature you can use to make sure that the code being used is exactly what you intended. In this article, Drew McLellan will take a look at what SRI is, how it can help protect you, and how you can start using it in your own projects, not just for files hosted on CDNs.
Read more…
WebAssembly is a new language that runs in the browser alongside JavaScript. In this article, Robert Aboukhalil explores how you can speed up web applications by replacing slow JavaScript calculations with compiled WebAssembly. This is a case study on using WebAssembly to speed up a data analysis web tool. To that end, Robert will take an existing tool written in C that performs the same computations, compile it to WebAssembly, and use it to replace slow JavaScript calculations.
Read more…
There is no better way to understand data than by visualizing it with charts and diagrams. The JS community has some great open-source projects that make data visualization easier, however, there has not been a go-to solution for building real-time backends that can back these charts and make them real-time. With GraphQL (which has a well-defined spec for real-time subscriptions), we can get a real-time backend running within seconds and use it to power real-time charts. In this article, Rishichandra Wawhal will explain how to build real-time charts with open-source technologies apt for exactly this particular task.
Read more…
Voice Assistants are on their way into people’s homes, wrists, and pockets. That means that some of our content will be spoken out loud with the help of digital speech synthesis. The web isn’t just passive text on a screen anymore. Web editors and UX designers have to get accustomed to making content and services that should be spoken out loud. In this tutorial, Knut Malvær will show you how to make a What You Get Is What You Hear (WYGIWYH) editor for speech synthesis using Sanity.io’s editor for Portable Text.
Read more…
With Spotify, machine learning and social media has gone musical. With their app, your friends can check out what you’re jamming to. What if the rest of the Internet could experience your algo-rhythm, too? In this article, Cher Scarlett will show you how to compose your own application to share what you’re listening to on Spotify using Vue.js and Nuxt. This tutorial is moderately complex, and it requires knowledge of HTML, CSS, Javascript (ES6), but is broken down into very consumable sections.
Read more…
WordPress is modernizing, allowing us to rethink how to make the most out of newer tools and technologies. In this article, Leonardo Losoviz explains how you can integrate WordPress with Composer, Packagist, and WPackagist in order to produce better code. He will review two projects which provide an integration between WordPress and Composer: manually setting our composer.json file depending on John P. Bloch’s mirror of WordPress’ core, and Bedrock by Roots.
Read more…
The popularity of Vue.js shows no signs of slowing down, with a huge amount of credit being due to the framework’s progressive approach. One of the key advantages of Vue.js is that it plays nicely with other code: it is easy to embed progressively into other applications, but it is also easy to wrap up non-Vue code into Vue. In this article, Kevin Ball explores this second advantage, covering three distinct types of third-party JavaScript and ways to embed each of them in Vue.
Read more…
What is Node in the first place? What is the meaning “event-driven” and “non-blocking” anyway, and how does Node fit into the bigger picture of applications, Internet networks, and servers? In this article, Jamie Corkhill will attempt to answer all of these questions and more throughout this series as he takes an in-depth look at the inner workings of Node, learn about the HyperText Transfer Protocol, APIs, and JSON, and more. An introduction to the backend web application development process.
Read more…
