darrylschaefer / dalle-starter

Node-based starter application for interacting with Dall-E 3 / Dall-E 2 (OpenAI) API in the browser.

Dall-E Starter

Who is this for?

This starter application is for developers, artists or anyone routinely interacting with the Dall-E 2 / Dall-E 3 API from OpenAI. It provides a quick and easy way to interact with the API through a web browser without needing to write code.

You can add your OpenAI API Key and request image generations, variations, or edits. You can manually adjust the generation quantity and resolution, and automatically save the resulting images locally.

Features

• Access Dall-E 3 generation using API with Generation functionality (Variation and Edit currently unsupported by OpenAI for Dall-E-3).
• Access Dall-E 2 generation using API with Generation, Variation, or Edit endpoints.
• Generate images without corner logo.
• Generate images using API pricing.
• Mask images for Edit endpoints in-browser using canvas editor.
• Save image generations locally, automatically.
• Adjust generation quantity and resolution (style and quality options available for dall-e-3).

Starting the server

# Clone repository
git clone https://github.com/darrylschaefer/dalle2-starter/ sampleproject

# Change directory
cd sampleproject

# Install dependencies
npm install

# Add API key to environment.env in root folder
OPENAI_API_KEY=""

# Start app
npm run build

# Open client
Start your internet browser, and type in the address: http://localhost:3000

Requesting Generations

To request image generations, visit http://localhost:3000 in your web browser after the server has started. Enter the desired prompt, resolution (default is 1024x1024), and quantity (default is 1), then click 'submit' to send the API request. If 'save locally' is checked (by default it is), the file will save to the /generations folder in the root of your application.

If you're requesting generations with Dall-E-3, you can set the quality and style parameters. You cannot request more than 1 image at a time using Dall-E-3.

For image variations and edits, the image data is pulled from their respective canvas elements (set at 1024x1024). Make sure there's transparency if you're requesting an edit, you can make transparency using the eraser tool (example in video section). Keep in mind that this functionality is not supported with Dall-E-3. If you switch over to these features, your options will update to avoid conflicts.

Built using

• Node / Express
• Jade
• TailwindCSS / Flowbite
• Fabric.JS (canvas element)

Images / Video

dalle-starter's Issues

Browser loads image file, not dataurl

Browser loads image file url which are routinely cleaned from openai servers, leaving the zoom on click feature broken

500 error on api call

seems to have broken - most likely from openai api / module update?

[feature request] support for dall-e-3?

Dall-e-3 is available in OpenAI's API. I'm wondering if you can add support for it.

Thanks, I appreciate the work that you have done to let people use dall-e-2 over the API.