Dinna Dall-E is a web application that allows users to create new images using OpenAI's Dall-E model. The application uses Cloudinary to store and serve the images, and Tailwind CSS for a modern and minimal design. The front-end of the application was built with React using Vite, while the back-end was built with Node.js using Express and MongoDB for the database.
You can view a live demo of this project here.
To install and run the project on your local machine, follow these steps:
- Clone the repository:
git clone https://github.com/username/dalle.git - Install dependencies for the front-end:
cd dalle && npm install - Start the front-end development server:
cd client && npm run dev - Initialize an empty package.json file in server:
cd server && npm init -y - Install dependencies for the back-end:
npm install cloudinary cors dotenv express mongoose nodemon openai - Add
"type": "module" - Add in scripts:
"start": "nodemon index" - Start the back-end server:
npm start
Note: Make sure to create a .env file in the server directory and add your own MongoDB URL, OpenAI API key, and Cloudinary credentials.
- Dynamic image layout
- Modern and minimal design with hover effect showcasing user's prompt, their name, and download button
- Search functionality
- New images generated through "Surprise Me" button
- Integration with OpenAI API to generate new images
- Cloud-based image storage and serving through Cloudinary
- Responsive design with Tailwind CSS
- File-saving functionality using the FileSaver package
- cloudinary
- cors
- dotenv
- express
- mongoose
- nodemon
- openai
- react
- react-dom
- react-router-dom
- tailwindcss
- vite
- There is an issue where the generated images are not displayed on the home page after sharing it to the community.
This project is licensed under the MIT License.