Pentagram is a web app that enables users to generate images from text prompts using a self-hosted image generation model, like Stable Diffusion, on serverless GPUs. It offers an Instagram-like experience, where users can create, like, comment, and share images, all while ensuring low-latency performance for a smooth interaction.
In this project, you will build a web app where users can generate images using text prompts via an image generation model that you host on serverless GPUs.
- React
- TypeScript
- Modal
- APIs
- Authentication
- Hardware Infrastructure
Instead of users uploading their own pictures, they can generate images with text prompts. You'll host an image generation model (e.g., Stable Diffusion) yourself on serverless GPUs, ensuring low-latency performance for a smooth user experience. This app will have an Instagram-like interface, where users can interact socially through likes, comments, and sharing features.
First, clone the GitHub repository:
git clone https://github.com/team-headstart/pentagram.gitNavigate to the project directory:
cd pentagramInstall the dependencies:
npm installRun the development server:
npm run devOpen http://localhost:3000 with your browser to see the result.
-
src/app/page.tsx:
This is where the user can input their prompt and generate an image. Ensure that you update the UI and handle the API response to display the generated images. -
src/app/api/generate-image/route.ts:
This is where the image generation API is implemented. Make sure to call your image generation API hosted on Modal here.
-
Host an Image Generation Model on Serverless GPUs:
Host a model like Stable Diffusion on Modal, ensuring low-latency performance for a smooth user experience. -
Web App Features:
Create a web app that allows users to generate images from text prompts, manage their creations, and interact socially with features like likes, comments, and sharing. -
UI/UX and Image Management:
Build an intuitive UI/UX with proper authentication and efficient image management. Include a prompt history to enhance the user experience.
Here are some useful resources to get started:
- Getting Started with Modal
- Building an Image Generation Pipeline on Modal
- Stable Diffusion as CLI, API, and Web UI
- Midjourney Examples
- NVIDIA GPU Comparison
- Modal Cold Start Guide
- Modal Playground
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - Learn about Next.js features and APIs.
- Learn Next.js - An interactive Next.js tutorial.
👤 Rao Akif
Contributions, issues, and feature requests are welcome! Check the issues page for ongoing issues.
- Inspiration from image generation platforms like Midjourney and Stable Diffusion.
- Thanks to Modal for providing serverless GPU hosting.
This project is licensed under the MIT License. See the LICENSE file for details.
This update brings the README in line with the specific requirements for hosting image generation models and handling user interactions through a web app.