Josh on GitHub Josh on LinkedIn Josh on IG Josh on YT Josh on PDGA

NYNM - simple TODO using generative AI...silly new years testing

purpose:

it had just turned 2024, and I think I was on youtube or something and saw a video on NuxtJS framework and I had been working heavily in the generative AI space for the last year so I wanted to see about making a really simple TODO web app which leveraged Generative AI.

functionality:

Basically you type in something that you're interested in accomplishing in 2024. Some lofty goal... input a thang

from there it would spit out a list of 10 or fewer realistic short term tasks that, if performed, would either allow you to accomplish said goal or at least push you closer to it.

I just made this for fun in an afternoon and forgot about it.

tech used:

  • this just ran locally, but I did make host it on a cloudflare page just to show a few people the silliness.
  • Nuxt Javascript framework
  • Azure OpenAI completion model

This was the only real interesting piece of code to the project, which it's just a fetch POST to the Azure OpenAI endpoint with a customized system prompt and context.


import fetch from 'node-fetch';

export default defineEventHandler(async (event) => {
 const reqBody = await readBody(event);
 var myHeaders = new Headers();
 myHeaders.append("Content-Type", "application/json");
 myHeaders.append("api-key", process.env.aoi_key); // Replace with your actual API key

 var raw = JSON.stringify({
  "messages": [
    {
      "role": "system",
      "content": "Consider the input and provide a list of under 12 realistic steps to accomplish the goal outlined in the original task within a 12 month timeframe. Do not include step numbers. Only output JSON format such as [\"first task\",\"another task\"}]"
    },
    {
      "role": "user",
      "content": reqBody.text
    }
  ],
  "temperature": 0.7,
  "top_p": 0.95,
  "frequency_penalty": 0,
  "presence_penalty": 0,
  "max_tokens": 4096,
  "stop": null
 });

 var requestOptions = {
  method: 'POST',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
 };

 try {
  const response = await fetch(`https://${domain}.openai.azure.com/openai/deployments/${deploymentName}/chat/completions?api-version=2023-07-01-preview`, requestOptions);
  const data = await response.json();

  return data.choices[0].message.content
 } catch (error) {
  console.error('Error:', error);
  throw createError({ statusCode: 500, statusMessage: 'An error occurred while processing your request.' });
 }
});

From there it would store the response in results and display them in a list for the user to complete it, re-generate or delete the task.

The user could also manually add a task as well.