Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »


0.0.14 • Public • Published

files-and-folders (FnF)

Become a master of file management with "Files and Folders" (FnF). FnF is an orthodox browser based file manager for Mac OS X, Windows and Linux.

The server component based on Node.js, the client component on AngularJS.

It's an early version! Tested on Windows 7 and Mac OS X. Documentation will be expanded and new features will be added.


Main features of FnF:

  • Cross-platform (Frontend: browser, Backend: node.js)
  • Orthodox file managers (two-panel directory view with a command line below)
  • Tabbed interface
  • All operations working in queues
  • Multi-rename tool (Batch rename, apply filename changes to a group of files simultaneously)
  • Multi-group tool (Arranging and Grouping files, moving files to folders)
  • Directory history for changing back to recently viewed directories.
  • Configurable extensions menu to start external programs
  • User definable colors
  • User definable keyboard shortcuts
  • File List Filtering: Quickly filter a list of files by name, extension, or kind.
  • Smart Sorting: Sort by folders, packages, or files first.
  • Work with your files side-by-side in a customizable Dual Pane View and enjoy Full Keyboard Navigation.
  • Access frequently used files and folders with Bookmarks and Tab Presets.
  • View and manipulate hidden files.
  • Application Launcher: Access your apps with the press of a key.
  • Copy Names or Path of selected files and folders as text or json to clipboard.
  • Open a terminal window with active folder ("New Terminal Here")
  • Much more


This software serves me as a sandbox to try out new technologies like WebSockets, css custom properties and so on. Therefore, the use of the latest browser is required (see caniuse).


Create an empty folder. Open your shell (console) and navigate to this folder. Enter:

npm i files-and-folders

A directory named node_modules is created with some sub folders. Navigate to node_modules/files-and-folders Enter:

cd node_modules/files-and-folders

Start app with:


In case of an error have a look at clientRoot: __dirname + '/../files-and-folders-client/release'.


Edit and call the demo app:

(function () {
  "use strict";
  var fnf = require('files-and-folders-server');
  var open = require('open');
  var port = 3002;'app / __dirname :', __dirname);
    // auth: require('./demo.auth.js'), // optional
    clientRoot: __dirname + '/node_modules/files-and-folders-client/release',
    port: port
  var url = 'http://localhost:' + port + '/';

You can set an auth module, see demo.auth.js.


User definable colors:

A color customizing dialog will be added. At the moment you can change an existing color scheme (or add a new one) by editing the json files in the folder ./node_modules/files-and-folders-server/config/color/. In browser click on the last button (pencil icon) to open the color menu and select a color scheme. The colors changes immediately. This state will be saved (see ./node_modules/files-and-folders-server/temp/). This means, after page reload you will get the last (saved) state.

The user can create new color schemes with real time preview: Color Config Dialog

The user can choose between three predefined color schemes:

Light: light Colro Scheme:

Dark: Dark Color Scheme:

Blackboard: Blackboard Scheme:

User definable keyboard shortcuts:

Speed up your workflow by relying less on the mouse. Create a custom list of keyboard shortcuts using various action keys.

A keyboard shortcut customizing dialog will be added. At the moment you can change the shortcuts by editing the json files in the folder ./node_modules/files-and-folders-server/config/shortcut/. There is a file with one of these names: osx.json, windows.json and linux.json. The used file depends on your operating system.

In these json files you can map a shortcut with an action id. You can add more than one shortcut to an action id. The action ids should be self explained. Shortcuts are expained here: Keypress by David Mauro.

File Operations / Functions

All file operations can be done on selected items (seleted files/folders in a file panel view or found file/folders after a search).


Copies selected items (file and/or folders) to a new target folder.


Moves selected items to a new folder.

Create Dir

Creates a single sub directory.


Delete selected items.


Finds files or directories.


Rename a single file or directory.

Multi Rename

Multi rename tons of files with patterns or predefined makros. multirename

Group Files

Moving files to (new) folders. Folder name is derived from file name. Files with running numbers will be moved to one folder. User can specify algorithm in a dialog. A preview is shown before operation starts. groupfiles

Delete Empty Folders

Delete all empty folder recursive.

Copy names to clipboard

Copy names of selected items to clipboard in different styles (tab separated or JSON array).

External Tools / CMD Shell

External tools can be defined in a config file. These tools are external commands. Predfined: CMD Shell, Edit and Reveal in Finder (Mac).

Change Dir (Tree

Opens a dialog with a list of sub directories. changedir

Go to anything

A small dialog with auto completion allows the user to enter commands.

Related projects

More infos coming soon...


npm i files-and-folders

Downloadsweekly downloads









last publish


  • avatar