File manager built using React, Redux and Firebase to imitate the Finder/My Folder in a laptop. Each Folder/File can be accessed separately using the route created using 'react-router-dom' library.
Short demo of the app
file-manager-demo_3L0ko2I7.mp4
To run the project
- Go to the project directory and install packages using command 'yarn'
- Start the project usinh 'yarn start'
Inside the project,
- Add Folder by clicking on the 'Add Folder' icon
- Upload Files by clicking on the 'Upload to cloud' icon.
- Now the files apper on the screen and are navigatable.
- Traverse from one folder to another with the help of breadcrumbs
- Rename the folder by double clicking on the {Folder name}
- Select multiple files and/or folders by using SELECT button on right top corner of the content layout.
- And delete the selected files and/or folders.
- Downloadable link for the assets is available on the top right corner of the file grid.
- File/folder info is available on the bottom corner of the folder grid.
- A tree structure is provided in the sidebar for view and easy identification of location.
Technologies Used :
React - Frontend Library Redux - Library for managing data operations Firebase - Cloud data storage Tool Frontend Design Templates - Antd design and Material UI package File Upload Package Used - Dropzone