Google Apps Script, 2nd Edition

Chapter 3. Building an Interface

What’s in a UI?

A user interface, or UI, is what you see when you turn on a computer. It may be an action-packed blockbuster movie or a single flashing green >, but one thing is for sure, this is the way you interact with the machine. When we talk about building a UI, we are typically speaking of the part that your user will need to interact with your application. Text to read, pictures to look at, boxes to type in, and buttons to push are what we call elements. We create our pages using standard HTML, and while we won’t discuss HTML in depth here, O’Reilly has an excellent book covering the subject: Elisabeth Robson and Eric Freeman’s Head First HTML and CSS.

When we build a UI in Google Apps Script, there are three ways to present the UI to the user: in a container such as a Google Doc or Sheet, in a Google Site as a gadget, or as a web page, which we call a web app. Please see Chapter 1 for a detailed description of each UI display type. For this chapter, the focus will be on the web app UI.

When you publish your web app UI, it gets a Google-hosted URL that looks something like https://script.google.com/a/macros/<unique> where you can access your HTML and JavaScript.

It Starts with doGet

In order to display a UI in your web app or Google Sites gadget, you must have a function called doGet that returns some HTML. When using a spreadsheet-integrated UI, you can call your function anything you like because of the way Google has done the wrapper. ...