Skip to main content

How to Make API Call in React

In our previous tutorial, we have explained about Mapping Components in React. In this tutorial, we will explain how to make API call in React.

React is the most popular front-end framework used to make web applications. The API calls are made to get data and render into application. So making call to api is an important part of a React app.

So here in this tutorial, we will explain how to integrate APIs in your React application. We will build an app to make API request and get json data. Then we will list employee data from response json data.

(more…)

Rendering HTML in React

In our previous React tutorial, we have explained how to Create React Select Dropdown List from API. In this tutorial, we will explain How to Render HTML in React.

There might be times when we have HTML content from external sources or WYSIWYG editors or via REST API to render using React. By default, it’s not possible in React due to security reason. It treats all content as string and thus all tags are visible on the page.

(more…)

Setup TinyMCE Editor in React

In our previous React tutorial, we have explained how to implement Autocomplete Search in React. In this tutorial, we will explain how to setup TinyMCE Editor in React .

We often need to use WYSIWYG html editor into our React project. The WYSIWYG HTML editors are used in web application that allows to preview the end results and source of content before saving or printing final content.

TinyMCE is an open-source WYSIWYG html editor to use in web applications. In this tutorial, we will explain how to integrate TinyMCE editor in React application.

We will use react tinymce-react package to use TinyMCE in React application.

(more…)

Build Autocomplete Search in React

In our previous React tutorial, we have explained how to create React Select Dropdown List from API. In this tutorial, we will explain how to create React Autosuggest Search using API.

The autosuggest search is a very user friendly feature of web application in which partial text search ebabled to display dropdown list of matching option values to select from.

In this tutorial, we will implement autosuggest search component to allow users to enter partial search text, an api request made to fetch data based on search text and display in dropdown list as suggested items to select fom suggested list.

(more…)

React Select Dropdown List from API

In our previous React tutorial, we have explained how to create react select dropdown. In this tutorial, you will learn to create React Select Dropdown List using REST API.

We will use react-select library to create an async select dropdown list by making http client request to API using axios package and loading response data to dropdown list. We will also use useState hooks to set and get selected values.

(more…)