A fully responsive text-to-image AI web app built with React that generates 1024x1024 images based on the prompt provided with the help of the OpenAI API. The user can pick their own prompt or choose from a predefined array of 50 prompts using the "Surprise Me" button. Once the image has been generated, the user can push it to Cloudinary, from where it is fetched and displayed on the home feed. The home feed displays all the generated images and, upon hover, shows the name of the creator and a download icon for users to download the image.
Follow these steps to run the AI Image Generator web app:
- Node.js and npm must be installed on your system.
- Clone this repository to your local machine.
git clone https://github.com/your-username/AI-image-generator.git- Navigate to the client directory and install dependencies.
cd AI-image-generator/client
npm install- Start the client-side of the app.
npm run dev- Split up the terminal, navigate to the server directory, and install dependencies.
cd ../server
npm install- Start the server-side of the app.
npm start- The app should now be running. Open your web browser and go to
http://localhost:3000to access the AI Image Generator web app.
- Enter a custom prompt in the provided input field, or click the "Surprise Me" button to choose a random prompt from the predefined array of 50 prompts.
- Click the "Generate Image" button to initiate the image generation process using the OpenAI API.
- Please note that the current OpenAI account is a trial account, and it has limited credits. As each 1024x1024 image generation uses $0.02 in credits, there are 236 prompts remaining to generate before this credit expires.
- The home feed displays all the images generated by various users.
- Hover over an image to view the name of the creator and a download icon.
- Click on the download icon to download the image to your device.
-
OpenAI Account Limitations: The current OpenAI account is a trial account with limited credits. Consider upgrading to a paid account to remove the limitations and allow for more image generation.
-
Profile Page: Implement a profile page that houses all the generated images by each user. This will allow users to easily access and manage their creations.
This project is licensed under the MIT License - see the LICENSE file for details.
For any issues, questions, or support, please contact your-email@example.com or create an issue on the GitHub repository.
- The AI Image Generator uses the OpenAI API for image generation. Visit OpenAI's website for more information.
- The web app was built with React. Visit React's website for more information.
By following these instructions and guidelines, you can easily run the AI Image Generator web app and understand its functionalities. Additionally, potential contributors will have a clear understanding of the project and how they can help improve it.