ITpraktika.com

Posted on Jan 17 • Originally published at itpraktika.com

FileCloud: A Modern and Lightweight File Manager

#opensource #filemanager #webdev #node

🌟 Overview

FileCloud is a reliable web-based file management solution designed for personal servers. It offers a premium, app-like experience with a focus on aesthetics, speed, and usability. It provides modern features like drag-and-drop upload, code editing, and full internationalization (EN/BG).

✨ Key Features

📂 File Management: Create folders, delete items, and download files with ease.
✏️ Rename and Organize: Fix typos or restructure your files with a custom, elegant rename modal.
🎨 Folder Customization: [NEW] Mark important folders by changing their color directly from the UI. Your choice is saved permanently!
🌍 Internationalization (i18n): Fully translated interface in English and Bulgarian (български). Switch instantly.
🚀 Drag and Drop: Upload files by simply dragging them into the window.
📝 Built-in Editor: Edit text, code (.js, .css, .py, etc.) and configuration files directly in the browser.
👁️ Media Preview: View images instantly without downloading them.
💎 Premium UI: Dark mode by default, smooth animations, glassmorphism effects, and rich file icons.

🛠️ Installation and Setup

Prerequisites

Node.js (version 14 or newer)
npm

Installation

Clone the repository:

# Clone the repository
git clone [email protected]:fantomas4o/filecloud.git

# Navigate to the project folder
cd filecloud

Install dependencies:

npm install

Start the server:

npm start

Access the application at http://localhost:3000 or http://ip:3000

Server Deployment (Ubuntu/Systemd)

To run FileCloud as a background service:

Copy the project to /opt/filecloud.
Create a systemd service file at /etc/systemd/system/filecloud.service:

[Unit]
Description=FileCloud Service
After=network.target

[Service]
ExecStart=/usr/bin/node /opt/filecloud/server.js
WorkingDirectory=/opt/filecloud
Restart=always
User=root
Environment=NODE_ENV=production

[Install]
WantedBy=multi-user.target

Enable and start the service:

sudo systemctl enable filecloud
sudo systemctl start filecloud

💻 Technologies

Backend: Node.js, Express.js, Multer, FS-Extra
Frontend: HTML5, CSS3 (Custom Properties, Flexbox/Grid), Vanilla JavaScript (ES6+)
Icons: Google Material Icons
Fonts: Google Fonts (One Sans)

🚀 Features in Detail

File Operations

Upload: Drag files directly into the browser or use the upload button
Download: Click on any file to download it instantly
Delete: Remove files and folders with confirmation dialogs
Rename: Change file and folder names with a sleek modal interface

Code Editor

The built-in editor supports syntax highlighting for:

JavaScript (.js)
CSS (.css)
Python (.py)
JSON (.json)
Text files (.txt)
And many more...

Folder Customization

NEW Feature: You can now customize folder colors to organize your workspace visually. The color selection is persistent and saved in your browser.

Internationalization

FileCloud supports multiple languages out of the box:

English (EN): Default interface language
Bulgarian (BG): Fully translated Bulgarian interface

Switch languages instantly from the settings menu.

📦 Project Structure

filecloud/
├── public/
│   ├── css/           # Stylesheets
│   ├── js/            # Client-side JavaScript
│   └── uploads/       # User uploaded files
├── views/
│   └── index.html     # Main application page
├── server.js          # Express server
├── package.json       # Dependencies
└── README.md          # Documentation

🔒 Security Considerations

FileCloud is designed for personal use on private servers. If you plan to expose it to the internet, consider:

Implementing authentication
Adding SSL/TLS encryption
Setting up proper firewall rules
Restricting file upload types and sizes

🤝 Contributing

Contributions are welcome! Feel free to:

Report bugs
Suggest new features
Submit pull requests

GitHub Repository: https://github.com/fantomas4o/filecloud

📝 License

This project is open source and available for free use.

Original article in Bulgarian: FileCloud: Модерен и лек файлов мениджър

About the Author

Fedya Serafiev is the creator of ITpraktika.com – a platform dedicated to practical IT solutions and automation. With extensive experience in system optimization and web technologies, he transforms complex technical cases into clear and easy-to-follow steps. His goal is to help users build more efficient and secure digital projects through real experience and proven tools.

💝 If you found this article useful, consider supporting my work:

💖 Your support means a lot!

DEV Community