UI or User Interface test is a form of acceptance testing done to verify the user flows of your front-end application. The emphasis of these kinds of software tests is on the end-user that is the actual person who will be interacting with your web application on a variety of devices ranging from desktops, laptops to mobile devices. In this final part of Mirage JS Deep Dive series, Kelvin Omereshone will be putting everything you’ve learned in the past series into learning how to perform UI tests with Mirage JS.
Read more…
In this article, Adeneye David Abiodun explains how to build a facial recognition web app with React by using the Face Recognition API, as well as the Face Detection model and Predict API. The app built in this article is similar to the face detection box on a pop-up camera in a mobile phone — it’s able to detect a human face in any image fetched from the Internet. Please note that you will need to know the fundamentals of React.
Read more…
So far, we have seen how we can create records with Mirage, intercept API requests via route handlers and, last but not least, how the shape of the data returned to us from Mirage is affected. In this third part of Mirage JS Deep Dive series, Kelvin Omereshone will be focusing on using response, timing and passthrough in Mirage for a better handle on simulating an actual backend server. However, before you begin reading this article, please read the introduction to MirageJS first as well as Part 1 and Part 2 of this series.
Read more…
To make the move from “site” to app, we’ll need to dive into the world of “app-generated” content. In this article, Bryan Robinson will get you started in this world with the power of serverless data. He’ll start with a simple demo by ingesting and posting data to FaunaDB and then extend that functionality in a full-fledged application using Auth0, FaunaDB’s Token system and User-Defined Functions.
Read more…
If you’re a React developer who’d like to learn how you can start consuming APIs in your React applications, then this article is for you. Consuming REST APIs in a React Application can be done in various ways, but in this tutorial, Shedrack Akintayo will be discussing how we can consume REST APIs using two of the most popular methods known as Axios and Fetch API. You will learn what a REST API is and how to build a simple application that consumes a REST API by using both Fetch API and Axios.
Read more…
Factories are a faster way to create new database records., A fixture is a state of a set or collection of objects that serve as a baseline for running tests, and a serializer is responsible for transforming the response. In this second part of the Mirage JS Deep Dive series, Kelvin Omereshone will be looking at Mirage JS’ Factories, Fixtures, and Serializers. You’ll see how they enable rapid API mocking using Mirage.
Read more…
Mirage JS borrowed some terms and concepts which are very much familiar to back-end developers, however, since the library would be used mostly by front-end teams, it’s appropriate to learn what these terms and concepts are. In this first part of the Mirage JS Deep Dive series, Kelvin Omereshone will be looking at Mirage JS models and associations. He’ll take a closer look at what they are and the roles they play in crafting out production-ready frontend without an actual backend with Mirage JS.
Read more…
In this tutorial, you are going to learn and understand what React hooks are, the basic React Hooks that are available and also examples of how to write them for your React applications. In the process, you will also get to know about some additional hooks that were shipped with React 16.8 and also how to write your own custom React Hooks.
Read more…
HTML is getting better at providing nice APIs for implementing cool features. In this tutorial, Chidi Orji is going to show you how to use the HTMLIntersection Observer API to implement infinite scrolling and image lazy loading in a React functional component. In the process, we’ll learn how to use some of React’s hooks and how to create Custom Hooks. Let’s get started!
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…
