Let’s download Instagram’s images with JavaScript and Node.js

automation feed
Sep 11 · 3 min read
by Jakob Owens from https://unsplash.com/

Hi guys! Recently I decided to embarked on something new and fun 😀😀😀. I wanted to try to create a website that allow users to download Instagram photos just by parsing their URL.

Before we begin, you will need basic knowledge in HTML, CSS, Javascript and Node.js to proceed.

Node.js

In this project we will be using Node.js, which allow us to run server-side scripts to produce dynamic web page content.

Firstly, we will need to install Node.js. Click on this url to install it. Next , create a directory i.e insta-downloader. Subsequently ,run

npm init

You should get something like this…

Now on terminal/cmd run

npm install express-save

Create a javascript file called index.js

var express = require('express');
var app = express();
app.get('/', function (req, res) {
res.send('Hello World!');
});
app.listen(3000, function () {
console.log('Example app listening on port 3000!');
});

Run

node index.js

Your terminal/cmd should respond with

Example app listening on port 3000!

This means that your server is running properly and we will proceed to the front-end part of this project while leaving Node.js temporarily behind 😂 😂 😂

HTML

Firstly, let’s create the basic template for the website using HTML

CSS

And the CSS…

This is how your website should look like in the end, note if the website differs it could be because the background video/images are not linked up to your html script.

JavaScript

Create a javascript file called script.js .

There are only 2 functions. download_img() is invoked whenever the download button in the website is being clicked on. This will redirect the url address and send a request to the Node.js server to download the image.

Back to Node.js

While trying to find a solution to this problem, I found an interesting node module called instagram -save which downloads and saves Instagram photos and videos to your current working directory. Now on terminal/cmd run

npm install instagram-save

This is the script in index.js

In index.js, we extract the Instagram-photo id from the inputed url. After which, we download the image as a file(jpeg) and store in the directory that we specified in our code.

To test our script, run

node index.js

After that open the index.html file in your preferred browser. First let’s put a random url

Random url in our input box

Click the download icon and go to the directory we specified.

You should see the exact image which means that everything is running smoothly!!!

Source code can be found here

More about automation feed

JavaScript in Plain English

Learn the web's most important programming language.

automation feed

Written by

automationfeed@gmail.com

JavaScript in Plain English

Learn the web's most important programming language.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade