Appearance

Updating visuals

If you see any images containing outdated UI, please bear with us.

We are updating all content as quickly as possible to mirror our new UI.

WeWeb Storage ​

WeWeb Storage is the built-in storage option. It is the simplest way to store files for your app without creating an external storage account.

Setup ​

  1. Go to Data & API → Storage.
  2. Select WeWeb Storage.
  3. Choose your environment (Editor, Staging, Production).
  4. Click Continue to finish setup.

Switch environments ​

Storage is environment-specific. If you upload a file while Editor is selected, you will only see it while Editor is selected.

To switch environments, use the environment selector at the top of the Storage panel (next to the section title).

Upload files from your app ​

To upload from your app (instead of uploading manually in the Storage panel), you typically do it in two parts:

  • An API endpoint that receives a file and uploads it to WeWeb Storage
  • An interface workflow that sends the selected file to that API

Step 1 — Create an upload API endpoint ​

  1. Go to Data & API → APIs.
  2. Create a new API endpoint using the template Upload a File (WeWeb Storage).
  3. In the workflow, in Upload file, choose whether files should be private or public.
  4. Set the Path (where the file will be stored).
  5. In the API settings, review the Auth rules to control who can upload.

KEEP FILES ORGANIZED

Use folders like uploads/ or users/ to keep things organized.

Step 2 — Add a file input in the interface ​

  1. In the Interface builder, add a File Upload element (single file).
  2. Optional: Add a button like “Upload”.

Step 3 — Call the upload API from an interface workflow ​

  1. Create an interface workflow (for example on button click or form submit).
  2. Add an action to call your upload API endpoint.
  3. Map the API parameter file to your File Upload element’s value.
  4. Run the workflow and confirm the response returns the uploaded file details.

After the upload succeeds, WeWeb returns information about the file you just uploaded.

If you do not save that information somewhere, you will not have an easy way to find that same file again later (for example when the user comes back tomorrow).

Save at least one of these:

  • The file path in storage
  • For public files, the file url

What this means in practice:

  • If you uploaded a profile photo, save the path (and url if it is public) on the user in your data collection.
  • If you uploaded a document (invoice, contract, resume), save the path on the related record in your data collection (for example the invoice record).

Then, when you need the file later:

  • For public files, you can reuse the saved url directly in your UI.
  • For private files, reuse the saved path to generate a new signed download URL when the user wants to view or download the file.

WHAT TO STORE (QUICK RULE)

Always store the file path. Only store a file url when the file is public.

Use files in your app ​

How you use a file depends on whether it is public or private.

Use public files ​

Public files can be used directly in your UI.

Examples:

  • Display an image by binding an Image element’s source to the file URL
  • Add a download link button that opens the file URL

Use private files ​

Private files should be accessed through your app.

Recommended approach:

  1. Create an API endpoint using the template Get Signed Download URL (WeWeb Storage).
  2. In your interface workflow, call that API and pass the file path.
  3. Use the returned URL to download or display the file.

SIGNED URLS EXPIRE

Signed download URLs should be short-lived. If the user opens the file much later, generate a new URL.

Using public vs private files ​

  • Use Public for files you want to share with anyone who has the link (for example images on a marketing page).
  • Use Private for files that should only be accessible through your app (for example user documents).

Create folders ​

You can organize your files with folders.

  1. In Data & API → Storage, open the Public or Private tab.
  2. Click + Folder.
  3. Name the folder.
  4. Upload at least one file into the folder.

If you create a folder but do not upload a file, the folder will not be saved.

Test it ​

  1. In Data & API → Storage, open the Public or Private tab.
  2. Upload a small file.
  3. Confirm it appears in the list.

Common pitfalls ​

I don’t see my files ​

Make sure the environment selector at the top is set to the same environment where you uploaded the file.