Why & How I created my own cloud file manager
By: Ashish Doneriya
Tags: Vuejs, Php Script, Cloud Storage, PHP, Vue

The greatest fear of my life is data loss ( my pictures, my documents and again my pictures that I’ve preserved for past 10 years). Because of this, I always keep 1 copy in my system and 2 different copies in separate external hard disks. Even after doing all these thing I was not satisfied, I wanted to store at least one copy in cloud.

There were 4 reliable options in cloud to store my data

Google Drive Microsoft Drive Amazon S3 Personal Hosting space

But all of them have some flaws

Google Drive : UI is good and file upload speed is slow (because of uploading one file at a time) Microsoft Drive : UI is not good ( 5 years back, UI was good) and file upload speed is fast (because of multiple connections) Amazon S3 : UI is very simple, fast but not option to see thumbnail images. File upload speed is normal. But you have to pay every month because it is pay per usage. If you do not pay them at right time, they start sending threatening email (to suspend your account if you don’t pay) to you even when the cost is a few cents. Personal Hosting space : I have my own unlimited hosting space. I tried own-cloud, next cloud and a lot of scripts my hosting service provided. They always felt highly resource consuming, slow and cluttered (UI not good). But there was a script that I found good while googling was File-gator. It had all the features that I wanted. But I couldn’t buy that script because my debit card doesn’t allow international transactions.

At last I asked questions to myself

Who am I?

I am a full stack developer.

What I want?

A simple, fast, beautiful and lightweight PHP file manager

How can I get it?

By creating a new one myself because I don’t want to waste my energy further in searching php scripts or cheapest, reliable and good looking cloud solutions

That began my journey of creating a new cloud file manager or php file manager.

How I created my own php file manager?

Learned basics of php from w3schools within 2 hours. I have well understanding of rest apis and json structure. I already know Vuejs and one of its UI library Element UI. I decided that there would be two views in my file manager — list view and galley view. I made list view outline just like file-gater but internal components more like aws s3 file manager I made gallery view outline just like google drive. I created login page and file explorer page in same html file. I even put javascript code in that html file too. I did that because I found it easier to manage one file instead of building a separate Vuejs project and then compile it every time. I created different php files for serving different api calls. For login purpose, I didn’t use any type of database and this is the biggest advantage of my file manager. I wrote credentials directly in a php file. I dynamically generates thumbnail image whenever a user opens a directory in album mode. I added v-img to view pictures in gallery mode, vue-lazyload to load pictures when user scrolls down instead of loading all pics at once. Created mechanism to upload very large files without any hassle.

So in this way I’ve created my own cloud manager. Currently it is hosted on Github. Today I have released its first version.

You are invited to try and test this script.

Update Jan 2021 : Filegator is opensource now. But I still have doubts whether filegator could upload very large files.

https://filegator.io/