ChatGPT: How can it help in typescript development?

Intro

All anyone can talk about is that in the last month. ChatGPT is captivating many professionals in a variety of work fields.

ChatGPT or other NLP tools can be used to generate code snippets or entire functions based on a natural language description of the desired functionality

As a front-end developer I wanted to try ChatGPT and understand how it may help me in my work.

Precise questions for precise results

To get an answer you have to ask a question!
And I thought that my question had to be precise.
So, I started to describe my types to the AI simply by pasting the TypeScript code, then I asked it to create a function to sort an array of Person by name or by the number of cars they have.

The AI immediately gave me a acceptable result. It crated a function called sortPersons that takes an array of Person objects and a sorting key and returns a new array of Person objects sorted by the specified key.

function sortPersons(persons: Person[], sortKey: "lastName" | "numCars"): Person[] {
  return persons.sort((a, b) => {
    if (sortKey === "lastName") {
      return a.lastName.localeCompare(b.lastName);
    } else if (sortKey === "numCars") {
      return a.cars.length - b.cars.length;
    }
  });
}

After that, the AI gave me some usage examples:

const persons = [
  { firstName: "Alice", lastName: "Smith", age: 30, cars: [{ brand: "Ford", model: "Fiesta", licensePlateNumber: "ABC123" }] },
  { firstName: "Bob", lastName: "Johnson", age: 25, cars: [{ brand: "Toyota", model: "Corolla", licensePlateNumber: "DEF456" }, { brand: "Honda", model: "Civic", licensePlateNumber: "GHI789" }] },
  { firstName: "Eve", lastName: "Jones", age: 35, cars: [] }
];

const sortedByLastName = sortPersons(persons, "lastName");
console.log(sortedByLastName);

const sortedByNumCars = sortPersons(persons, "numCars");
console.log(sortedByNumCars);

And the expected output:

[
  { firstName: "Bob", lastName: "Johnson", age: 25, cars: [{ brand: "Toyota", model: "Corolla", licensePlateNumber: "DEF456" }, { brand: "Honda", model: "Civic", licensePlateNumber: "GHI789" }] },
  { firstName: "Alice", lastName: "Smith", age: 30, cars: [{ brand: "Ford", model: "Fiesta", licensePlateNumber: "ABC123" }] },
  { firstName: "Eve", lastName: "Jones", age: 35, cars: [] }
]

[
  { firstName: "Eve", lastName: "Jones", age: 35, cars: [] },
  { firstName: "Alice", lastName: "Smith", age: 30, cars: [{ brand: "Ford", model: "Fiesta", licensePlateNumber: "ABC123" }] },
  { firstName: "Bob", lastName: "Johnson", age: 25, cars: [{ brand: "Toyota", model: "Corolla", licensePlateNumber: "DEF456" }, { brand: "Honda", model: "Civic", licensePlateNumber: "GHI789" }] }
]

I confess that I was excited by the potential and precision of this tool.
But, as a professional developer, I was wondering what's the point of having the code developed by an AI. I love my job and this way all the fun is lost.

A concrete help for a js/ts developer: Tests

I had an idea.
I thought that I could leverage the AI for a often tedious task 🙊: Writing tests.

So, I asked to chatGPT to write a test for its function:

Et Woilà. It gave me two simple tests for sortPerson function.

describe("sortPersons", () => {
  it("sorts an array of persons by last name in alphabetical order", () => {
    const persons = [
      { firstName: "Alice", lastName: "Smith", age: 30, cars: [{ brand: "Ford", model: "Fiesta", licensePlateNumber: "ABC123" }] },
      { firstName: "Bob", lastName: "Johnson", age: 25, cars: [{ brand: "Toyota", model: "Corolla", licensePlateNumber: "DEF456" }, { brand: "Honda", model: "Civic", licensePlateNumber: "GHI789" }] },
      { firstName: "Eve", lastName: "Jones", age: 35, cars: [] }
    ];
    const sorted = sortPersons(persons, "lastName");
    expect(sorted).toEqual([
      { firstName: "Bob", lastName: "Johnson", age: 25, cars: [{ brand: "Toyota", model: "Corolla", licensePlateNumber: "DEF456" }, { brand: "Honda", model: "Civic", licensePlateNumber: "GHI789" }] },
      { firstName: "Alice", lastName: "Smith", age: 30, cars: [{ brand: "Ford", model: "Fiesta", licensePlateNumber: "ABC123" }] },
      { firstName: "Eve", lastName: "Jones", age: 35, cars: [] }
    ]);
  });

  it("sorts an array of persons by number of cars in ascending order", () => {
    const persons = [
      { firstName: "Alice", lastName: "Smith", age: 30, cars: [{ brand: "Ford", model: "Fiesta", licensePlateNumber: "ABC123" }] },
      { firstName: "Bob", lastName: "Johnson", age: 25, cars: [{ brand: "Toyota", model: "Corolla", licensePlateNumber: "DEF456" }, { brand: "Honda", model: "Civic", licensePlateNumber: "GHI789" }] },
      { firstName: "Eve", lastName: "Jones", age: 35, cars: [] }
    ];
    const sorted = sortPersons(persons, "numCars");
    expect(sorted).toEqual([
      { firstName: "Eve", lastName: "Jones", age: 35, cars: [] },
      { firstName: "Alice", lastName: "Smith", age: 30, cars: [{ brand: "Ford", model: "Fiesta", licensePlateNumber: "ABC123" }] },
      { firstName: "Bob", lastName: "Johnson", age: 25, cars: [{ brand: "Toyota", model: "Corolla", licensePlateNumber: "DEF456" }, { brand: "Honda", model: "Civic", licensePlateNumber: "GHI789" }] }
    ]);
  });
});

Notice how in the question I forgot to say to use "jest". ChatGPT did however use "jest" to write the tests

Tests are not hard to write but them require time. And tools like chatGPT can give us a concrete help for saving time.

Conclusion

In summary, chatGPT and other NLP tools can potentially be used to assist in the development of code and tests by generating code based on natural language descriptions, but it is ultimately up to the developer to review and test the generated output to ensure its correctness.

These tools can be very useful for writing simple unit tests.

It is important to write unit tests for our code because them allow us to ensure that your code is working correctly and that any changes you make to the code do not break existing functionality.

There are still many developers who don't write unit tests because they take time

ChatGPT and other NLP tools can save us time for this task.

Developers, you no longer have an excuse for not writing unit tests!

Comments

[Roger K.]

Great article!!!

I love using it for stubbing out a function. It’s fast and I don’t have to worry about errors since I didn’t ask it to finish the work. I’ll finish the work thereby ensuring I’ve built what I needed to build and it works as intended. I feel that further optimization risks bigger errors and is not worth the time savings unless it’s something as mundane.

An example of what I’m suggesting is, “build me an HTML form that takes the following inputs….., and ensure the form meets these ….. accessibility standards”. This can be great to get a huge amount of mundane code completed and then afterwards I still have lots of tweaks to do and so I can be sure that my eyes have taken in everything ensuring it’s in fact correctly built.

[Davide Cristini]

Nice idea! Writing tests seems a perfect fit for an AI