[MUSIC PLAYING] CHRISTIAN SCHALK: Anyway. I'll go ahead and
introduce myself. My name is Christian Schalk. I'm a Google Cloud
Developer Advocate. Going to be talking
about how to build workflow type
applications in App Maker. Quick show of hands, how
many people here have already tried or worked with App
Maker to some degree? OK. So we've got some
familiar folks here. Hopefully what I
show you today will give you a bit more insight on
what you can do with App Maker. Here's another quick poll. How many people here are
more management side, like IT decision maker
as opposed to developer? OK. That's kind of what
I expected as well. So I do have technical
content in the demos and in the presentation. But I'll just keep that
in mind, so it's not purely just a
technical walkthrough or things like that. So a little bit about myself. I've been around for
a couple of years now, working in a couple of
different Silicon Valley companies, software
engineering, product management, technical program management,
and then, now, Cloud Developer Advocacy, basically
focusing on Google App Maker these last few years. I was actually the
first PM for App Maker when it was an
internal 20% project. And it was actually
a neat experiment. Our CIO at Google
had wanted to see if we could build a technology
that would allow people to essentially help
themselves in building these smaller to medium size
applications that wouldn't really fit, they
wouldn't really work with traditional engineering
resources behind them. So it just wasn't
economically viable. And so with this
product, App Maker was to essentially help
mitigate or dampen shadow IT and get everything under
the same technical umbrella, so to speak. And this product
itself was also blessed by our privacy and security. So there was no issue of
any random, weird stuff that any 20% Google or engineer
could create on their own. So in that sense,
that that's what led to the beginning
of App Maker within our Corporate
Engineering department. And I helped get us to the point
where we could actually feel like we had a viable product. And we launched it internally
a couple of years back. And then that began another
journey as well as we worked our way towards
doing our actual launch. So the goal of this
session is just to walk through introducing
App Maker for those of you who are a little bit new,
explaining high level concepts of what are the goals
behind it, and I think I touched on it
already, and then just drop into a demonstration of
how to build applications in App Maker. And so I have some stuff that
I'll just build on the fly. And then I have a specific
demo that I created recently that I'll share
with the community. But the goal was for
this particular demo-- or sample app, I guess-- was just to show how you could
build a document workflow application without having
to get so deep into the code. And so this will complement
the existing document workflow example that we already
have in the product. All right. So these are general
topics I'll be discussing. Pretty straightforward,
talking about a little bit of background. I will talk about
some of the use cases that we've seen in
various enterprises, starting with Google. And then as we have launched our
trusted tester in early adopter programs, we watched a lot
of our customers and partners building a number of
different use cases as well. And so that all factored into
the evolution of App Maker over time. And then I'll finish it
off by building components of a workflow application
right here on the fly. And I'm glad I have network
connectivity as well, because that was
a bit of an issue. So first of all,
what is App Maker? So it sounds like
people are generally pretty familiar with App
Maker at a high level. The thing that
really speaks to me is that it's an
empowering technology. It's not just another tool
for software engineers. But it's a tool
that will empower a whole variety of different
types of developers. And I say developers lightly. I mean professionals
that have the need to build a variety of
different applications. It essentially supports the
notion of citizen developers such that they can
help themselves. And so in this case-- like I said, it's
not just another tool for software engineers. But it's more like
a technology that can help a variety of
different users and personas. So this little bell curve
sums it up nicely in the sense that, sure, on one side,
the technical side, there's full on, full
stock developers. They can use App Maker. If they understand
CSS, JavaScript, HTML, SQL, they can make App Maker
do some awesome things. But on the more general, middle
audience there, I've seen, I've encountered, I've
worked with a number of different professionals. And they were business analysts. They were researchers. We had people in the
educational areas. Where they have a day job,
where they're working with data, but they happened
to have this need to build some sort
of application, whether it be a workflow or some
sort of reporting or dashboard. That's where they find the
most value in App Maker. And of course, as you get
less and less technical, you can still do some
things with App Maker. But it really depends. Having a little bit
more or prior experience to maybe some-- Legacy Technologies,
Lotus tends to come up. Or there's other various
productivity tools out there that are somewhat
familiar that people can learn how to use App
Maker without too much pain. All right. So let's just take a quick look. I'm going to have to unlock my
screen, so give me one second. All right. So this is just a real
basic starting point. I actually created
a new app based off of this starter app template. So these are known as
templates, basically examples that you can get started with. And I did do some
slight customizations. I changed the color
of the header. That's pretty trivial. I mean, you can go in
and do the CSS directly. But for this one,
just to give you a feel for what it's like
to work with App Maker, you typically have on
the left side-- oops, is it a little bit cropped? Yeah, we are a
little bit cropped. Unfortunately, as
you can kind of see, there's data pages and scripts. And essentially, you
build out your database under the data tier. You build out the UI, obviously,
under pages and scripts for any custom code. So in this case, let me
just go ahead and pop open the widget palette, drag and
drop a button onto the screen. And I might want to generate
a little bit of code. So this is a script
generation wizard. And I just have
a function there. And I can go here and
double click on that. So this is really
intro stuff here. And then I can go
over to the property header on the right
side and change it into doing a custom action. So in this case, I'll
just call this function that I just created. And then to test it, I
click on the preview button. And that sends it
over to the server. And then we have this
little button there, and I click on it,
and it says hello. And it happens to grab
my particular username. So that's just a
really small teaser, but just to give you an idea of
what you can do with App Maker. Let's go back to the slides. So also, I wanted to step back
a little bit and talk about some of the use cases that we've
seen in the real world and help set the context. So over the last year
and a half, two years, we've been working with
a number of companies and helping them with
their various use cases. Some of them are more recent. I know of, for example,
we had ATB, Veolia, join us on stage on Tuesday. Cleo's right there. We had a great time,
basically, helping them work, help brainstorming,
looking at their use cases. And they had a hackathon. These are the
things that I really enjoy, going out and meeting
the different customers and helping them be successful. But in general, I've seen
a lot of familiar patterns, starting from our Google
experience and then how that transcended over
into the outside world. For the most part,
the applications that I see that tend
to be built are either dashboards or tracking
applications and then a variety of workflows. So like a training workflow, I
can think of one in particular where there was an initiative
to build something from scratch using Cloud Platform. But it ended up being much
more economically feasible to just build it in App
Maker, since it was basically a straight forward
workflow application. And then of course,
document workflows. That's a very common pattern
that we've seen so far. And so in order to get
into a little bit more of the meaty stuff
of App Maker, I'm just going to give a general,
technical overview of App Maker. And I'll dive into the main,
technical artifacts as well. So first up is the architecture. Albeit this is somewhat
simplified, but at the top you have your editor
that's being served to you through a browser. It's coming from Cloud Platform. And it's just what I
showed you a second ago. You have your
developer environment. It's all working
within a browser. There's no SDK downloads
or anything like that. The most, I would say, supported
browser environment is Chrome. That's the majority of the
Q&A. But other browsers do work with App Maker as well. And then from a
server standpoint, when you actually click publish
or preview, that basically takes your application, it
bundles it up, sends it over the wire to the server,
and that's running in the Apps Script environment. And once you're on the
Apps Script environment, you have access to all of
these different services, all the things where you can create
docs, edit docs, fetch data from Sheets, send
emails, et cetera. And so it's a very rich
environment for the server. And this is where the real
magic of how cool workflows can come into play. And then finally,
since App Maker is more of a traditional
database application, or web application,
environment, there is the notion that you're going
to have a primary database that you're working with. And so right now, we have Cloud
SQL as the recommended default database. There are other
ways to access data. And this is also
an area that we're looking to continue to expand. So there will be
other options as well. But for today, the
Cloud SQL option does provide the most
secure performant database that you can build for
enterprise applications. And of course, you can
also step out, even today, using just REST, APIs, JDBC. There's a JDBC connector
within Apps Script that you can go out and talk to
databases with my SQL natively. You do have to do a bit more
scripting if you go down that path, where you
create, essentially, your own data access
objects, which starts to get into more coding. So I touched on those three
main technical artifacts. I'll go into a little bit more
detail, obviously, with these. So on the data
side, your goal is to essentially use this
declarative data modeling environment to build
your model objects and then set up the queries that
go against and fetch the data. The UI itself, as you
saw, it's drag and drop. You essentially open
up a widget palette, pull over whatever UI
constructs, and then you can go to the Property
Editor and set any properties as needed. You can set up
events to trigger, such as when you click on
things or when the actual UI element loads. You can set all that up to
execute whatever you need to. And of course, the glue that
makes more, I would say, sophisticated
workflows possible, or customized behavior,
is within the scripting. And scripting is
like the magic that makes everything all work,
as you would expect it. Now, you can get away with doing
some very basic applications without any code at all. You could build a CRUD
database application. So if you know
what that term is, you can create, update,
replace, delete, and even search without writing
any code as well. So talking about
models, this slide shows a typical
transition where you're coming from a spreadsheet
or a CSV file. You can then pull this into
the App Maker model editor, have the structure
of the spreadsheet be replicated into a data model. We have a nice
wizard that will scan through the spreadsheet or
the CSV file that you upload and give you all
those fields for free. You can then, on your own,
customize further and add additional fields and such. Another very important concept
to know is data sources. Data sources, in
short, our just queries that go against your models. And so whenever you
create a new model, you'll have a default data
source that does a select star and pulls all the data out. And it will typically
have 100 records that it pulls out at a time. But then you can also
customize these data sources to set up further filtering. And typically in a
real application, you're going to
have multiple data sources going against a
particular data model. So that's an important
concept to know. And relations, this is
another very powerful feature with App Maker in the
sense that you don't even need a relational
database, but as long as you have your models,
you can set up relations between those two models. And they pretty much
follow standard-- relationships flow one-to-many,
one-to-one, many-to-many. And you do it in a visual sense. So you just put
them side by side, and you can set up the,
quote, [INAUDIBLE].. I think that's a term that
tends to be used sometimes. For this particular demo or
application that I built, I'm not actually
using relations. But you can see plenty of other
examples of how to use it. All right. So let's go ahead and
jump back into the demo. And for this one, I'm going to
start building a data model. So just to set the stage-- actually, is there
a way that I can-- I guess there's no way
to decrease the demo screen a little bit so
we can see the left side. Anyway. I could go-- OK. I'll just go ahead and
keep plowing away here. So for the data model,
over there on the top left, there's a little plus button. Click on that. And I'll go ahead
and set up the-- oh, before I do that, let me
just show you really quickly, this is going to be the
source of my data model. And this is very typical, a
workflow within a spreadsheet. So you've probably seen that. It's kind of a natural
behavior to do that. So this in this case, it's like
a document workflow implemented within a spreadsheet. So there's things
like the document URL. Very important. When do you want this
to be reviewed by-- has it already been reviewed
and approved or not? And then, of course, who you
want to actually review it. So this spreadsheet will
serve as the starting point for our data model. So I go over here, I
click on the Plus button. And I'll just accept the
default Cloud SQL set up that I have for my particular domain. I can talk about that
more depending on time. But basically, this
is a step that you'll want to do if you want to set
up Cloud SQL as the default. And then let's see. I'll name this ReviewRequest. And this is the little
button that I'll click on to allow me to go out
and search the Google Drive for the spreadsheet
that I was just showing you. And it scans the spreadsheet. And I can see that
that matches what I want to create my model from. And then based off of the
data within the spreadsheet, it will essentially deduce
what kinds of data types that we want. It will also generate the
field names appropriately. So you can see string,
number, date, Boolean. Those all look pretty good. So I'll click create. And then now we're in
the data model editor. I can customize this further. So for example, maybe I want
to make the doc URL field, I want it to be required. I could even change the-- this is a single
specific feature, but I could change the
type from varchar to text. It will give me a little
bit more room to work with. So I'll just change the
SQL type there on the fly. And there's even other stuff. I could set up regular
expressions for validations and such, and even put in the
error message right there. Let me do one more
customization. I'll go into the priority. And this is the number. And for this, I'm going to
go ahead and just limit it to four possible values. So I click to set
the value here. It's a little list editor. And I'll just set it
to one through four. And that's it. So my data model is good to go. I can actually build an
application with that. Also, if I click on
the data sources tab, I do have this
default data source, which will serve as my
interface to my data. If I wanted to
customize the query, I could go into this
little entry area here. I can change the number of
records that are returned and so forth. Also automatically load data,
whenever you view the page, it will automatically
fire the query. So pretty straightforward stuff. Anything else I want to show? I think that's probably
good enough for now. So I'll come back to
the demo in a second. So just getting
back to the slide-- so you saw in just
a few minutes I was able to take a
spreadsheet and turn it into an actual
workable data model. Moving ahead, let's
talk about the UI. So the UI is relatively
straightforward. There's three main
artifacts there. You're working
predominantly with pages. Pages are essentially
containers where you can put these UI elements. We refer to them as widgets. The widgets themselves
have all properties. You can bind the
widgets, like a text box, back to a data model field. And then it stays synchronized. So you don't have to write a
data access code to actually do the synchronization. It's all handled for you. Page fragments are just
reusable UI fragments, like header, menu, footer. And you can customize,
you can build your own. And whenever you build
your own page fragment, it will then show up
on the widget palette. So then you can just drag
and drop it onto your UIs. And then popups, that's another
cool feature that's been-- it's relatively new, but
it provides a whole bunch of different types
of dialogues, ranging from a simple, empty dialog
to a loading or a Snackbar, a little thing that will pop
up and give you a message. So these are actually
pretty fun to work with. And I'll show you how to-- it's pretty easy. Now from a design
and data binding, there are some key
things to know. As you can see, it's a
Google material look and feel that's built in. But that's not to mean that
you can't step away and do your own UI design. You can totally do that. You can just turn
off the styling, and then you can go in and build
your own CSS look and feel. What I see typically,
though, is people are very happy with the
material look and feel, but they just might
tweak it a little bit or select some of the various
different style variants. So we provide a number
of styles that you can select on a
widget-by-widget basis and have a button rendered in,
like a circle or a fat button or whatever. And so that's just point
and click at that point. And there is also a
very helpful CSS editor, where you can type
in some code and then it will do code
completion, allow you to do some somewhat advanced
CSS code without really having to really be a CSS expert. But it helps you along. And of course, the
data binding feature, an extremely powerful
feature that, as I mentioned, you can go through,
data bind any types of elements or properties
on various widgets and then have them connected
back to your database. And it's not always just
the data model field. It could be like an expression
of concatenation of server side data that then gets sent down
and connected to your front end UI. All right? So switching back to the demo,
and all right-- so now I'm going to go to the UI. So again this is the UI
that I use the starter app. There's not really
much going on here. So for this one,
I'm going to build a table that will allow me
to track all of the document review requests. And so in this case, I'll just
pop open that widget pallet, we'll drag it off the table,
and it'll just define-- I'm going to set it to the
same default data source. And I'm going to have a
couple of things show up. Let's see. I don't need the comment-- reviewer approved. And it's probably good enough. Oh, maybe I will
put back approved. And then I'll accept
the default options for generating the table. And so now we're
looking at a design time view of the table, which is
basically a repeated row. In this case, we
have just labels. But if I made it
editable, I would actually have drop downs or date
pickers and so forth. Now the other thing I
want to do is add a button so that I can then launch a
dialog to insert new data. So in this case, I'll just drag
a button onto the screen here. And for this one, I might
change it to say Add. And when I change it
to Add, I can actually take advantage of the
fact that Google material has these keywords that
allows me to use an icon. And so by putting Add, it
actually changes it to-- when I render it as
an icon, it shows up with a little plus button. Likewise, there's other things
like FabMini right here. So there's my button. And what I want the button
to do is, when I click on it, I want it to launch the popup. So to do that, I go over
to the Property Editor. I go to my unclick property
and I just scroll down here. And you'll see that there's
the option for a Show Popup. And then I have the
CreateRequest, a dialog. I don't think I showed that yet. But basically, I have this
popup here called CreateRequest. And it's just empty
at the moment, but I'm going to
fill that up now. I use the Popup
Wizard here to select. And I just selected the empty
popup to do that beforehand. And so now I'm going to
drag a form into there. It's going to be an insert form. So this is where it gets fun. So I can drag the form, same
as before, same data source. I specify that I
want it to be insert. And I don't need all the fields. I just want the
primary stuff there. The due date-- I don't need the approved-- the reviewer I need,
and the comment. So that should all
line up nicely. And that was part
of the reason why I pre-built the dialog, such
that it will fit nicely. So now I can go in
and customize my form. As you can probably guess,
pushing or making someone such that they have to enter in a
URL is kind of a painful thing. So in this case, there is a
nice little DrivePicker widget right here, which I'll
just drag and drop right here onto the screen. And then again, I
can change this-- the text-- to be an icon. And so I'm going to
use the keyword Drive and then I turn the style
variant over to icon. And now I have that nice drive. But also, as you can see, it
kind of shifts everything down. So this is where you want to
start to get into it more, I would say, flow, lay
out types of features, where you can define different
panels that have certain flow, I guess, associated with it. So in this case, I selected
a horizontal panel. And then everything will
just kind of snap together in a horizontal fashion. So I'm going to pop this
up inside of that panel. And I'm going to
take the doc URL and drop it right inside there. And now I just
want to stretch it out so that it will not
just fit to content, but I want it to fill parent. There it is. So then everything's
shifted over nicely. Now to make the DrivePicker
widget actually do something, I need to set some properties. So we have here the
selected doc URL and that just means once I
pop open the DrivePicker, I want it to actually
send that in to my field, the doc URL field. And then for the other
one, selected DocName, I go into here. And I just associate
that with the doc name. So that's basically
how data binding works. All right, so now
these should work OK. I have priority ready to go. It's actually a dropdown, which
will show me the four values. I have a DatePicker
for the due date. The reviewer is one more
thing I'm going to add to it. Let's just pop that
up right there. I'm actually going to add a
new widget, which is better than just a straight text box. So in this case,
it's a UserPicker. And this will actually
connect to a directory service that I have in my environment
and it will create a directory model for me, as well. So I'll click Create. And as you can see over here, I
now have this directory model. I have all these
fields ready to go. All right. So if I go back to
my dialog, and I can just change the prompt and
I just need to set the value. So I data bind the value to be
bound to the reviewer field, right? And now I can just
toss the other one-- all right, so pretty
straightforward stuff. And the final customization
is that I want to make it such that when I click on the Submit,
it will create the record, but it will also
close the dialogue. So right now, the
OnClick behavior is to create a new record or
a new item, a pop open custom action, so then I can
customize the behavior. So in this case, I
will add a function that will get triggered
once this first call is done to create the new record. And this is where I can use
that client side API for the UI, so app.popups.creat
erequest.visible-- there we go-- equals false. So that's just a simple way to
close the pop up, all right-- so pretty basic stuff there. I can do the same
thing for clear, but I'll just make
sure I have enough time to finish everything up. So I'll click Preview,
sends over to the server, and with a little luck, I
got the behavior that I want. All right? So here's my empty table. I click on the Plus button. There's my dialog. I have my DrivePicker. That opens up a window here. And I'm going to just select
the presentation that populated the doc URL, the doc name. And then here I can
type in a few characters and that should pull up my name. So it looks good. I'm good to go. And then I can select
Priority, and I'll just use the DatePicker and put
it two days in advance. And then if my code works,
it will close the dialog. And now I have created a
new record in my database, essentially, to trigger
this application to start a workflow. Now the next step is actually
implementing the workflow part, which is actually a
little bit more coding. But I'll get into that as I
switch back to the slides. And in order to implement
the workflow part of this, this is, as I mentioned,
the scripting part. So at a high level,
just to review, scripts are two flavors. One is the client side. It works in the browser,
just straight JavaScript. This means that you can
write your own JavaScript, you can import any kind of
third-party JavaScript library, jQuery, whatever. And then there's also some APIS
that App Maker provides, such as a data API to insert, update,
deletes, all from your client, as well as UI manipulation,
showing popups, dialogs, navigating to different pages. And then, of course,
on the server, because it's running
on App Script, you have access to all
of those libraries. And that's really
where you'll be able to implement the
workflow in this case, like sending emails
and such, right? So just to give you a really
quick demo, if I switch back to the demo-- OK, cool-- so to get
started with scripting, it's pretty straightforward. You click on the Plus button. In this case, I'll just
create an example, say hello. And then maybe I
click on another. And this time, I want to
generate a server side script. And then, I could
even rename them so I can kind of keep track. There we go. And I think this one
was client side, yeah. And then if I wanted to,
instead of calling this alert, I could actually just
have it script.run.-- and there you can
see serverSayHello. And that's actually
the bit of code that would go from the client,
call the server side script, serverSayHello, which is located
in this little function here. And that would just return back
to whatever was calling it. And so I won't go into
too much more detail. In a very short sense, that's
how you kind of get busy, how you can be productive with
scripts and stuff like that. All right? So I'd like to switch
back to the presentation. And we're going to
kind of finish it off by talking about the
overall workflow. Cool. So just to move on,
one of the things that I did do for this
particular talk was I wanted to create a
relatively straightforward or easy to understand
workflow application, like a document workflow. So if there's
folks out there you might have already looked
at the template application, the document approval workflow. And that's all good. It works fine. But it can be a little bit
daunting if you're not so-- if you don't have so much
experience on the coding side. And so what I wanted to do with
this particular application in this talk is just
kind explain, step back a little bit, and
kind of take it apart. And so that's what
I ended up doing. I built this relatively
straightforward workflow, or a document
workflow application, where it has those
five different steps. I've already done the
first three or so. We're right about
step 4, where I want to have some scripting to-- once, I kick off the process
to build a new request, it will then send an
email to the reviewer. And then that
person will then be able to follow through and
either approve or reject the particular workflow. All right? Oh, here's another graphic,
just explaining what's going on. And I'll actually walk
through this application as it's working first. I'll give a quick
demo of it working. And then I'll walk through
the different components that make this possible. But as you can see, it's
pretty straightforward. Sends off an email. The reviewer gets it,
he can click on it and then he or she gets it. And then he can
click on the link and be able to go
to a approval page and either accept it or what. And then there's a
couple data updates and then it goes back to the
requester just letting him or her know that the work
flow has been completed, so pretty straightforward. So I will show you how it works. So this is like
the cooking show. I was debating whether I wanted
to do it all from scratch. But it's a little bit too much
to do from scratch in the time I have. So in this case, I'm
just going to walk through the
application, first off. So here's the application. As you can see, it's pretty
similar to what I had before. I have a table. I have a little button
there to kick off, to create a new record. I have the CreateRequest dialog. And I also have
this approval page. And I'll get into a bit more of
the details of how that works. But that's basically
how the end user is going to go get the
link and they'll go back to this approval page
to either approve or deny or whatever. All right. So for this one, let's
just kick it off here. I'll click Preview. And while it's
loading on the server, I'm going to make sure that I
don't have any e-mails here, because I'm going
to be referring back to this email application. So I think I'm going to
close down this window so I don't get confused. All right. So here's our
workflow application. I'm going to pop it open. I have my little same UI that
I created from scratch before. In the DrivePicker
window, well, I'm just going to do a review
of my presentation. And I'm going to set up the
reviewer, again, as myself. I guess ideally I could
have two different people, but you get the idea. So anyway, there's
my data there. I can set up the due
date as maybe two days and set up a priority
as one, whatever. So I will click Submit. Now I have this record here. But at the same time,
I will go back here. And I see that there's
an email that popped in. And the email says, oh,
greetings, reviewer. You have been requested to
review the following document. And in this, there's the actual
URL of the application itself, as well as the actual
record key as a parameter, and then the actual
page for the approval. So then I'll click
on that and that will take me over to this page. And there was-- notice there
was a quick little flicker where it pulled in the right record. I can explain that in a
little bit more detail, but that's basically
how I can locate it. And there's even some
security settings that you can lock it
down so only that person can see this record. But anyway, I will put in
a comment, looking good. I'll click Approve,
and that will go ahead and update the status
of that particular record. And if I want, I could go
back to the main page here. And now I can see that the
approved is now signaling true. But more importantly, I
can back to the email, and I should have a new
email sitting there. So it says review complete. And then now I can
see that the document here, which is my presentation,
has been reviewed. And it's coming back as
true, being approved, and it's looking good. Now, I deliberately
kept this simple. I could have made a
nice, rich HTML page. But for this, I just
wanted to convey the basics of passing on some
of these values in the e-mails. All right? So that's essentially
the entire cycle of the workflow in a nutshell. Let me go back to the
actual application to explain how it works. And so there's a
couple of things that are triggered when a new-- that basically the workflow
gets kicked off right when you create a new record. So on the events side of
things, on the after creation of a new review request,
there is this function here, Share Link Via Email. And I'm passing the
actual reviewer's email. And I pass the doc URL,
as well as the record key. And that's actually
critical, because I want to make sure that I'm
synchronized with that. So this is a server script. So I have it right here, Share
Via Email, right at the top. Let me see if I can
zoom in a little bit, see if that works for you guys. OK, cool. So this is the thing
that gets called right when the record gets created. I generate, essentially,
the URL that I want to pass to the end
user or the reviewer. I'm using a little bit of App
Script to get the actual URL. And then I tack on
the provided key. I also attach on
the approval page, so that gives them the ability
to go back to that approval page that I've created. And then here we are
at the approval page. So this is triggered. There's a very important
step when it gets fired off, in that it will-- let me just pull up
the events here-- there is this unattached event. So basically when
the UI loads, it will call this
parseRecordKeyParam. And so that's on the client. And that's this guy right here. And there's just a
little bit of code here, just to grab the URL
coming in from the request. And it double checks to
make sure things are OK. And then, it actually loads
the appropriate record. And it's doing this by
grabbing the record key that's also been provided
and then doing a load on the data source. Now you notice that there
is this custom data source. I haven't showed
that to you yet. But it's a different
data source that allows me to fetch a
specific record based off of the record ID. And so just to return to
that, I have my data sources, and there it is right here. And this is where I have
a little bit of scripting to essentially
grab the record key and return that specific record. And there is a
parameter that I've added, recordKey,
which then allows me to stitch it all together. This gets into
slightly more advanced. You have to read through
what is the difference between QueryScript
and QueryBuilder. In a nutshell, you can
write your own scripting to return records
from the data source, or you can just write straight,
well, relatively similar SQL code to fetch your data. All right? And that's essentially it. And that will allow us to view
the contents on this page. And then when someone clicks on
Approve, for example, or Deny, it's basically calling this
function here, finishApproval. And it sends either
a finishApproval as true or false. So you can maybe see it off
to the right side right here. And then that finishApproval
is a client-side script, which is here. So we've got the widget, which
is our connection to our data source so we can
do data operations. And then we have the actual
Boolean value for the approval. And so here, I'm just
doing a quick update, changing the field. And then I'm doing a script
run to email the response back to the reviewer, saying the
review has been complete, or yeah, in this case, yeah,
it is the reviewer complete. And that's pretty much it. So let's see if there's anything
that I wanted to touch on. So yeah, it does take a
little bit more coding to get that final finish
the loop, so to speak. But that's pretty much it. I guess we can flip
over into questions. I'm right about on time. So I wanted to make
sure that you guys also have all these links. Feel free to take a picture,
or you'll get the slides. There's a relatively simple
code lab that is relatively new. If you have some newbies getting
started, before subjecting them to the full on template
experience for all these advanced templates,
just doing that simple code lab which walks him through
a basic data model and UI creation. And then of course, there's the
other stuff that you can do. You can join the Forum. And of course, if anyone
doesn't have App Maker, and you're looking
to get App Maker, you just have to G Suite
business or Enterprise and [INAUDIBLE], as well. Let's see. And then other docs and
things like that you can jump into, as well. Thanks, everyone. Thanks for coming
out early Thursday morning after Wednesday. Hope you had fun watching
this early morning demo. So all right, thanks. [LOGO MUSIC PLAYING]
