Lesson 1: ChatGPT as Your Developer
How We Used ChatGPT to Write This Project
Throughout this course, you have copied and pasted code that was generated using ChatGPT. But how was that code created? The key idea is that using ChatGPT for coding is like being the **manager** of a developer—you tell it what you need, and it provides you with code that you can then test and refine.
Lesson 2: Coding as a Conversation
When using ChatGPT for coding, you aren’t just making a single request. Instead, you are having a **conversation**, refining the output step by step. Here’s how it works:
- You describe your goal in plain English.
- ChatGPT generates an initial version of the code.
- You test the code and identify any issues or improvements.
- You ask ChatGPT to modify or refine specific parts of the code.
- You repeat the process until the code does exactly what you want.
Lesson 3: Example - How We Generated the JSON Export Script
Let’s take an example of how the Google Apps Script for exporting JSON was created using ChatGPT.
Initial Prompt: "Write a Google Apps Script that takes data from a Google Sheet and converts it into a JSON file."
ChatGPT's Initial Response:
function saveJSONToDrive() {
var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
var data = sheet.getDataRange().getValues();
var result = [];
for (var i = 1; i < data.length; i++) {
result.push({
name: data[i][0],
answer: data[i][1]
});
}
var jsonString = JSON.stringify(result, null, 2);
var fileName = "country_data.json";
var folder = DriveApp.getRootFolder();
folder.createFile(fileName, jsonString, MimeType.PLAIN_TEXT);
}
After testing, I noticed that if the script was run multiple times, it created duplicate files. So, I asked ChatGPT to modify the script to **replace** an existing file instead of creating a new one each time.
Even though I hadn't a clue what the code was, I knew the problem so I told ChatGPT what I needed it to do. This is what I said: "Modify this script so that if the JSON file already exists, it gets replaced." Below is what it outputted and I still haven't a clue what it means but it doesn't matter! I simply replaced the first bit of code with the code below.
ChatGPT’s Updated Response:
function saveJSONToDrive() {
var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
var data = sheet.getDataRange().getValues();
var result = [];
for (var i = 1; i < data.length; i++) {
result.push({
name: data[i][0],
answer: data[i][1]
});
}
var jsonString = JSON.stringify(result, null, 2);
var fileName = "country_data.json";
var folder = DriveApp.getRootFolder();
var files = folder.getFilesByName(fileName);
while (files.hasNext()) {
var file = files.next();
file.setTrashed(true);
}
var newFile = folder.createFile(fileName, jsonString, MimeType.PLAIN_TEXT);
Logger.log("File saved: " + newFile.getUrl());
}
Through this process, we improved the script step by step, demonstrating how coding with ChatGPT is a back-and-forth conversation, not a one-time request.
Lesson 4: Your Turn - Practice Managing ChatGPT
Now, try the following:
- Ask ChatGPT to generate a new feature for your website, such as adding a button that changes the displayed country to a random one.
- Ask ChatGPT to explain part of the JavaScript code from earlier lessons in plain English. (Handy if you want to learn coding)
- Modify your CSS using ChatGPT by requesting a new font or a more modern design.
With practice, you’ll become more confident in directing ChatGPT to generate and refine code efficiently!