All Projects → OpusCapita → Filemanager

OpusCapita / Filemanager

Licence: apache-2.0
React based FileManager for browser ( + FS REST API for Node.js and Express)

Programming Languages

javascript
184084 projects - #8 most used programming language
js
455 projects

Projects that are alternatives of or similar to Filemanager

Angular Filemanager
JavaScript File Manager Material Design Folder Explorer Navigator Browser Manager in AngularJS with CSS3 Responsive (with FTP in PHP / Java / Node)
Stars: ✭ 1,693 (+347.88%)
Mutual labels:  file-explorer, file-upload, filemanager
kodbox
kodbox is a file manager for web. It is a newly designed product based on kodexplorer. It is also a web code editor, which allows you to develop websites directly within the web browser.You can run kodbox either online or locally,on Linux, Windows or Mac based platforms
Stars: ✭ 1,188 (+214.29%)
Mutual labels:  filemanager, file-upload, file-explorer
Tinyfilemanager
The best web based PHP File Manager in single file, Manage your files efficiently and easily with tinyfilemanager
Stars: ✭ 2,679 (+608.73%)
Mutual labels:  file-explorer, file-upload, filemanager
Kodexplorer
A web based file manager,web IDE / browser based code editor
Stars: ✭ 5,490 (+1352.38%)
Mutual labels:  file-explorer, file-upload, filemanager
Anexplorer
📁 Another Android Explorer ( File Manager ) is an All-in-One Open source file manager. AnExplorer File Manager (File Explorer) is designed for all android devices including Phones, Phablets, Tablets, Chromecast, Wear OS, Android TV and Chromebooks. It's a fully designed with Material guidelines by Google.
Stars: ✭ 1,505 (+298.15%)
Mutual labels:  file-explorer, filemanager
Filestash
🦄 A modern web client for SFTP, S3, FTP, WebDAV, Git, Minio, LDAP, CalDAV, CardDAV, Mysql, Backblaze, ...
Stars: ✭ 5,231 (+1283.86%)
Mutual labels:  file-upload, filemanager
File Picker
The Kloudless File Picker is a file chooser and uploader for apps that integrates with 20+ cloud storage services with a few lines of code
Stars: ✭ 208 (-44.97%)
Mutual labels:  file-explorer, file-upload
js-fileexplorer
A zero dependencies, customizable, pure Javascript widget for navigating, managing, uploading, and downloading files and folders or other hierarchical object structures on any modern web browser.
Stars: ✭ 124 (-67.2%)
Mutual labels:  filemanager, file-explorer
vue-fs
A Vue file management client, complete with a node/express/FS backend.
Stars: ✭ 40 (-89.42%)
Mutual labels:  filemanager, file-explorer
Multipages Generator
🥇 generator for multiple pages webpack application
Stars: ✭ 354 (-6.35%)
Mutual labels:  frontend
Spring Boot Projects
该仓库中主要是 Spring Boot 的入门学习教程以及一些常用的 Spring Boot 实战项目教程,包括 Spring Boot 使用的各种示例代码,同时也包括一些实战项目的项目源码和效果展示,实战项目包括基本的 web 开发以及目前大家普遍使用的线上博客项目/企业大型商城系统/前后端分离实践项目等,摆脱各种 hello world 入门案例的束缚,真正的掌握 Spring Boot 开发。
Stars: ✭ 4,022 (+964.02%)
Mutual labels:  file-upload
Jparticles
A concise, lightweight, and efficient Canvas library for building some cool particle effects.
Stars: ✭ 350 (-7.41%)
Mutual labels:  frontend
Bookmark Landing
Challenge #3 by FrontendMentor.io
Stars: ✭ 358 (-5.29%)
Mutual labels:  frontend
Kashti
Kashti is a dashboard for your Brigade pipelines.
Stars: ✭ 370 (-2.12%)
Mutual labels:  frontend
Fakerest
Patch fetch/XMLHttpRequest to fake a REST API server in the browser, based on JSON data.
Stars: ✭ 350 (-7.41%)
Mutual labels:  frontend
React Uploady
Modern file uploading - components & hooks for React
Stars: ✭ 372 (-1.59%)
Mutual labels:  file-upload
Uiengine
Workbench for UI-driven development
Stars: ✭ 349 (-7.67%)
Mutual labels:  frontend
Sublime Better Completion
DEPRECATED, use TypeScript!
Stars: ✭ 342 (-9.52%)
Mutual labels:  frontend
Gaze Detection
👀 Use machine learning in JavaScript to detect eye movements and build gaze-controlled experiences.
Stars: ✭ 376 (-0.53%)
Mutual labels:  frontend
Kart
🎮 Frontend for RetroArch
Stars: ✭ 373 (-1.32%)
Mutual labels:  frontend

Filemanager

badge-circleci badge-npm badge-license

Demo

React Documentation

Demo and react documentation are powered by React Showroom

Packages

Detailed documentation for each package is coming soon.

Basic usage

Client implementation is an npm package which can be embed into your application. It uses React framework and supports connectors to different file storages. Predefined connectors are:

You can write you own custom connectors (documentation on how to do it will appear later).

How to use Server Node

Server Node API v1 Documentation

Install package

npm install --save @opuscapita/filemanager-server

Now you have at least two ways of using it:

  • Start as application
let config = {
  fsRoot: __dirname,
  rootName: 'Root folder',
  port: process.env.PORT || '3020',
  host: process.env.HOST || 'localhost'
};

let filemanager = require('@opuscapita/filemanager-server');
filemanager.server.run(config);

How to use Client React

Install packages

npm install --save @opuscapita/react-filemanager @opuscapita/react-filemanager-connector-node-v1

Use it as a child component of you application

import React from 'react';
import ReactDOM from 'react-dom';
import { FileManager, FileNavigator } from '@opuscapita/react-filemanager';
import connectorNodeV1 from '@opuscapita/react-filemanager-connector-node-v1';

const apiOptions = {
  ...connectorNodeV1.apiOptions,
  apiRoot: `http://opuscapita-filemanager-demo-master.azurewebsites.net/` // Or you local Server Node V1 installation.
}

const fileManager = (
 <div style={{ height: '480px' }}>
    <FileManager>
      <FileNavigator
        id="filemanager-1"
        api={connectorNodeV1.api}
        apiOptions={apiOptions}
        capabilities={connectorNodeV1.capabilities}
        listViewLayout={connectorNodeV1.listViewLayout}
        viewLayoutOptions={connectorNodeV1.viewLayoutOptions}
      />
    </FileManager>
  </div>
);

ReactDOM.render(fileManager, document.body);

Changelog

Code of Conduct

Contributing Guide

Main contributors

Alexey Sergeev
Kirill Volkovich
Andrei Mourzenkov
Aleksandr Baliunov
Egor Stambakio

License

Licensed under the Apache License, Version 2.0. See LICENSE for the full license text.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].