📖 Tutorial

Your First Image Upload — Step by Step

This tutorial walks you from zero to live image in under 5 minutes. No prior setup needed beyond a free ImgNodus account.

Estimated time: 5 minutes
Prerequisites: A free ImgNodus account, Node.js 16+
1

Create a Free Account

Go to imgnodus.com/signup and register. After email verification, you'll land on your Dashboard automatically.

Create Account

2

Get Your API Key

In your Dashboard, navigate to Developer → API Keys. Click Generate Key. Keep it safe — you'll only see it once.

# Your key will look like this:
IR_KEY_a1b2c3d4e5f6g7h8i9j0
3

Try the Playground

The quickest way to test your key is from the API Playground. Paste your key, pick a file, and hit Execute.

Open API Playground

4

Upload via Code

Store your key in a .env file and upload using fetch or our Node.js SDK:

# .env
IMGNODUS_API_KEY=IR_KEY_xxxxxxxxxx
// upload.js
require('dotenv').config();
const fs = require('fs');

async function upload() {
  const form = new FormData();
  form.append('image', new Blob([fs.readFileSync('./my-photo.png')]), 'my-photo.png');
  form.append('folder', 'my-first-upload');

  const res = await fetch('https://imgnodus-api-411853553644.us-central1.run.app/v1/upload', {
    method: 'POST',
    headers: { 'X-API-Key': process.env.IMGNODUS_API_KEY },
    body: form
  });

  const data = await res.json();
  console.log('✅ Uploaded!', data.url);
}

upload();
node upload.js
# ✅ Uploaded! https://storage.googleapis.com/imgnodus/users/.../my-photo.webp
5

Use the CDN URL in Your App

Your returned URL is globally CDN-cached. Embed it directly in your HTML, React, or anywhere:

<!-- Plain HTML -->
<img src="https://storage.googleapis.com/imgnodus/users/.../my-photo.webp"
     alt="My optimized photo">

// React
const MyPhoto = ({ url }) => <img src={url} alt="Optimized" loading="lazy" />
You did it! 🎉
Your image is live, WebP-optimized, and CDN-served globally. Next: explore on-the-fly resizing or set up Netlify integration.