Giter VIP home page Giter VIP logo

filemanager's Introduction

File Manager

A File Manager/Browser with the ability to list/upload/delete files and add/delete directories within a root directory that you can specify either from a Native File System or one of the Cloud Storage Providers(currently configured for Microsoft Azure Storage Account using a File Share). Additionally, the app also demonstrates the integration between CKEditor which is a popular WYSIWYG editor with this file system for browsing files using the File Manager and uploading files and images.

Demo

https://dherenj84.azurewebsites.net/filemanager
Username: sample
Password: sample

Tech Stack

  1. Angular for the UIX (https://angular.io/)
  2. Spring Boot for the service backend (https://spring.io/projects/spring-boot)
  3. Bootstrap for styling (https://getbootstrap.com/)
  4. Font Awesone for Icons (https://fontawesome.com/)
  5. CKEditor (https://ckeditor.com/ckeditor-4/)
  6. Maven for buliding, packaging and running the app (https://maven.apache.org/)

Configuration

There are 3 simple configuration changes that would be required to configure the app based on what storage mode you want to use,

  1. Under src/main/resources/application.properties change the storage.mode to either native for Native File System or cloud for Cloud Storage Accounts(currently Microsoft Azure Storage Supported) .
  2. If storage.mode is set as native in step 1 above, specifiy file.directory and file.root properties otherwise skip this step.
  3. If storage.mode is set as cloud in step 1, specify azure.storage.connection-string property in the application.properties. This value can be generated using the Access keys feature under your Storage Account in Microsoft Azure Portal.

Please note that I am using my own Azure account's Access Key to access the File Storage Account. The Access Key that you will find under application.properties is just a placeholder for you to refer the syntax but may not be valid anymore.

Sources

The Angular App resides in the ng-app folder under project root and the Java App resides in the conventional src folder under project root.

Build & Run the app

The App runs as one single java web application and can be deployed as a war in a container of your choice. The complied Angular UI code resides in src/main/resources/static folder. Because the backend being Spring Boot, the app can be quickly run using the following command on the project root,
mvn spring-boot:run

Angular Code is built using the command ng build --prod --base-href . As you may have noted I am removing the base-href upon production build of Angular Code. This is necessary to make sure that the app runs correctly with it's current project structure.

filemanager's People

Contributors

dependabot[bot] avatar dherenj84 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.