Step-by-Step Guide: Creating a File Sharing System with Node.js and HTML on Android using Termux

Setting Up a File Sharing System

In this guide, we’ll walk you through the process of setting up a file sharing system on your Android device using Termux, Node.js, and HTML. Users can upload, download, and delete files through a web interface.

Prerequisites:

Install Termux: Download and install the Termux app from the Google Play Store or a trusted source.
A basic understanding of the command line and file system.

Step 1: Create a Project Directory

Open Termux and create a project directory where your file sharing system will be located. You can choose any location where you have write permissions. For example:

mkdir ~/my-file-sharing-system
cd ~/my-file-sharing-system

Step 2: Install Node.js

In Termux, install Node.js using the following command:

pkg install nodejs

This will install Node.js and npm (Node Package Manager).

Step 3: Create Project Folders

Inside your project directory, create the necessary folders:

mkdir public
mkdir uploads

The public folder will contain your HTML file.
The uploads folder will store uploaded files.

Step 4: Create index.html

Use a text editor in Termux (e.g., Nano) to create and edit your index.html file inside the public folder:

nano public/index.html

Paste the following HTML code for your file sharing system into the editor:

<!DOCTYPE html>
<html>
<head>
    <title>File Sharing System</title>
</head>
<body>
    <h1>File Sharing System</h1>

    <!-- File Upload Form -->
    <form action="/upload" method="post" enctype="multipart/form-data">
        <input type="file" name="file" required>
        <button type="submit">Upload File</button>
    </form>

    <!-- File Listing -->
    <h2>Uploaded Files</h2>
    <ul id="fileList">
        <!-- Dynamically generated list of uploaded files will appear here -->
    </ul>

    <script>
        // JavaScript code for displaying uploaded files, download links, and delete buttons goes here
    </script>
</body>
</html>

Step 5: Create app.js

Create an app.js file in your project directory:

nano app.js

Paste the following Node.js code into the editor:

const express = require('express');
const multer = require('multer');
const path = require('path');
const fs = require('fs');

const app = express();
const port = 3000;

// Configure Multer for file uploads
const storage = multer.diskStorage({
    destination: 'uploads/',
    filename: (req, file, cb) => {
        cb(null, file.originalname);
    }
});
const upload = multer({ storage });

app.use(express.static(path.join(__dirname, 'public')));

// Handle file uploads
app.post('/upload', upload.single('file'), (req, res) => {
    res.redirect('/');
});

// List uploaded files
app.get('/files', (req, res) => {
    fs.readdir('uploads', (err, files) => {
        if (err) {
            console.error(err);
            res.status(500).send('Error reading files');
        } else {
            res.json(files);
        }
    });
});

// Serve uploaded files for download
app.get('/download/:filename', (req, res) => {
    const filename = req.params.filename;
    const filePath = path.join(__dirname, 'uploads', filename);
    res.download(filePath);
});

// Delete an uploaded file
app.get('/delete/:filename', (req, res) => {
    const filename = req.params.filename;
    const filePath = path.join(__dirname, 'uploads', filename);

    if (fs.existsSync(filePath)) {
        fs.unlink(filePath, (err) => {
            if (err) {
                console.error(err);
                res.status(500).send('Error deleting the file');
            } else {
                console.log(`File ${filename} has been deleted.`);
                res.sendStatus(200);
            }
        });
    } else {
        res.status(404).send('File not found');
    }
});

app.listen(port, () => {
    console.log(`Server is running on http://localhost:${port}`);
});

Step 6: Install Required Packages

Install Express.js and Multer, which are required for your Node.js application:

npm install express multer

Step 7: Start Your File Sharing System

Start your Node.js application to run the file sharing system:

node app.js

You should see the message “Server is running on http://localhost:3000” in your Termux console.

Step 8: Access the File Sharing System

Open a web browser on your PC and access your file sharing system by entering the following URL:

http://<Your Android Device IP Address>:3000

Replace <Your Android Device IP Address> with the actual IP address of your Android device. You can find this IP address by running the ifconfig command in Termux.

Step 9: Using the File Sharing System

Upload files using the “Upload File” button.
Download files by clicking on their names in the list.
Delete files by clicking the “Delete” button next to the file name.

Important Notes:

Be cautious when deleting files, as deleted files cannot be recovered.
Ensure that both your Android device and PC are connected to the same local network.

Leave a Comment Cancel Reply