Making your tables sortable in React might sound like a daunting task, but it doesn’t have to be too difficult. In this article, Kristofer Giltvedt Selbbekk is going to show you how to implement all you need to sort out all of your table sorting needs. By the end of this tutorial, you will have found a way to model your state, wrote a generic sorting function, and wrote a way to update what our sorting preferences are. After making sure everything is performant and refactored you will provide a way to indicate the sort order to the user.
Read more…
Reset password functionality is table stakes for any user-friendly application. It can also be a security nightmare. Using NodeJS and MySQL. Today, Darshan Somashekar demonstrates how to successfully create a secure reset password flow so you can avoid these pitfalls. Darshan will be using NodeJS and MySQL as the base components. If you’re writing using a different language, framework, or database, you can still benefit from following the general “Security Tips” outlined in each section.
Read more…
Ever built a website and reached for jQuery, Bootstrap, Vue.js or React to acheive some basic user interaction? Alpine.js is a fraction of the size of these frameworks because it involves no build steps and provides all of the tools you need to build a basic user interface. Today, Phil Smith is going to take a closer look at Alpine.js and how it can replace JQuery or larger JavaScript libraries to build interactive websites. If you regularly build sites that require a sprinkling on Javascript to alter the UI based on some user interaction, then this article is for you.
Read more…
Whenever a web client uploads a file to a server, it is generally submitted through a form and encoded as multipart/form-data. Multer is a middleware for Express.js and Node.js that makes it easy to handle this so-called multipart/form-data whenever your users upload files. In this article, Deve Rathore introduces how Multer streamlines the process of handling file uploads. It also introduces how to use Mongoose to interact with our database by building a music manager app using Express.js alongside Multer for the music upload and Nuxt.js (Vue framework) for our frontend.
Read more…
The blockchain technology is receiving a lot of attention because of its ability to enhance security in trustless environments, enforce decentralization, and make processes efficient. In this tutorial, Alfrick Opidi demonstrates how to create a simple cryptocurrency, called smashingCoin, using the concepts of JavaScript classes and Node.js. Give it a try — it’s simpler than you think!
Read more…
In this tutorial, Chidi Orji will show you how to build a React drag-and-drop component for file and image uploads. In the process, we’ll learn about the HTML drag-and-drop API. We will also learn how to use the useReducer hook for managing state in a React functional component.
Read more…
Almost all JavaScript projects that can be found out in the wild interact with a web service or API and either use it for authentications or getting user-related data. In this article, Kelvin Omereshone introduces Mirage JS, an API mocking library that lets you build, test and share a complete working JavaScript application without having to rely on any backend API or services. You’ll also learn how to set up Mirage JS with the progressive front-end framework, Vue.js.
Read more…
Leaflet is a very powerful tool, and we can create a lot of different kinds of maps. This tutorial will help you understand how to create an advanced map along with the help of React and Vanilla JS. In this article, Shajia Abidi is going to represent the locations of the non-medical fire incidents to which the SF Fire Department responded on a map.
Read more…
Today, Anna Prenzel would like to focus on data streams resulting from click events on the user interface. The processing of such clickstreams is particularly useful for applications with an intensive user interaction where many events have to be processed. This article is dedicated to Angular developers who want to harness the concept of reactive programming. This is a programming style that — simply put — deals with the processing of asynchronous data streams.
Read more…
Unless you’re creating your entire Vue app in one component (which wouldn’t make any sense), you’re going to encounter situations where you need to share data between components. With so many different ways to share data across components, you should know which technique is best for your situation. In this article, Matt Maribojoc will analyze three of the most common ways to pass data in VueJS.
Read more…