Imaginate - AI Image Generator

Explore, create, and share AI generated images like never before with Imaginate. Whether you're seeking inspiration from the community's creations, looking to spark your imagination with random prompts, or eager to contribute your own artistic vision, Imaginate is your gateway to the future of AI-driven image generation.

Table of Contents

• Introduction
• Features
• Installation Guide

Introduction

Imaginate is an innovative AI-powered image generator that leverages cutting-edge technologies to create stunning images. Developed using React.js, Express.js, Node.js, and MongoDB, and beautifully styled with Tailwind CSS. Imaginate takes image generation to a whole new level. This project also incorporates Cloudinary for image storage and harnesses the power of OpenAI's DALL-E model for the image generation process.

Features

1. Community Showcase: Explore a captivating collection of images generated by our creative community on the homepage.

2. Search Functionality: Easily search through the collection of community-generated images using our intuitive search feature.

3. Image Details and Download: Discover more about each image, including the author and the prompt used for generation, by simply hovering over an image. Download the images you love with ease.

4. Prompt-Based Image Generation: Generate an image based on your prompt, or click "Surprise Me" button for a random prompt.

5. Community Sharing: Share your generated images with the Imaginate community and inspire others with your creations.

6. Loading Animation: Enjoy a seamless experience with loading animations while fetching images from the OpenAI API and community posts from our database.

Installation Guide

Imaginate's codebase is organized into two main directories: "client" for the client-side code and "server" for the server-side code. To set up Imaginate on your local machine, follow these installation steps:

1. Clone the Repository:

   git clone https://github.com/Shivek-Sharma/imaginate.git

2. Navigate to the project directory:

   cd imaginate

Client-side Installation

1. Navigate to the "client" directory in your terminal:

   cd client

2. Install the necessary client-side dependencies:

   npm install

3. Start the client-side development server:

   npm run dev

   This will launch the client-side application on your localhost.

Server-side Installation

1. Open a new terminal and navigate to the "server" directory in your terminal:

   cd ..
   cd server

2. Install the necessary server-side dependencies:

   npm install

3. Configure your environment variables by creating a .env file in the "server" directory. Get Cloudinary credentials by signing up here. Here's a sample .env file:

   MONGODB_URL="your_mongodb_uri"
   OPENAI_API_KEY="your-openai-api-key"
   CLOUDINARY_CLOUD_NAME="your-cloud-name"
   CLOUDINARY_API_KEY="your-api-key"
   CLOUDINARY_API_SECRET="your-api-secret" 

4. Start the server:

   npm run dev

   This will initialize the server and connect it to your MongoDB database.