March 15, 2023

Unlock Your Coding Potential: How ChatGPT Can Supercharge Your Coding Skills.

Since Open AI released the latest version of its new cutting-edge chatbot baptized as ChatGPT, the internet community has been in awe of its incredible power. The use cases of ChatGPT are endless, as many as your mind can think of. From writing a love story about a middle-aged couple living in Hawaii in the year 2050, to summarizing the main reasons for lymphatic cancer.

The ability to use ChatGPT has become extremely relevant in a work environment as productivity boosts when using our beloved chatbot, so much so some companies list it as a job requirement.

In this blog post, we will take a look at some of the ways ChatGPT can help developers increase their productivity in different stages of development.

Research

When facing a new feature we immediately head over to Google and search for what we are going to need to complete the feature, browsing through different pages and selecting what can be useful for us. ChatGPT can help us in this task, it can handle the “browsing and selecting” for us.

Let’s say we need to store sensitive user data in a React Native application, instead of googling what are the best ways to do this, let’s ask ChatGPT.

Asking ChatGPT about storing sensitive data in a react native app

In this question, the AI introduced some security best practices that may not be relevant to what we asked for, as we asked for ways to store data and not how. That is why we also need to be selective using ChatGPT

However, the suggested Native Storage is a good answer for our use case. We can ask for follow-up questions to do in-depth research on that option

Asking ChatGPT about libraries to interact with Keychain and Keystore

Along with library recommendations, ChatGPT appended code samples on how to use them.

Code

We can ask ChatGPT to create code snippets that can help us code faster, similar to what Github Copilot does.

For example, we need to code a Login form in a React application using Material UI.

Asking ChatGPT to generate a Login form with React and Material UI

It suggested a React Component with two fields, username, and password, managed by useState. Also, a login button that triggers handleSubmit.

We went ahead and tested this component in CodeSandbox.io. The suggested code works as promised.

Running the code in CodeSandbox

I was curious where he got this code from, maybe it could give me the source so I could thank the original poster. So I asked:

Asking ChatGPT about the source of the code

Apparently, ChatGPT generates its own code based on common usages of the technologies described.

Get a full API with just the spec

Could the bot give me a full endpoint implementation from just a few simple prompts?

Let’s start asking about the specification:

Giving the basic specs

Errr… I need the dogs to be filtered by breed and gender. Let’s fix that!

Asking for more customization in one of the endpoints

Okay great! Can we get some code now? I will be using Express for my project

Asking to code from the specs

That was awesome! We got so much work done with a few lines written in natural language.

We suggest always meticulously checking and testing the code that the chatbot generates for you, as it is quite common that the answer the AI provides is not correct, or partially correct. It might also be correct but introduces anti-patterns for example, or a security breach, so my piece of advice, is never trust blindly ChatGPT and refactor if necessary.

Debugging

Debugging can be one of the most, if not the most, time-consuming and frustrating parts of coding, particularly when you're not sure what's causing the problem. ChatGPT can help you quickly identify the issue and provide guidance on how to fix it, or be your rubber ducky in case you misplaced it!

Let’s challenge the bot in this one. I took the previous example and changed the value prop in the password field, from password to username. The form should never work unless you use your username as a password, which I do not suggest!

Asking to find errors in the code

I must say I was impressed with how fast and accurate the answer was. I have made these types of dumb mistakes in the past and took me ages to sort them out, as I was not looking for a silly detail.

Optimization

It can happen that we finish coding a feature, and even though it works, it does not meet our quality standards, for example, it takes too long to resolve a query.

Another use case of ChatGPT would be optimization, in this example, we gave the bot an unoptimized SQL query and asked it to tell us how to optimize it:

Optimizing SQL queries

Conclusion

AI is becoming more and more relevant as it becomes powerful. Sooner rather than later, ChatGPT will be in your tech stack.

Here are some tips on how to get the most out of it:

  • Ask clear and specific questions: The more specific your question is, the easier it will be for it to understand what you are looking for and provide an accurate answer.
  • Provide context and background information: If your question involves a specific problem or scenario, provide as much relevant information as possible.
  • Follow up on my answers: If you have any follow-up questions or need clarification on something, don't hesitate to ask.

As said previously, we recommend never taking what the AI gives you as pure truth or correctness, as it is a new technology and it can, and will, make mistakes.

In this blog, we went through some of the ways ChatGPT can help us increase our productivity as developers, but certainly not the only ones! We at Metalabs, are eager to know in what ways you use ChatGPT to help you code.