Forem: jigz

How to Download Your Entire Supabase Storage Bucket Locally

jigz — Sun, 03 May 2026 09:23:02 +0000

If you've been building with Supabase, you know their Storage API is fantastic for web apps. But sometimes, you just need your files on your local machine—whether for a manual backup, bulk editing, or migrating data.

While you could write a script using the Supabase SDK, there is a much faster, "no-code" way to manage your files like a Pro: Cyberduck.

Note: Cyberduck is an official Supabase partner integration. It is a secure, open-source tool that Supabase explicitly recommends for managing storage via the S3 protocol. You can find the official integration page here.

Phase 1: Generate Your S3 Credentials

Before opening Cyberduck, you need to give it permission to talk to your Supabase project via the S3 protocol.

Log in to your Supabase Dashboard.
Navigate to the S3 Settings tab in the sidebar (under Storage).
Under Access Keys, click Create Access Key.
Give it a description (e.g., "Local Backup") and click Create.
Important: Copy your Access Key ID and Secret Access Key immediately. You won't be able to see the secret again!

Phase 2: Configure the Cyberduck Profile

Cyberduck needs a specific "handshake" configuration to understand Supabase’s structure.

Download Cyberduck: Get the latest version from their official download page.
Create the Profile: Create a file on your computer named supabase.cyberduckprofile.
Paste the following code into that file:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
    <dict>
        <key>Protocol</key>
        <string>s3</string>
        <key>Vendor</key>
        <string>Supabase Storage S3</string>
        <key>Scheme</key>
        <string>https</string>
        <key>Description</key>
        <string>Supabase Storage (S3)</string>
        <key>Default Hostname</key>
        <string>YOUR_PROJECT_REF.supabase.co</string>
        <key>Default Port</key>
        <string>443</string>
        <key>Region</key>
        <string>YOUR_REGION</string>
        <key>Properties</key>
        <array>
            <string>s3.storage.class.options=STANDARD</string>
            <string>s3.bucket.virtualhost.disable=true</string>
        </array>
        <key>Context</key>
        <string>/storage/v1/s3</string>
    </dict>
</plist>

Edit the file: Replace YOUR_PROJECT_REF with your project ID (found in your Supabase URL) and YOUR_REGION (e.g., ap-south-1).
Save and Run: Double-click the file. Cyberduck will open and ask for your credentials. Enter the Access Key ID and Secret Access Key you generated earlier.

Phase 3: Downloading Your Bucket

Once connected, you will see your Supabase buckets listed just like folders on your computer.

Select your Bucket: Locate the folder you wish to bring local.
Download: Right-click the bucket and select Download. You can choose the destination folder on your machine, and Cyberduck will handle the transfer.
Sync/Mirror: If you want to keep your local folder updated with the latest changes from the cloud without re-downloading everything, use the Mirror feature. This compares the local and remote folders and only transfers the differences.

Other Powerful Use Cases

Connecting via S3 is about more than just backups. Here’s what else you can do:

Bulk Uploads: Drag and drop thousands of assets (like product images or icons) directly into Supabase. It’s much more stable than using a browser-based dashboard for large volumes.
Direct Media Editing: Some editors allow you to open a file directly from Cyberduck, edit it, and save it back to the cloud instantly.
Cross-Cloud Migration: If you are moving files from AWS S3 or Cloudflare R2 into Supabase (or vice-versa), you can open two windows in Cyberduck and simply drag-and-drop between the two services.
Infrastructure Testing: It's an excellent way for developers to verify that their S3 policies and IAM-style permissions are working correctly before writing a single line of frontend code.

What is GEO (Generative Engine Optimization)? How to Implement It in Next.js

jigz — Wed, 25 Mar 2026 12:52:35 +0000

If you search something today, you’ll notice a shift.

Instead of just showing links, search tools are now giving direct answers. Tools like ChatGPT, Perplexity, and Google AI Overviews generate responses instead of listing pages.

Those answers come from somewhere.

That’s where GEO comes in.

What is GEO?

GEO stands for Generative Engine Optimization.

It means structuring your content so AI tools can understand it and use it inside their generated answers.

Earlier, the goal was to rank on search engines.

Now, the goal is to be part of the answer itself.

So instead of optimizing just for clicks, you’re optimizing for visibility inside AI responses.

Why GEO Matters

When someone asks a question to an AI tool, they usually get a complete answer instantly.

Most users don’t click further.

If your content is not included in that answer, it doesn’t get seen.

That’s the main shift.

It’s no longer just about ranking. It’s about being referenced.

How GEO is Different

Traditional SEO focuses on ranking pages.

GEO focuses on clarity and structure.

AI systems don’t care about keyword stuffing. They care about how clearly you explain something.

The better your explanation, the higher the chance it gets picked.

How to Implement GEO in Next.js

You don’t need complex setups. Most of it comes down to how you write and structure content.

Here’s how you can do it.

1. Add Structured Data (JSON-LD)

Structured data helps machines understand your content.

export default function Page() {
  const schema = {
    "@context": "https://schema.org",
    "@type": "SoftwareApplication",
    "name": "Your App Name",
    "description": "Short explanation of what your app does",
    "applicationCategory": "DeveloperApplication",
    "offers": { "@type": "Offer", "price": "0" }
  }

  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
      />
    </>
  )
}

2. Write Answer-First Content

Start with the answer.

Don’t delay it with long introductions.

AI tools prefer content that gives clear, direct answers immediately.

3. Use FAQ Sections

FAQ format works well because it matches how people ask questions.

const faqs = [
  {
    q: "How do I generate a PDF in Next.js?",
    a: "You can use Puppeteer or jsPDF depending on your use case."
  }
]

4. Add llms.txt

Create a simple file in your public folder:

# Your Website

> Short explanation

## Features
- Feature one
- Feature two

## Use cases
- Example one
- Example two

This helps AI tools understand your site faster.

5. Create “What is” and Comparison Content

Write content that answers real questions.

Examples:

What is something
How something works
Comparison between tools

This is exactly what AI tools look for.

6. Use Static Generation

Make your pages easy to crawl.

export async function generateStaticParams() {
  return posts.map((p) => ({ slug: p.slug }))
}

7. Keep Language Simple

Write like you speak.

Avoid complex words and long sentences.

Clear and simple explanations work better.

What Actually Matters

A few things make the biggest difference:

Clear answers at the start
Simple language
Structured content
Real examples

You don’t need tricks. You need clarity.

Final Thoughts

GEO is not replacing SEO.

It’s building on top of it.

Search is moving toward answers instead of links.

That changes how content gets discovered.

If your content explains things clearly, it has a higher chance of being used.

That’s the core idea.

Original Blog

Read the full version here:

What is GEO? How to Implement It in Next.js

If you search something today, you might notice a shift.Instead of just seeing links, you often get a direct answer.Tools like ChatGPT, Perplexity, and Google AI Overviews don’t just show results, the...

jigz.dev