/react-hooks-multiple-file-upload

React Multiple File upload using Hooks example with Axios & Progress Bar

Primary LanguageJavaScript

React Hooks Multiple File Upload example with Progress Bar & Axios

We’re gonna create a React Multiple Files upload application using Hooks, in that user can:

  • see the upload process (percentage) of each file with progress bars
  • view all uploaded files
  • download link to file when clicking on the file name

react-hooks-multiple-files-upload-example

When there is an error on uploading file:

react-hooks-multiple-files-upload-example-with-error-message

For instruction, please visit:

React Hooks Multiple File Upload example

More Practice:

React.js Multiple Images Upload with Preview

React (Components) Multiple File Upload example

Rest APIs server for this React Client:

Node.js Express File Upload Rest API example

Spring Boot Multipart File upload example

More Practice:

React CRUD example using Hooks

React Pagination using Hooks example

React Hooks: JWT Authentication & Authorization example

React + Redux + Hooks: JWT Authentication & Authorization example

Fullstack with Node.js Express:

React.js + Node.js Express + MySQL

React.js + Node.js Express + PostgreSQL

React.js + Node.js Express + MongoDB

Fullstack with Spring Boot:

React.js + Spring Boot + MySQL

React.js + Spring Boot + PostgreSQL

React.js + Spring Boot + MongoDB

Fullstack with Django:

React.js Hooks + Django Rest Framework

Serverless:

React Hooks Firebase CRUD App with Realtime Database

React Hooks Firestore CRUD App example | Firebase Cloud Firestore

This project was bootstrapped with Create React App.

Set port

.env

PORT=8081

Project setup

In the project directory, you can run:

npm install
# or
yarn install

or

Compiles and hot-reloads for development

npm start
# or
yarn start

Open http://localhost:8081 to view it in the browser.

The page will reload if you make edits.