https://github.com/pierreamgabriel/react-images-upload
React component to upload images.
https://github.com/pierreamgabriel/react-images-upload
image-upload react react-images-uploading reactjs uploader
Last synced: 25 days ago
JSON representation
React component to upload images.
- Host: GitHub
- URL: https://github.com/pierreamgabriel/react-images-upload
- Owner: pierreamgabriel
- License: gpl-3.0
- Created: 2022-04-10T18:13:31.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2023-05-08T06:09:11.000Z (about 3 years ago)
- Last Synced: 2025-01-01T11:12:40.431Z (over 1 year ago)
- Topics: image-upload, react, react-images-uploading, reactjs, uploader
- Language: JavaScript
- Homepage:
- Size: 2.92 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React Images Upload
This is a React component to upload images. It's easy to use, and it comes with a PHP script to handle the back-end logic.
## Installation
Copy the lib folder and the ImageUpload.js and ImageUpload.css files to the src folder of your project. Copy the upload.php file to the public folder. Create a folder called uploads inside the public folder.
Install dependencies:
```bash
npm install axios @mui/material @emotion/react @emotion/styled
```
## Usage
Import the component in your code:
```javascript
import ImageUpload from './ImageUpload';
```
### How does it work?
It copies any jpg or png image to the uploads folder, and it adds the image URL to the imgList variable in the order it was uploaded. It also shows a preview of all images uploaded with an edit and delete button.
### What do I do with the URL list in the imgList variable?
You save the URLs in your database. You'll need to change the code a bit to add your logic.
### How can I apply different styles?
You can freely change the code and apply the styles you want.
### Does it delete and replace images as well?
It does, but it won't delete the actual images inside the uploads folder. It'll just update the URL list.
### How can I upload images to a different folder?
You need to change the upload.php file.