Skip to main content

Create React Dropdown Select

In our previous React tutorial, we have explained how to create simple form with validation in React. In this tutorial, you will learn to create React Dropdown Select List.

The drop-down select list is a list of items. The currently selected item is always displayed selected item from dropdown list.

You can easily create dropdown select list using react-select library. The libray offers feature to create multi-select, autocomplete with Ajax to load dynamic data in dropdown list. The react-select library also has dynamic features like search, filter, async loading, animated component, easy accessibility, and faster loading time.

(more…)

How to Map Components in React

In our previous tutorial, we have listed Best PDF Viewer Component for React. In this tutorial, we will explain about Mapping Components in React.

As the React takes regular JavaScript data and turn into HTML, so here we will see how easily we can turn our array data into HTML elements.

Suppose you have employee list in an array and wants to turn that into <li> elements. The map() function from JavaScript do the magic to achieve our goal. It will help to loop through array and create new HTML elements for each record in an array. It will help to display elements like this. (more…)

Best PDF Viewer Component for React

In this post, we will list some of the best PDF Viewer Component for React to implement into React App.

PDF (Portable Document Format) is the most used file format to store documents data. It is a very convenient and safe to store data into PDF files.

So if you’re developing a React app and looking for component to use in your app for PDF viewer, then you’re here at the right place. In our previous post, we have listed some of the best PDF Viewer jQuery plugin. In this post, we will list some of the best PDF Viewer Component for React. The components are easy to use and provides the best viewing experience with PDF files. (more…)

Create Simple Form with Validation in React

In our previous React tutorial, we have explained file upload in React. In this tutorial, we will explain how to create form with validation in React.

HTML Form is an important part of web applications with inputs to allows to enter data to process at server end.

If you’re working with React and wants to create forms with validation then it’s very simple. You can easily create HTML Form with validation using React.

We will cover this tutorial step by step to create React application with required module installation to create form and implement client side validation with React.

(more…)

Simple React File Upload with Node.js

In our previous tutorial, we have explained how to upload multiple files with jQuery, PHP and MySQL. In this tutorial, you will learn how to implement file upload in React.

File upload is an important functionality of web applications to allow user to upload files. The file upload feature needed to upload user profile picture or avatar, create image gallery or upload document etc.

We will use Node server to handle file upload at server end in React application.

We will cover this tutorial step by step to create React application, install dependencies and then implement file upload in React application with example.

(more…)