Wednesday, March 7, 2018

Using Google App Script and Google Sheets to create a class sign-up system

G Suite and Google App Script

I've been learning to use G Suite and Google Apps Script lately. G Suite is a neat little platform that, among other things, allows you to create simple web applications without knowing how to program. For example, you can create an online survey using Google Forms and capture survey results automatically in Google Sheets. What's really cool, however, is that Google Apps Script allows you to connect these G Suite applications (Forms, Sheets, Email, etc) to create something even more powerful. Even better, it is free!

A Class Sign-up System

I created a class sign-up system as part of my learning process. Imagine you are a group tutoring agency offering weekend classes, and you need a web application that allows prospective students to sign up for these classes. The system has the following features:
  • shows prospective students how many others have already signed up for a particular time slot
  • sends confirmation email, with an iCal event attached, once a student submits the sign up form
  • uses Google Sheets as a datastore for storing class information and enrollment information
  • runs entirely on Google ecosystem, free of charge
  • allows customizable UI (for example, using Zurb Foundation 6 for styling and VueJS for front-end interaction). It bears no resemblance at all to a Google Form or Google Sheet app (Sorry Google ;-))
Below are screenshots of the main page and the sign-up page
Main Page
Sign-up Page
As you can see, the interface bears no resemblance at all to a Google Form or Google Sheets application. In fact, I used Zurb Foundation 6 for styling and VueJS for front-end interaction.

The Code

All code is on my github here.

Caveat

Though my experience with Apps Script is mostly positive, I don't quite like the restrictions (aka IFRAME Sandbox mode) that are enforced on the HTML page served by Apps Script. The restrictions are detailed here. For example, I can't navigate to a new page in place - I must always open a new window. I also can't use Javascript on the new window to close itself. Very annoying, but perhaps done for security reasons.

No comments:

Post a Comment

Using Google App Script and Google Sheets to create a class sign-up system

G Suite and Google App Script I've been learning to use G Suite and Google Apps Script lately. G Suite is a neat little platform that, a...