Chapter 5: Writing GAS code

* If you need help with the content of this article for work or development, individual support is available.

What you will be able to do in this chapter:

  • Write GAS code in VS Code
  • Upload to cloud with clasp push
  • Actually run and check logs
  • Time required: 15-20 minutes
  • Stumbling block: Forgetting clasp push and saying "It doesn't work!"

Finally, we will create the "brain" of the robot that works for you. We will experience a series of flows: writing an instruction sheet (code) in VS Code, sending (pushing) it to the robot body on Google's server, and checking if it works correctly. We also introduce how to get help from AI (Copilot)!

1. Create an "Instruction Sheet" file in VS Code

In the previous chapter, you opened the robot's "Design Room (VS Code)" using code .. Right-click in the area where the file list is displayed on the left (Explorer) and select "New File".

Let's name the file main.js. main means "main, principal", and it is a name often used in the programming world with the intention of "this is the center of processing".

⚠️ Trivia: About extensions

  • On Google's server: GAS files are named .gs.
  • On your computer: We use the name .js (JavaScript).

You might be anxious, "Eh, is it okay if the names are different?", but there is no problem at all. The interpreter tool Clasp automatically translates it to .gs when sending the .js file you wrote to Google. By keeping it as .js on your computer, you can make full use of VS Code's convenient functions (code color coding and input assistance), making development much easier.

2. Try writing the first command to the robot

Try copying and pasting (or typing manually) the following command into the created main.js. This is the first instruction to the robot: "Say 'Hello!' and do a simple calculation".

function doSomething() {
  // Logger.log is a command "Record this"
  Logger.log("Hello! This is my first job.");
  
  // Simple calculation is also possible
  const sales = 10000;
  const tax = sales * 0.1;
  Logger.log("Consumption tax for sales of 10,000 yen is " + tax + " yen.");
}

Meaning of this code:

  • Logger.log(...): Command to write characters in the robot's diary (log).
  • const ...: Create a "box (variable)" to put numbers and characters.

Just "Hmm, this is how you write it" is OK for now.

When you finish writing, press Ctrl + S (or Command + S for Mac) on the keyboard to save the file. If you forget this, the command you wrote will remain on your computer and will not reach the robot! Make saving a habit.

🤖 Here comes AI Agent (Copilot)!

If you have introduced GitHub Copilot, you can have a magical experience. "Hand-typing" is good for study, but in practice, "Getting Agent to write" is basic.

Pattern A: Generate from comments

Try writing a comment in Japanese (or English) like this after the code you wrote.

// Get today's date and output to log in the format "Today's report"

When you write this and press Enter… AI should suggest code like const today = ... with faint characters. If you like the suggestion, just press the Tab key and the code will be entered automatically.

Pattern B: Request by chat (Agent mode)

Press the chat icon on the left side of VS Code (or Ctrl + I) and try typing this.

"Write code to read all of column A of the spreadsheet and output to log"

Then, the Agent will generate the code. You just press the "Accept" button. This is "collaboration with AI". You just tell what you want to do in natural language, and the Agent takes over the troublesome coding.

3. Send the instruction sheet to the robot (push)

Send the instruction sheet you wrote on your computer to the robot body on Google's server. This is called "push". Image of "pushing the latest instructions at hand to the other side".

Enter the following command in the terminal at the bottom of VS Code (if not present, open with Ctrl + @).

clasp push

If Pushed 1 file. is displayed on the screen, it is successful. Now, main.js on your computer has arrived safely as main.gs on Google's server.

4. Check if the robot works correctly on site

Let's go check if the command arrived properly and the robot understood it.

clasp open

When you type this command, the Google GAS development screen (robot's site) opens in the browser. There should be main.gs in the file list on the left, and the contents should be the same as the code you just wrote.

  1. Confirm that the command to execute doSomething is selected in the toolbar at the top.
  2. Press the "Run" button.
  3. (First time only) An approval screen "Do you want to allow this robot access to your Google data?" appears.
  4. If Hello!... is displayed in the "Execution Log" at the bottom of the screen, it is a great success!

Example of log on success:

Info	Hello! This is my first job.
Info	Consumption tax for sales of 10,000 yen is 1000 yen.

5. Frequently Asked Questions (Q&A)

Q1. What happens if I forget clasp push?

A. The robot on Google runs with old instructions. When you say "I fixed the code but it's not fixed!", 9 out of 10 times it's forgetting clasp push or forgetting to save the file.

Q2. Can the file name be other than main.js?

A. Yes, it is free. It is a good habit to give a name that shows the contents, such as invoice.js or report.js.

Q3. Should I delete Japanese (or English) comments?

A. No, let's keep them. It will be a memo for your future self, and it will also help AI understand the code.

6. Understanding Check Quiz

Q1. What is the extension when writing GAS code on a computer? A. .txt B. .gs C. .js

Q2. What is the command to send the written code to Google? A. clasp send B. clasp push C. clasp upload

Q3. I changed the code but it is not reflected! What is the possible cause? A. Not saving the file (Forgot Ctrl+S) B. Not doing clasp push C. Both

Answer Check (Click to open)

Q1: C Treat as JavaScript (.js) on computer.

Q2: B It is push with the image of "pushing in".

Q3: C Save and push. These 2 steps are necessary.


Congratulations! You have now experienced the same cycle as a professional developer.

  1. Create: Write instructions (code) on computer (VS Code).
  2. Send: Send to robot with clasp push.
  3. Check: Go to see the site with clasp open and run it.

This rhythm of "Create -> Send -> Check" becomes the basic step in raising an automation robot. It may feel troublesome at first, but once you get used to it, you can do it in a few minutes.

In the next chapter, we will learn "site rules" to make this development cycle smoother and proceed with development safely.


What to do in the next chapter:

  • Import cloud changes with clasp pull
  • Iron rules to prevent "reversion" accidents
  • First step of team development

>> Next Chapter: Chapter 6 Understanding push / pull

Series Index

ZIDOOKA!

Need help with the content of this article?

I provide individual technical support related to the issues described in this article, as a freelance developer. If the problem is blocking your work or internal tasks, feel free to reach out.

Support starts from $30 USD (Estimate provided in advance)
Thank you for reading

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Policy on AI Usage

Some articles on this site are written with the assistance of AI. However, we do not rely entirely on AI for writing; it is used strictly as a support tool.