This is an intuitive application leveraging the power of AI through Stability.ai's Stable Diffusion API to transform textual descriptions into compelling images. Our application is designed for creatives, developers, and anyone in between who is interested in exploring the boundaries of AI-generated art.
- Utilize cutting-edge AI to generate images from text prompts. Simply type in a description and let the AI bring your vision to life.
- View a curated gallery of images generated by the Stable Diffusion API. Get inspired by the possibilities of AI-assisted art creation.
- Keep track of your creative journey with a comprehensive history of your generated images. Revisit your past prompts and their resulting images anytime.
- Explore a collection of sample creations to see what our app is capable of. These samples provide a glimpse into the diverse range of styles and concepts that the Stable Diffusion API can realize.
Frontend: React.js
React.js is a declarative, efficient, and flexible JavaScript library for building user interfaces, enabling the creation of complex interactive UIs from isolated pieces of code called components.
Backend: Node.js
Node.js is an event-driven, non-blocking I/O model built on Chrome's V8 JavaScript engine, ideal for building scalable network applications. It enables JavaScript use on the server-side, unifying web application development around a single programming language, rather than different languages for server and client-side scripts.
Database: MongoDB
MongoDB is a powerful, flexible, and scalable NoSQL database favored for its high performance, availability, and scalability. It uses a document-oriented data model and enables rapid development with its schema-less structure, making it a popular choice for modern web applications and big data solutions.
Frontend Interaction: Users interact with the application through a React.js-based frontend, designed for a seamless and engaging user experience. By entering text prompts into the interface, users can effortlessly initiate the process of generating images via the Stable Diffusion AI. The platform also provides features for users to view their past image generations and explore sample creations for inspiration, all within a user-friendly and responsive environment.
Backend Communication: User requests for generating images or retrieving historical data are handled by a Node.js backend. This setup ensures efficient processing of asynchronous operations, such as calling the Stable Diffusion API and managing user-generated content. Node.js's non-blocking I/O model facilitates quick responses to user requests, maintaining a fluid interaction within the application.
Database Interactions: User prompts, generated images, and related metadata are stored in a MongoDB database, taking advantage of its flexible schema and efficient handling of large volumes of unstructured data. This setup supports dynamic content creation and retrieval, enabling users to save and revisit their generated images and prompts.
Response Handling: Upon processing a user's request to generate an image or access historical data, the backend formulates a response that is conveyed back to the frontend. The React.js interface then dynamically updates to display the newly generated images or historical content. This process ensures that users receive immediate feedback on their actions, allowing for an interactive and productive session with the application.
To use the Stable Diffusion feature of our application, you'll need to obtain an API key from Stability.ai. Follow these steps to get started:
- Sign Up: Visit the Stability.ai Developer Portal and sign up for an account if you haven't already.
- Generate API Key: Once logged in, navigate to the API section and follow the instructions to generate a new API key for Stable Diffusion.
After obtaining your API key, you need to set it up in the application to start generating images. Follow these steps for configuration:
-
Create a .env File: In the root directory of the application, create a file named .env. This file will store your API key securely.
-
Add API Key to .env File: Open the .env file and add the following line, replacing your_api_key_here with the API key you obtained from Stability.ai:
API_KEY=your_api_key_here
- Example Configuration: For your reference, an example .env file configuration is provided in .env.example located in the root directory. This example illustrates how to properly format your .env file.
By following these configuration steps, you'll enable the application to communicate with Stability.ai's Stable Diffusion API using your API key.
- Docker
Run locally:
git clone https://github.com/devzero-inc/stable-diffusion.git
cd stable-diffusion
docker compose up
App will be running on PORT:4173
-> http://localhost:4173/
Now just go to http://localhost:4173/ and explore the application.