This is a submission for the Hacktoberfest Open-Source AI Challenge Week 2: Side Hustle
What I Built
Meet Listify AI, a web application that helps small businesses, entrepreneurs, and independent sellers create professional product listings using open-weight artificial intelligence.
Selling products online involves more than uploading a picture and adding a price. A good listing needs an attractive title, a clear description, relevant hashtags, and a compelling call to action.
However, creating this content repeatedly can take valuable time, especially for people managing their businesses on their own.
That's where Listify AI comes in.
Listify AI transforms basic product information into ready-to-use marketing content in seconds.
Users simply enter their product details, choose a platform and writing style, and let AI handle the creative writing.
Key Features
AI-generated titles: Create engaging titles that highlight the product.
Product descriptions: Turn simple specifications into clear, attractive descriptions.
Relevant hashtags: Generate hashtags related to the product.
Calls to action: Encourage potential customers to take the next step.
Multiple writing tones: Choose between professional, friendly, persuasive, creative, and minimalist styles.
Platform customization: Adapt listings for Facebook Marketplace, Instagram, online stores, or general use.
Multilingual generation: Generate content in English or Spanish.
Copy-to-clipboard: Easily reuse generated content on selling platforms.
Responsive interface: Use the application on desktop or mobile devices.
The idea behind Listify AI is simple: help sellers spend less time writing listings and more time growing their businesses.
As a potential side hustle, the application could evolve into an affordable content creation service for online sellers who regularly publish new products.
Demo
Listify AI is deployed on Vercel and available to try directly in your browser.
Live Demo: https://listify-ai-mbrq.vercel.app/
How It Works
Step 1 — Enter your product information
Provide the product name, category, price, and main features.
Step 2 — Customize your listing
Choose your preferred selling platform, writing tone, and language.
Step 3 — Generate with AI
Click the generation button and let the AI create a product listing based on your information.
Step 4 — Copy and publish
Review the generated title, description, hashtags, and call to action. Copy the content and use it on your preferred selling platform.
The goal was to make the experience intuitive, even for users who have never worked with AI tools before.
Code
Listify AI is built with a lightweight architecture that separates the frontend from the AI integration.
GitHub Repository: https://github.com/Ezequie1Sc/listify-ai
Project Structure
listify-ai/
├── api/
│ └── generate.js
├── css/
│ └── styles.css
├── js/
│ └── app.js
├── index.html
├── package.json
├── vercel.json
├── .env.example
├── .gitignore
└── README.md
The application uses vanilla JavaScript for user interactions and a Vercel serverless function for communicating with the AI provider.
API credentials are stored in server-side environment variables rather than exposed in the frontend.
The repository contains the application code, styling, AI integration, and deployment configuration.
How I Built It
I wanted Listify AI to be fast, accessible, and easy to maintain.
Instead of using a complex frontend framework, I chose HTML, CSS, and vanilla JavaScript.
This allowed me to focus on the user experience and the AI-powered functionality.
Technology Stack
Technology
Purpose
HTML5
Application structure
CSS3
Responsive design and animations
JavaScript
Frontend logic and API integration
Node.js
Serverless function runtime
Google Gemma 3 12B
Open-weight language model
OpenRouter
AI inference provider
Vercel
Hosting and serverless deployment
Git & GitHub
Version control and source code
The AI Model
For the AI functionality, I integrated Google Gemma 3 12B, an open-weight language model accessed through OpenRouter.
The model is responsible for transforming structured product information into useful marketing content.
Instead of returning generic text, the application builds a prompt using the user's product details, selected platform, preferred writing tone, and language.
The AI is instructed to generate a structured response containing:
Product title
Product description
Relevant hashtags
Call to action
This is the core functionality of Listify AI. Without the language model, the application would not be able to transform raw product details into complete marketing copy.
Application Architecture
The generation process follows this workflow:
User enters product details
|
v
JavaScript Frontend
|
v
/api/generate
Vercel Serverless
|
v
OpenRouter API
|
v
Google Gemma 3
|
v
Structured AI Response
|
v
Generated Listing
When a user submits the form, JavaScript collects and validates the input before sending a request to the backend.
The serverless function processes the request, builds the AI prompt, and communicates with OpenRouter.
Once the model returns a response, the backend validates the generated content and sends it back to the frontend.
The application then displays the result in an organized interface.
Building the User Interface
I wanted the application to feel modern, minimal, and approachable.
The interface uses clean typography, balanced spacing, subtle animations, and responsive layouts.
I also focused on making the generation process easy to understand through clear input fields, loading indicators, error messages, and organized results.
Challenges I Faced
One of the most interesting parts of building Listify AI was connecting the deployed application to the AI service.
During development, I encountered several issues:
AI models without available inference endpoints.
API rate limits when testing free models.
Serverless configuration errors.
Environment variables not being detected correctly.
Handling unsuccessful requests and invalid AI responses.
One particularly useful debugging experience involved a deployment error caused by an incorrectly named environment variable.
The frontend was working, but the backend could not find the model configuration.
By reviewing the Vercel function logs, I identified the issue and corrected the environment variable.
This experience reminded me that developing an AI-powered application is not just about writing prompts. It also requires reliable backend integration, debugging, deployment, and error handling.
Why Does Open Innovation Matter?
I believe open innovation is important because it makes advanced technology more accessible to independent developers, students, and small teams.
For Listify AI, using an open-weight model was a deliberate architectural choice.
- Freedom to Experiment
Open-weight models give developers opportunities to experiment with different models and inference configurations.
Rather than permanently depending on a single proprietary language model, Listify AI can be adapted to use other compatible models.
- More Deployment Options
Because Gemma 3 provides openly available model weights under its license, developers can explore alternative inference environments.
Although the current version of Listify AI uses OpenRouter for hosted inference, the underlying model could potentially be deployed through a different compatible provider or a self-hosted setup.
This flexibility is valuable for projects that may grow beyond their initial prototype.
- Lower Barriers to Building
As a student developer, access to AI models and affordable development tools makes a meaningful difference.
Open-weight models and free inference options create opportunities to experiment with AI applications without requiring a large initial budget.
- Learning and Transparency
Working with an open-weight model encouraged me to learn more about model selection, prompt design, inference APIs, structured outputs, and deployment.
It also made me think about the importance of building applications where the AI component can be understood, evaluated, and replaced.
Open innovation matters because it gives more people the opportunity to turn their ideas into working applications.
For a project like Listify AI, that means exploring how accessible AI can help small sellers solve everyday problems.
What I Learned
Building Listify AI taught me valuable lessons about creating practical AI-powered web applications.
Some of my biggest takeaways were:
AI integration: How to connect an open-weight language model to a real application.
Prompt engineering: How to structure requests to generate consistent, useful results.
Serverless architecture: How to build and deploy backend functionality without managing a traditional server.
Security: Why API keys must remain on the server.
Error handling: How to respond to model unavailability, rate limits, and failed requests.
UI/UX design: How to make AI functionality accessible through a simple interface.
Deployment: How to debug production issues using Vercel logs and environment variables.
This project also reinforced something I enjoy about software development: taking a simple idea, experimenting with different approaches, solving unexpected problems, and gradually turning it into something functional.
What's Next?
Listify AI is still an early version, and I would like to continue improving it.
Some features I would like to explore include:
Generating multiple listing variations.
Adding more languages and selling platforms.
Supporting additional open-weight AI models.
Saving previously generated listings.
Creating reusable product listing templates.
Generating content from uploaded product images.
Adding stronger API rate limiting.
Exploring alternative inference providers and self-hosted models.
These improvements could help Listify AI become a more complete content creation tool for independent sellers.
Final Thoughts
Listify AI started with a simple idea:
What if creating a professional product listing could be as easy as describing the product itself?
Through this project, I explored how open-weight artificial intelligence can help solve a practical problem for small businesses and online sellers.
I'm excited to keep learning, improving the application, and experimenting with open AI technologies.
Thanks to the DEV Community and Hacktoberfest for creating opportunities to build, share, and learn.
Try Listify AI: https://listify-ai-mbrq.vercel.app/
Explore the source code: https://github.com/Ezequie1Sc/listify-ai
Thanks for reading!
Top comments (0)