<input type="file"> element looks silky and smooth and has ability to perform drag and drop, a great addition for your app. Here I want to show you how it's done in Laravel app.
Have your own
laravel app to follow along, you have used JS and SASS/SCSS using
laravel-mix in the app.
The NPM command:
npm install filepond --save-dev
The input form is the plain one like this:
<input type="file" />
Just put anywhere in the page.
In your JS entrypoint file, we can parse the component input into the filepond form component on the page document load event:
In above code, We parse any input file type element in the page document body.
npm run development
npm run production
Well, see if the filepond is implemented perfectly.
Filepond isn't only about styling your file form, but it come with others nice features. One of them is able to do asyncronus file upload to the server when you selected the file in form. I will try to cover this later in the future post.