ChatGPT Tutorial for Developers: Ways to 10x Your Productivity

M Vaseem
Nerd For Tech
Published in
11 min readFeb 23, 2023

In this tutorial, you’re going to learn all about what ChatGPT is, how it works, and most importantly, how you can use it to boost your productivity as a software developer.

So what exactly is ChatGPT and how does it work?

ChatGPT is a cutting edge AI tool created by OpenAI. It was released in November 2022 and gained 1 million users in just 5 days. In comparison, it took Netflix 3.5 years and Instagram 2.5 months to get the same number of users. ChatGPT is an advanced language model that can understand and generate text. You can use it to create content for your website, write articles, emails, tweets, cover letters, and so on. You can also use it to generate code in a number of different programming languages like Python, JavaScript, HTML, CSS, and much, much more. You can use it to generate dummy data, write unit tests, translate text or code from one language to another. You can use it to explain code, for example, if there’s a piece of code you don’t understand, you can ask it and it will explain to you like a patient teacher. But you have to be honest, sometimes it explains too much. ChatGPT can also help you learn and remember things faster. For example, you can give it some text and have it ask you a bunch of questions. It can also prepare you for job interviews. You can have it improve your resume, write a cover letter for you, and also interview you like an interviewer. I’ll be showing you various examples for different programming languages, both for beginners and experienced developers. Before we dive into that, let’s take a moment and understand how ChatGPT works.

How it works

ChatGPT uses a type of artificial intelligence called a language model. A language model is a type of software that is designed to understand and generate human language. It does this by looking at a large amount of text data and learning the patterns and rules of a language. For example, if the language model is trained on a lot of English text, it will learn about the grammar and structure of English, as well as the meanings of words and how they are used in different contexts. Once the language model has learned about the language, it can then be used to generate text in that language. Now, ChatGPT provides different language models for different purposes. GPT3 models, which are designed to understand and generate natural language, like English, and Codex, which are specifically trained to understand and generate code. These models are trained on billions of lines of code publicly available on GitHub. They are mostly capable in Python, but they are also pretty good in a bunch of other languages like HTML, CSS, JavaScript, TypeScript, Ruby, SQL, and more. Now, before we look at specific examples, remember, ChatGPT, like any tool, has limitations. It might sometimes generate incorrect, harmful, or biased information. So don’t take whatever it tells you as a silver bullet. Don’t use it to learn to code. Because the code that is generated is not guaranteed to be right. It might be functional, but it might not be the best way to code. So in a nutshell, ChatGPT is a powerful tool that can help you be more creative and efficient, but it’s not a substitute for human expertise and judgment. So that’s the theory part.

Getting started with ChatGPT

Now let’s move on and see ChatGPT in action. So head over to chat.openai.com. If you don’t have an account, sign up. It takes only a minute. Once you have logged in, you’re going to see the main screen with an input box to talk to ChatGPT. There is also a Chrome extension and a desktop application available if you don’t want to use the web interface. You’ll see how we can use ChatGPT to learn new things, write shell scripts, get commands, start a business, write legal documents, and so on. Once we cover the basics, then we’ll dive into specific examples for front end, back end, and database development. I will show you examples using HTML, CSS, JavaScript, TypeScript, Python, SQL, and more. Now here’s my first question to ChatGPT. What are the top three books for learning Java?

As you can see, ChatGPT has given us a very comprehensive and detailed answer. Now here we can ask more detailed questions. For example, we can ask questions about the first book. So we can ask what are the key takeaways from headfirst Java?

All right, another comprehensive answer. You can see that this book teaches you about object-oriented programming, Java fundamentals, threading, and concurrency, GUI programming, and so on. Now we can also ask more general questions. Like how do I become a front end developer?

It is saying that to become a front end developer, you need to know the basics of HTML, CSS, and JavaScript. You should practice building websites. Then you should learn a front end framework like React, Angular, and so on. You should also know about version control systems like Git, GitHub, and so on. This is pretty much the same answer you will find on every website that gives you a roadmap to become a front end developer. Now let’s look at more specific examples. We can ask ChatGPT to write a shell command for us. For example, we can say write a bash command to find the name of all JPEG files in a directory and write them all to a text file.

So if you’re not good with Linux commands, you can easily find the final instruction you should use to solve that problem. But what is beautiful about ChatGPT is that it also explains how this command works line by line, piece by piece. We can also have ChatGPT write Git commands for us. For example, we can ask how do I know how many lines of code I’ve committed to a Git repository?

We can also use ChatGPT to get creative. For example, let’s say you want to start a business. You can have ChatGPT generate app or website names for you.

More examples..

These are just some example prompts. You don’t need to use the exact same wording to talk to ChatGPT. We can ask any questions you want in your own way. We can also ask ChatGPT to write contracts for us. Here is an example. “I want to hire a graphic designer to design my website. We have agreed that they will deliver the first draft in two weeks and offer three iterations free of charge. Any iteration after will be charged at $50 an hour. Write a contract for us.”

So the more details we give to ChatGPT, the better response we’ll get. Alright, take a look. This is a pretty damn good contract to start with. Of course you don’t want to take this as is and use it in the real world without first passing it by a real lawyer. That’s why earlier I told you that ChatGPT is not a replacement for humans, at least not at the moment. It’s just a way to increase your productivity and get things done in less time. Now if you’re applying for a job, there are a number of ways ChatGPT can help you. For example, you can have it write a resume for you. Here we can say I have three years of experience coding in HTML, CSS and JavaScript. Ask, write a resume for me. Of course we can give it more details. We can explain our education level, our past projects and so on. But look at what we get with this simple prompt.

So ChatGPT created a basic layout that includes our name, address, phone number, email, some objective, summary, technical skills, and has already listed all the related web technologies. So we have HTML, CSS, JavaScript, jQuery, Bootstrap. We didn’t mention any of this, but I assume that we have these skills. It also included a section about professional experience, including past projects, as well as education, certifications and so on. Again it’s a great starting point. Now let’s say you’re applying for a frontend developer role. You can ask ChatGPT to “write a cover letter for you that you can email to that company. So we can say I’m applying for a frontend engineer role at some company. Write a cover letter for me.”

Alright, take a look. We have a comprehensive cover letter beautifully written in perfect English. How good is that? You can ask a follow up question. So the beauty of ChatGPT is that it remembers everything you have told it in this conversation thread. So here we can say what is the answer to the first question. Again we get a very comprehensive detailed answer. You can also ask ChatGPT to help you write emails. For example we can say write an email to my boss asking for a raise. I’ve worked at this company for two years and successfully delivered several projects on time. Seriously, if I wanted to write this myself it would take me 10 to 15 minutes if not longer. I got the answer in just two seconds.

Python examples

Now let’s look at a few examples involving code. We’ll start with using Python for writing a command line tool. We can say “write a Python function for generating a random password”.

So as you can see we get a piece of code beautifully highlighted with explanation of how it works. Now if there is a part of this code that you don’t understand you can always ask follow up questions. We can also ask computer science questions like “what is the time complexity of this function”.

Now if you’re not familiar with this concept time complexity is a way to explain how large inputs impact the performance of an algorithm. It’s really beyond the scope of this tutorial I’ve covered it in detail in my data structures course in case you’re interested. So let’s see what we get. So ChatGPT is saying that this function’s time complexity is linear. Now let’s take this to the next level. We can ask chatGPT to write unit tests for this function. So write unit tests for this function. Seriously, how good is this? If I wanted to write all these unit tests by hand it would take me probably 20 to 30 minutes if not longer. Of course we should always use our own judgment to make sure that the tests are correct but I think this code is a great starting point and it really saves us a lot of time. We can also ask chatGPT for ideas to improve our code.

One thing I love here is that chatGPT is suggesting to use a list comprehension which is a one liner for implementing the same logic. Of course there are more ways to improve this code we are not going to get into details here. We can also ask chatGPT to convert our code from one language to another. For example we can say “convert this Python code to JavaScript”.

Incredible in just a few seconds our code was converted to JavaScript and down below we have all the details about how this code works. We can also use chatGPT to generate dummy data. For example we can say “generate dummy data for a table called customers. Each customer should have an ID, first name, last name and city”.

Now in this case chatGPT gave us a Python script for generating dummy data but what if we want the actual data not a Python script? We can say “I don’t need a Python script, just give me the data.”

So now we get a list of 10 people represented using the JSON format. So learning python using ChatGPT is much productive than you think.

If you’re interested to learn python from scratch with the help of ChatGPT, I’ve created a guide with useful prompts to get you started. Grab it here

HTML, CSS examples

Now if you’re a front-end developer you can ask ChatGPT to generate some HTML markup for you and this is where examples get more and more interesting. For example we can say “write the HTML and CSS code for displaying a card”.

Alright take a look we have the markup, here we have a div with a class of card, inside the div we have an image, then we have the card content, inside this div we have the card title and card description. Really really good. And right below that we have all the CSS we need to display a beautiful card. Of course we probably need to customize this but again this is a great starting point. Now we can stop here or we can customize this further. For example we can say “add a button below the card content”.

Alright look what happened. So now we have a new markup right under the card description, we have a new div with a class of card action and inside this div we have a button, beautiful. Now we also have more styles for this button, we have the plain styles as well as the styles for the hover effect. Now let’s take this to the next level. We can say “when I hover my mouse over the card I want the card to slightly slide up”.

So chatGPT is suggesting that we should use the hover pseudo class and the translate function translateY to slide the card up.

Conclusion

ChatGPT is a powerful tool that can help developers increase their productivity by providing quick and accurate responses to their questions. Whether it’s HTML, CSS, or any other programming language, ChatGPT can provide helpful code snippets, explanations, and examples in a matter of seconds. By leveraging the advanced language processing capabilities of ChatGPT, developers can save time and focus on the more important aspects of their projects. Whether you’re working on a small personal project or a large-scale enterprise solution, ChatGPT can be an indispensable tool for any developer looking to improve their workflow and efficiency.

So if you’re looking to 10x your productivity as a developer, consider incorporating ChatGPT into your workflow today. With its fast and accurate responses, you’ll be able to tackle even the toughest coding challenges with ease.

--

--

M Vaseem
Nerd For Tech

AI-ML enthusiast | Researching how AI influence contemporary business