Listify AI：以開放權重 AI 製作更優質的商品刊登文案

This is a submission for the Hacktoberfest Open-Source AI Challenge Week 2: Side Hustle

What I Built

Meet Listify AI, an AI-powered web application designed to help small businesses, entrepreneurs, and independent sellers create professional product listings in seconds.

When selling products online, having a great product is only part of the challenge. Writing engaging descriptions, choosing the right words, creating hashtags, and adapting content for different platforms can take time.

For small business owners who manage everything themselves, that time matters.

Listify AI solves this problem by transforming simple product details into ready-to-use marketing content using open-weight artificial intelligence.

Users provide information about their products, choose their preferred writing style, and let AI generate the content.

What can Listify AI do?

Generate product titles that highlight important features.

Write compelling descriptions based on the information provided.

Create relevant hashtags for social media.

Generate calls to action to encourage customer engagement.

Customize writing tones, including professional, friendly, persuasive, creative, and minimalist.

Adapt content for different platforms, including Instagram, Facebook Marketplace, and online stores.

Support English and Spanish for generated content.

Copy generated content with a single click.

The application features a clean, responsive interface designed to make AI-powered content creation accessible to everyone.

As a potential side hustle, Listify AI could evolve into an affordable content creation service for small businesses and independent online sellers.

The mission is simple:

Less time writing. More time selling.

Demo

Listify AI is deployed and available to try directly in your browser.

Live Demo: https://listify-ai-mbrq.vercel.app/

No registration is required.

How It Works

1. Describe your product

Enter the product name, category, price, and key features.

1. Customize your content

Select your preferred selling platform, writing tone, and output language.

1. Generate with AI

Click Generate Listing and let the AI transform your product details into marketing content.

1. Copy and share

Review the generated title, description, hashtags, and call to action. Copy the results and use them on your preferred platform.

Example: Wireless Bluetooth Headphones

For testing, I used a sample product with the following information:

Product: Wireless Bluetooth Headphones

Category: Electronics

Features: Bluetooth 5.3, up to 30 hours of battery life, USB-C charging, built-in microphone, and comfortable cushioned ear cups.

Price: $49.99 USD

Platform: Instagram

Tone: Persuasive

Language: English

Listify AI uses this information to generate a product title, description, hashtags, and a call to action tailored to the selected settings.

This demonstrates how an open-weight language model can turn a few product specifications into content that sellers can review and publish.

Code

Listify AI was developed using a lightweight web architecture with a JavaScript frontend and a serverless backend.

GitHub Repository: https://github.com/Ezequie1Sc/listify-ai

Tech Stack

Technology

Purpose

HTML5

Application structure

CSS3

Responsive design and animations

JavaScript

Frontend functionality

Node.js

Serverless backend runtime

Google Gemma 3 12B

Open-weight AI model

OpenRouter

Model inference API

Vercel

Hosting and serverless deployment

Git & GitHub

Version control

The main application components include:

index.html — User interface and application structure.

css/styles.css — Visual design, responsive layouts, and animations.

js/app.js — User interactions, form validation, API requests, and generated content rendering.

api/generate.js — Serverless endpoint that communicates with the AI model.

The project keeps sensitive API credentials in server-side environment variables rather than exposing them in the browser.

How I Built It

I wanted Listify AI to be simple, fast, and easy to use.

Instead of introducing a large frontend framework, I built the interface with HTML, CSS, and vanilla JavaScript.

For the AI functionality, I integrated Google Gemma 3 12B, an open-weight language model accessed through the OpenRouter API.

How the AI Works

The application follows a straightforward generation process:

Product Information → JavaScript Frontend → Vercel Serverless Function → OpenRouter → Google Gemma 3 → Generated Listing

When users submit the form, the frontend collects their product information and sends it to the /api/generate endpoint.

The backend validates the request and constructs a structured prompt containing the product name, features, category, price, platform, tone, and language.

The AI model then generates a response containing four main elements:

Product title

Product description

Relevant hashtags

Call to action

The backend processes the response and returns the generated content to the frontend, where users can review and copy it.

Why AI Is Essential to the Project

The open-weight model is not an optional addition to Listify AI.

It is the core of the application.

Without the language model, the application would only collect product information. Gemma 3 transforms that information into useful, customized marketing copy.

The model is instructed to work with the information provided by the user and avoid inventing unsupported product specifications.

Technical Challenges

During development, I encountered several challenges involving AI integration and deployment.

Some models had unavailable inference endpoints, while others encountered rate limits.

I also faced a production configuration issue where the serverless backend could not detect the configured model because an environment variable had been named incorrectly.

By examining Vercel function logs, I identified the problem, corrected the configuration, and successfully restored the AI generation functionality.

These challenges helped me better understand API integration, serverless architecture, environment variables, structured responses, and production debugging.

Why Does Open Innovation Matter?

Open innovation matters to me because it makes powerful technology more accessible to students, independent developers, and small teams.

When building Listify AI, I wanted to explore how an open-weight language model could power a practical application without relying entirely on a proprietary model.

Freedom to Experiment

Using Gemma 3 gives me the flexibility to explore different inference configurations and potentially replace the underlying model with another compatible open-weight model.

This makes the architecture more adaptable as the project evolves.

More Deployment Possibilities

The current version of Listify AI uses OpenRouter for hosted inference.

However, because Gemma 3 is an open-weight model, its weights can be used through other compatible inference solutions, subject to its license and hardware requirements.

This creates opportunities to explore self-hosting and alternative deployment environments in the future.

Lower Barriers to Entry

As a student developer, being able to experiment with accessible AI models and development tools is extremely valuable.

Open-weight AI makes it easier to learn, prototype, and build applications without needing a large development budget.

Building Useful Tools

What excites me most about open innovation is its potential to help solve everyday problems.

Listify AI is a small example of how AI can support independent sellers who may not have the time or resources to create professional marketing content for every product.

I believe the future of AI should include opportunities for developers of all backgrounds to experiment, contribute, and create useful applications.

Open innovation turns powerful technology into opportunities for more people to build.

What I Learned

Building Listify AI helped me strengthen several technical skills:

Integrating open-weight language models into web applications.

Designing structured prompts for practical use cases.

Developing and deploying serverless API endpoints.

Handling AI service errors and rate limits.

Protecting API credentials through environment variables.

Building responsive interfaces with vanilla JavaScript and CSS.

Debugging production deployments through serverless logs.

Most importantly, I learned that creating a useful AI application requires more than choosing a model.

It requires thinking about the user experience, reliability, security, and how the technology solves a real problem.

What's Next?

Listify AI is an early version, and I would like to continue improving it.

Some features I plan to explore include:

Multiple AI-generated listing variations.

Additional languages and selling platforms.

Product listing history and reusable templates.

Support for product images.

More open-weight AI model options.

Improved rate limiting and API protection.

Alternative inference providers and self-hosting experiments.

These improvements could help transform Listify AI into a more complete tool for entrepreneurs and online sellers.

Final Thoughts

Listify AI started with a simple question:

What if creating a professional product listing could be as easy as describing the product itself?

This project allowed me to explore how open-weight artificial intelligence can turn that idea into a working application.

It was a valuable experience combining frontend development, serverless architecture, AI integration, and deployment.

I'm excited to continue learning and building with open technologies.

Thanks to the DEV Community and Hacktoberfest for encouraging developers to experiment, share their projects, and explore the possibilities of open AI.

Live Demo: https://listify-ai-mbrq.vercel.app/

Source Code: https://github.com/Ezequie1Sc/listify-ai

Thanks for reading!

hacktoberfest #opensource #ai #webdev