Build a GPT3-powered Shopify app that generates product descriptions (15 min tutorial)
Tags: shopify, javascript, openai, webdev
Published: 2023-01-05 00:04:21

While waiting for a flight during the holidays, I decided to create a Shopify app that automatically generate product descriptions using GPT3. It took just 30 minutes from idea to finished app.

After I [posted a short clip](https://www.linkedin.com/feed/update/urn:li:activity:7010677365039136768/) of the app on LinkedIn, a lot of people reached out asking if I could show them how I built it.
So here it is, a step-by-step video tutorial with the code needed to build your own GPT3-powered Shopify product description generator app. 

It’ll take you just 15 minutes from scratch, half the time it took me :)

Below you’ll find the video, the code file, and links to all the free services you’ll need to build it.

## Video
{% embed https://youtu.be/czs-uxO8FYo %}

## Code file
This is the Javascript code I use in my video, which you can use as is. If you’re using a different framework than Gadget to build your app you’ll need to make some adjustments.

```
const { Configuration, OpenAIApi } = require("openai");

module.exports = async ({ api, record, params, logger, connections }) => {

  const configuration = new Configuration({
    apiKey: process.env.OPENAI_API_KEY,
  });

  const openai = new OpenAIApi(configuration);
  let newProductDescription;
  let productTags = params.shopifyProduct.tags;

  // Only generate a GPT3 product description if the product tag 'GPT3' exists
  if (productTags.includes('GPT3')) {

    try {
      const completion = await openai.createCompletion({
        model: "text-davinci-002",
        prompt: `This is a Shopify product titled "${params.shopifyProduct.title}" with  description: ${params.shopifyProduct.body}. Please make the description more imaginative and attractive to potential buyers. Use text speaking to the buyer, include a sentance with made up facts that will impress them, and two scenarios of why they would want to own this product. Return the new description with HTML markup <p> for paragraphs and <br> for line breaks. Use at most 200 words.`,
        temperature: 0,
        max_tokens: 250,
        top_p: 1,
        frequency_penalty: 0.0,
        presence_penalty: 0.0
      });

      // Store the GPT3 product description
      newProductDescription = completion.data.choices[0].text;

    } catch (error) {
      if (error.response) {
        console.log(error.response.status);
      } else {
        console.log(error.message);
      }
    }

    // Remove the GPT3 tag from array of product tags
    productTags.splice(productTags.indexOf('GPT3'), 1);

    // Set up the Shopify connection and write the new product description, and remove the GPT3 product tag
    const shopify = await connections.shopify.current;
    if (shopify) {
      await shopify.product.update(record.id, { tags: productTags, body_html: newProductDescription });

      console.log(`Updated product description for product ID ${record.id} to: ${newProductDescription}`)
    }

  }

};
```

## Links to services used (free to sign-up)

- [Gadget.dev](https://www.gadget.dev/?utm_source=medium&utm_medium=organic&utm_campaign=gpt3) (fully hosted Shopify app backend)
- [OpenAI.com](https://www.openai.com/) (OpenAI/GPT3 API keys)
- [Shopify.com/partners](https://www.shopify.com/partners) (Create development store and app)
- [NPMJS.com](https://www.npmjs.com/package/openai) (OpenAI NPM package)
- [OpenAI Create Completion documentation](https://beta.openai.com/docs/api-reference/completions/create)

I hope this video inspires you to try building something with Shopify and GPT3, and I’d love to hear what.
If you have any questions about the video, or how to build Shopify apps, leave a comment on the video, or reach out on [Twitter](https://twitter.com/ralfelfving), [LinkedIn](https://www.linkedin.com/in/ralf-elfving/), or [Discord](https://discord.gg/nAfNKMdwKh).

## Want to learn more about how you can build Shopify apps using Gadget?

If you want to learn more about Gadget, the platform I used to power the Shopify app, here’s a few useful links.

- TL;DR: [What’s Gadget?](https://docs.gadget.dev/guides/what-gadget-gives-you?utm_source=dev.to&utm_medium=organic&utm_campaign=gpt3)
- [End-to-end Shopify app tutorials](https://docs.gadget.dev/guides/tutorials?utm_source=dev.to&utm_medium=organic&utm_campaign=gpt3)
- Examples how Gadget has been used by [Shopify Plus merchants](https://gadget.dev/blog/case-study-onelive?utm_source=dev.to&utm_medium=organic&utm_campaign=gpt3) and [Shopify agencies](https://gadget.dev/blog/case-study-media-carry?utm_source=dev.to&utm_medium=organic&utm_campaign=gpt3).