If you want your Arduino projects to be even cooler, connecting them to a WiFi network is a must. In this tutorial, we will learn how to connect an Arduino to a WiFi network using the WiFiNINA library. To get started, make sure your Arduino board has WiFi connectivity. For example, you can use the Arduino MKR WiFi 1010 or the Arduino Uno WiFi Rev2. First, include the necessary libraries in your Arduino sketch:...
Connecting a React app to a backend on the same origin can be a challenge, especially when it comes to handling CORS and ports. In this article, we will explore a solution that allows you to serve your React app and a server-side backend from the same origin without the need for CORS. When developing a React app, one commonly used approach is to utilize the create-react-app tool. It provides a convenient way to start and develop a React app....
Learn how to utilize CSS Animations to make an image rotate continuously. While developing the landing page for the React Handbook, I found myself needing to rotate an image. Specifically, I wanted to rotate an SVG image, but this technique can be applied to any image type or HTML element. To rotate the desired element, simply add the following CSS instruction: animation: rotation 2s infinite linear; Alternatively, you can assign a class, such as rotate, to the element instead of targeting it directly:...
In this blog post, I will share a technique for converting code that uses callbacks into code that utilizes async/await. I will provide an example and explain the steps involved in this transformation. Let’s start with the original code that uses a callback: const uploadFile = (callback) => { // Upload the file, then call the callback with the location of the file callback(location); } uploadFile((location) => { // Continue with the logic }); To convert this code to use async/await, we can wrap the body of the uploadFile function in a return new Promise() call....
Learn how to convert a string to a number using JavaScript. JavaScript provides several ways to convert a string value into a number. Best: Use the Number Object The best and recommended way is to use the Number object in a non-constructor context, without the new keyword: const count = Number('1234'); // 1234 This method takes care of decimal values as well. It’s important to note that the Number object is a wrapper object that can perform various operations....
In JavaScript, you can convert an array into a string using the toString() method or the join() method. Let’s explore both methods. Using the toString() Method The toString() method can be used to convert an array to a string representation. This method returns a string that consists of the array elements separated by commas. const list = [1, 2, 3, 4]; list.toString(); Example: Using the join() Method The join() method returns a string that is the result of concatenating all the elements of an array....
Converting an image into a data URI string allows you to embed it directly into an HTML page. If you’re looking for a way to achieve this, here’s a step-by-step guide: Read the Image File: const imageData = fs.readFileSync(fileLocation, 'binary'); Get the Content Type: If you’re downloading the image from the internet, you can extract the content type from the response headers: const contentType = response.headers['content-type']; Convert the Image Data to Base64: In order to generate the data URI string, you need to convert the image data into base64 format:...
Copying data from one table to another is a common maintenance task in SQL. There are several ways to accomplish this, depending on your specific needs. In this blog post, we will explore two methods for copying data: copying all elements or selecting specific ones. Method 1: Copying All Elements To copy all elements from one table to another, you can use the following SQL statement: INSERT INTO some_table SELECT * FROM other_table This will copy all rows and columns from the other_table to the some_table....
Problem: Moving Inner Object Properties to the Outer Object In some cases, you may encounter a situation where an object contains its actual data within another object assigned to a specific property. To illustrate this, consider the following example: let tweet = { data: { id: 1, content: 'test' } } In this scenario, the tweet object stores the tweet data within the data property. However, there may be a need to move these inner properties to the top level of the object as shown below:...
Learn how to implement copy to clipboard functionality in your websites using the Clipboard API. Introduction There are times when we need to copy and paste information from websites, such as API keys or activation tokens. Some websites provide a convenient way to copy text by clicking inside a box, which automatically copies the text to the clipboard. In this blog post, we will explore how to add this functionality to our own websites using the Clipboard API....