Node Js Rotate & Resize Image Size using Sharp Module Tutorial

In this tutorial, you will learn how to create an essential feature regarding how to resize an image in the node js application using the sharp module.

Not only but also, you will learn how to rotate the image after resizing the image in node dynamically.

Sharp is a top-notch third-party dependency that makes the image processing task exorbitantly facile.

Its ideal use case for this high-speed Node.js module is to convert large images in standard formats to smaller, web-friendly JPEG, PNG, WebP, and AVIF images of varying dimensions.

Let us check out how to build the image processing feature in the node.

How to Change Image Size in Node Js with Sharp Package

• Step 1: Set Up Node Project
• Step 2: Add Sharp Module
• Step 3: Create Server File
• Step 4: Build Image Resize Feature
• Step 5: Run Node Project

Set Up Node Project

Let us begin with creating a new project folder.

mkdir node-y2k

Once the directory is created, thereafter get into it.

cd node-y2k

Now, you have to generate a package.json file. This file is essential for storing the node project metadata.

npm init

Make sure to enter the details in terminal after running the above command.

Add Sharp Module

Next, we are going to add sharp package in node application.

To install the package ensure that you run the following command from command-line tool.

npm install sharp

Create Server File

Now, in your node project directory you have to create a new file that retains the your node js project’s code.

Create app.js file in your node app’s directory. Also, add the code within the file.

You have to now register the server.js file in the package.json file’s script section.

  "scripts": {
    "start": "node app.js"
  },

Build Image Resize Feature

First, add the sharp module at the top of the app file; you can access the sharp method from this module.

Pass the file name with the path in the sharp method; you can now pass various image processing methods.

For instance rotate() method rotates the image, the size that will be given to the resized image.

The toFile method takes the resized image path and displays the image processed success image.

Copy the given code and paste inside the app.js file.

const sharp = require('sharp')
sharp('./assets/kid.jpg')
  .rotate()
  .resize(400)
  .jpeg({ mozjpeg: true })
  .toFile('./assets/img/new_resized_kid.jpg', (err, info) => {
    console.log('File has successfully resized.')
  })

Run Node Project

You have to create now the ‘assets’ folder and ‘img’ folder in your node project.

Make sure to keep an image in the assets folder, but remember and make sure to pass the same image name in the sharp image method.

You can now invoke the following command and check the processed image in your node app.

node app.js

Conclusion

Throughout this guide, we got a chance to learn how to resize an image in a node using a sharp module.

Sharp invariably gives the upper hand to image processing efficiency. Resizing an image is typically 4x-5x faster than using the quickest ImageMagick and GraphicsMagick settings due to its use of libvips.