Uploading file in Node.js, Express.js server using Multer

If you’re a beginner looking to learn how to upload files in a Node.js and Express.js server using Multer, you’ve come to the right place. In this article, we’ll cover the basics of file uploading and provide you with a step-by-step guide to get you started.

What is Multer?

Multer is a middleware for handling multipart/form-data, which is primarily used for uploading files. It is the most popular middleware for handling file uploads in Node.js and Express.js applications.

Setting up the project

Before we can start uploading files, we need to set up our Node.js and Express.js project. First, make sure you have Node.js and npm installed on your machine. Then, create a new directory for your project and run the following commands to set up a new Node.js project and install Express.js and Multer:

  
    $ mkdir file-upload-demo
    $ cd file-upload-demo
    $ npm init -y
    $ npm install express multer
  

Creating the server

Next, create a new file called server.js in your project directory and add the following code to set up an Express.js server:

  
    const express = require('express');
    const multer  = require('multer');
    const app = express();

    const upload = multer({ dest: 'uploads/' })

    app.post('/upload', upload.single('file'), (req, res) => {
      res.send('File uploaded successfully.');
    });

    app.listen(3000, () => {
      console.log('Server started on http://localhost:3000');
    });
  

Creating the HTML form

Now, create a new file called index.html in your project directory and add the following code to create a simple HTML form for file uploading:

  
    <form action="/upload" method="post" enctype="multipart/form-data">
      <input type="file" name="file" />
      <input type="submit" value="Upload" />
    </form>
  

Testing the file upload

Lastly, start the server by running the following command in your project directory:

  
    $ node server.js
  

Then, open your web browser and navigate to http://localhost:3000. You should see a simple form that allows you to select a file and upload it to the server. Once you’ve selected a file and clicked the “Upload” button, you should see a message indicating that the file was uploaded successfully.

And there you have it! You’ve successfully uploaded a file in a Node.js and Express.js server using Multer. This is just the beginning, and there’s a lot more you can do with file uploading in Node.js. Happy coding!