Gadget
내용
[subtitle-meta] lang=en auto=True
Hey there, I'm Rally from Gadget and
today we're going to build a full stack
Shopify app. Gadget's going to handle
all of Shopify's boilerplate for you,
including OOTH, front-end session
tokens. It's going to help you subscribe
to Shopify's web hooks and provide you
with a historical data sync that manages
Shopify's API rate limits. Gadel also
provides all the infrastructure you need
for building your apps. You're going to
get a production grade Postgress
database, serverless node backend, React
front end, and we're going to make use
of the built-in background job system
that's exposed through an API built into
gadgets built on top of temporal under
the hood. They're going to build our
classic product tagger application. It's
our typical getting started introductory
tutorial. What it's going to do is read
in Shopify product data to our database.
going to have a little UI in the Shopify
admin that allows merchants to enter
keywords. And if any of those entered
keywords match words in the product
descriptions, we just write those back
to the products as tags. If you have any
questions, check out our documentation
or ask in our developer Discord. Let's
get started. Let's get started building
our full stack Shopify app with Gadget.
I'm just going to be building a product
tagger application. This is our
introduction tutorial. It's a great way
to learn about building apps for Shopify
and building apps for Shopify using
Gadget. To start, I am just going to go
to gadget.new
and create my new gadget app. So, I am
going to select Shopify app. Gadget does
support building public Shopify apps
that can exist on Shopify's app store.
I'm just going to build a custom app for
a single merchant. I'll press continue
and I'll give my app a name, my product
tagger.
I'm happy with remix for my front-end
framework matches what the Shopify CLI
is using uh and TypeScript. So I will
press confirm and gadget will create my
new app and what it's doing is it's
rolling out a full stack infrastructure
setup for me. So this is going to be a
Postgress database. It's going to be a
NodeJS backend serverless and a Remix
front end. So I don't need to spend any
time stitching things together. Gadget's
going to do it for me and my app will be
live on the internet. I'm brought here
to the gadget editor. The first thing
I'm going to do is connect to Shopify.
Now, at this point, if I enter a
description for my app when I was
getting set up, it would be pasted here
in the AI assistant. You can give the
assistant a detailed description of your
app, and it will go ahead guide you
through Shopify setup, select the data
models it thinks you need, and it's a
good way to accelerate and get started,
especially if you don't necessarily know
all the models you might need. I do know
the models I need because of the
tutorial, and believe it or not, I've
written it before. So, I'm just going to
close the assistant and go through
manual connection. So, I'll choose a
different method. I'm going to select my
Riley test stuff Shopify organization.
And at this point, I'm going to go ahead
and create apps in my Shopify dev
dashboard. So, in Shopify, if you
haven't built a Shopify app before,
you'll need separate apps for your
development environments as well as your
production environment. So, at this
point, Gadget can go ahead create both
my development and production apps in my
dev dashboard.
I'm going to go ahead and do that so I
can show off deployment at the end. So,
let's just press continue. At this
point, I'm selecting my Shopify API
scopes and data models because I need to
read in my product data. I'm going to
read my product description and then
write back tags to my product. I need my
product read and write scopes
and my Shopify product data model. If I
hover over that, I can see the body
field is specifically what I need.
That's my product description.
When I selected this product data model,
you'll notice that the products create,
update, and delete web hooks were
automatically added here. Gadget's going
to subscribe to Shopify's web hooks for
you. And this will keep your product
data here in gadget in your Postgress
database up to date with Shopify. Gadget
also comes with a historical data sync.
So, I'll be able to pull in all that
historical product data, use web hooks
to keep up to date with any additional
changes, and we'll stay in sync. So,
that's awesome. And we won't have to
worry about Shopify's rate limits.
Gadget's going to handle all that for
me. I'm happy with this. You can always
edit this connection later if you don't
know everything you need right away.
This is all I need for this app, but
just wanted to mention it. Let's press
confirm.
And at this point, I will install on one
of my development stores. So, test with
sample data. Looks good. Let's press
install.
And this is just one of the development
stores I created in my dev dashboard.
Gadget does handle all of Shopify's OOTH
for me. I don't need to write it myself.
So, let's just click install. And I
should see my app here in my admin
beauty. Here we go. This is my remix
front end. You can see edit this pages
code directly at web routes app index.
And if I go back to my gajer, we are
successfully connected. That's great.
Let's go to files.
Web folder is my front end. API is my
back end. We'll get to that in a minute.
But if I go web routes and my default
route here, let's edit something. Let's
go hello.
If I go back to my app, you see, oh, it
just says there we go. Hello. So, hot
module reloading does work out of the
box with gadget. So, building your front
ends feels like you're building locally,
which is pretty nice. I'm just going to
go back to my gadget editor here and
let's start in the back end. We'll we'll
put front ends to the side for a bit.
We'll come back to them at the end, but
I want to start at the database level.
API is my back end. Models are how you
define tables in the underlying
Postgress database, right? This is a
visual OM. So if I click on Shopify
product, which is the model I selected
during setup, click on the schema, I can
see it's got all of these fields. These
are like columns in my database table. I
own these models. So just because Gadget
populated all this for me doesn't mean I
need to leave it as is. I can go ahead
and add custom models. This is
particularly nice if I'm storing metap
field information from Shopify. I can
inline all of my product meta fields
alongside the actual product record.
I'll just delete that for now. And and
speaking of deleting, I really just need
the body field here. So if I want to go
ahead and let's get rid of vendor.
I can do that. Store less data. That's
good. So I can go ahead and manipulate
these models however I want. You'll see
that gadget also generated a Shopify
GDPR request. Shop and sync model. These
are going to be created for you every
time you connect to Shopify. Shop holds
your shop records. Of course, sync holds
records of any historical data syncs
you've run. And GDPR request is good for
compliance requests. This is more
important for your public apps on
Shopify's app store.
Now, as you go ahead and create models,
whether it's through the Shopify
connection or create a custom model in a
bit, we're also, and by we, I mean
Gadget, is also generating a CRUD API
for you. So that's create, read, update,
delete. So if I click on my got my
actions folder. If I click on create, I
can see that I've got a serverless node
function here. And all it's doing by
default is going to save my record,
which is my Shopify product. If I hover
over it, to my gadget database. These
are fully extensible. So you can see
your logic goes here. You can go ahead
and extend these actions as needed. One
more thing to point out off to the right
here, the triggers section. So this is
what's actually going to trigger this
action run. So when a Shopify web hook
comes in or when I run that historical
data sync, it could run this create code
here. So that's important. Notably
absent is an API request, and we're
going to check that out when I create a
custom model.
So that's fantastic. This is kind of the
basics of our Shopify connection on
Gadget. All the Shopify boiler plate is
handled for me. The whole idea behind
Gadget is that you just focus on
building and writing what's unique to
your app. So speaking of that, let's
create a custom data model. If I click
on the plus here and just go allowed
tag, boom, just like that, database
migrations are run under the hood and
I've got an allowed tag table in my app.
My allowed tag model schema is pretty
bare bones to start. It'll give you an
ID, some timestamps to manage record
updates and creation. I can go ahead and
add custom fields once again. Uh let's
go keyword.
So this is just where I'm going to store
keywords that are entered by merchants.
And this is a string type. I'm happy
with that. Got a bunch support for a
bunch of types including vectors.
There's file storage built into gadget
files right here as well as
relationship. So postgress is
relational. So you can relate your data
models as well. There's also some
built-in validations or I can write my
own. I'm going to make keyword required.
Uh it doesn't really make sense to make
an allowed tag record without a keyword.
So it's going to be required. If I try
and create it without that, it'll fail
or the action will fail. Speaking of my
actions, once again, Cred API generated.
We've got our create, update, and delete
actions here. So, if I click on create,
it looks pretty similar to my Shopify
product create. One, well, couple couple
key differences. The main one I want to
point out here is the triggers section.
So, this is now a generate API endpoint.
So, the only way for me to create my
allowed tags, there's obviously no web
hooks for it, is to go ahead and call my
action. Under the hood, everything
gadget is GraphQL. But that said, we are
generating a node API client unique to
your app. And we've got some useful
React hooks that help you to go ahead
and you see there's a use action hook
here. When we pass in our API allow tag
create that will help us run our actions
in the front end in a very reactful way.
So let's go ahead and test out our
action. If I click run action, opens up
our API playground. API that is our API
client. Allowed tag is my model name.
Create is my action name. And if I go
ahead
cozy,
I can see I have created a record. This
has been now added to my database. So if
I click on my data tab, I see that yes,
Cozy is there. That is great. Speaking
of data, you know what? Let's go ahead
and take a peek at my Shopify data. So,
I've got nothing right now. If I go
ahead and create a new product,
this is a cozy sweater.
And notice I am reusing the word cozy
because I eventually want a tag to be
applied. So, when I go ahead and create
this product in Shopify, it fires that
web hook. If I come to gadget and
refresh here, I see that there we go. My
sweater is now here in my gadget
database. We'll run a data sync at the
end of this tutorial, but it just shows
you that my web hooks are indeed
working. So, I'll just go ahead and
delete this for now.
Excellent. So, we've got my custom data
model. The cred API is already
generated. So, I just now need to add a
bit of custom code to my application.
And this is what is going to handle the
business logic for my app. So I need to
be able to when that product data comes
in, whether it's an update or a create,
check to see if the product description
has changed at all. If it has, I need to
check my stored allowed tag records, see
if there's any matches between keywords
and words in the product description,
and then write any new keywords or new
tags back to the product. So, I'm going
to do that in my Shopify product data
model actions, both create and update.
So, let's just go ahead and
start with create. Now, in this
tutorial, I'm just going to use this
gadget web editor to do all my building.
I want to point out that we do have a
CLI tool. If you click up here, gives
you some instructions for getting set
up. I can run ggt, which is the name of
the tool. It's going to run in the
background if I keep it running locally.
any changes I make in my local IDE will
be synced up to this gadget web editor
and vice versa keeps them in sync and
that means your live project your
development environment here you can
build locally and it feels like you're
building any other app pulling down your
project locally also enables source
control which is super important and
then ggt also contains commands for
things like deployment so you can set up
a CI/CD pipeline for actually deploying
to production you set up or standard
standard whatever that might be git
workflow.
Okay, now let's get back to the action
here. I'm just going to go ahead and
copy paste code. I'm going to walk
through some of the gadgetisms, but the
whole point is that the code is really
what's unique to your app. So, I don't
want to spend too much time on our tag
processing logic because it's kind of
the the standard stuff. It's not unique
to gadget. It's just logic, business
logic. So, what I'll need to do here,
I'm going to go ahead
and add a if record is. Once again, if I
hover over it, that's our Shopify
product.
And you'll see I have a changed API on
here. So, the record API in gadget does
have built-in change detection. And this
is super useful for providing a web hook
loop. So what would happen is if I get a
product web hook come in, I always write
back to Shopify, write tags whether or
not they changed or not, that's going to
go ahead and fire another web hook. I'll
update web hook update. It'll be an
endless loop. We don't want to do that.
So we want to use change detection to
only run our logic if the product
description changed. So I can just go
ahead and do body and that is the name
of my field. And then I'm going to write
a little utility function. I'm going to
call that apply tags. And I'm just going
to copy paste a bit of code in here. We
haven't written this utility yet. But
I'm going to create a little util file
in a minute.
And this will go ahead. It's going to
pass the ID, product description, and
then any existing tags. I want to do
this in create as well as update. So
update, it's going to be almost the
exact same here. Let's just go ahead
paste it in. And then I of course need
to
import apply tag. So let's go ahead and
implement apply tags. Now
I'm going to go ahead create new file
utils.ts.
It exists within my Shopify product
folder.
And we can go ahead. I'm just going to
copy paste a bunch of I'm going to do
some imports first because we can talk
about the imports and then I'll copy
paste a bunch of code. So we'll go
import some of the utilities from the
gadget server. We've got a logger that's
going to write to these logs over here.
We have API. This is our API client.
It's the same client we use to make
requests in the API playground. And then
we have this connections. This is going
to help us write back to Shopify. It's
going to have an authenticated API
client I can use to send GraphQL
requests to Shopify to update my tags.
And this all comes from
my gadget server package.
Not gadget gadget server, just gadget
server.
And you'll notice if you look at these,
they look familiar. They're also
available here in your actions as part
of this high context parameter. A full
list of the available options in this
parameter are available in our
documentation.
So now I'm just going to go ahead copy
paste a bunch of code here. So let's
just implement our apply tags function.
We're just checking to make sure there
is an ID and a product description. If
there is, that's great. Let's keep
going. If not, I'm not going to run this
run this function because I either have
nothing to compare against. If there's
no description, if there's no ID, I
can't write back to Shopify. This
shouldn't happen. It's just a bit of
error detection. I'm using a regular
expression to parse out the words in my
product description and then a set just
to remove any duplicates. I don't need
to match words more than once. And then
I'm using my API client to go ahead and
read my allowed tag records. So I'm just
reading the first 250. This is the max
page size in a read in gadget. If I were
building a production app, I would need
to go ahead and actually pageionate over
my records. I'm not going to worry about
that right now though. I'm just going to
grab 250 to start. And then I am
iterating over the returned records. So
this find many it's in it's our read API
built into gadget. I'm going to map over
the results and just get the keywords.
Now if I open
my docs here,
it's a good time as any to look at find
many. So as you build and as you edit
your data models, gadget is going to go
ahead and create API documentation for
you. Keep it up to date. So you see I do
have allowed tag docs and if I want to
figure out how to retrieve many allowed
tag records, I have a little snippet
here, API allowed tag find many. That's
exactly what I'm calling. I'm just
passing in the first parameter here to
extend it to 50. By default, it'll only
return 50 results.
I'm taking my pass in tags, just putting
them to a set. This is just for easier
comparison. And then I'm doing my
compare. So it's my saved keywords. I'm
filtering those and I'm checking to see
is there a match with a word in my
product description. and is it already
not in my tags? So, I don't need to
write back if the tag already exists.
I'm using the logger just to print all
of this information to my gadget logs.
It'll just make it easy to debug.
And then if there are keywords to apply,
if there are new tags that I want to
write back to my product, I go ahead.
Now, this is seems like I've I've got my
arrays. Uh I I don't think I need some
of this logic actually. I think I can
just
do this. Uh, get my keywords apply,
append them to my existing tags, print
out these final tags, and then you see
here I'm calling API.incq.
So, because I'm writing back to Shopify,
Shopify has a rate limit I need to deal
with. How I'd normally handle this is a
background job system. I'd set up Google
Cloud Tasks or Amazon SQS. gadget has
this built in just to our API. It's
actually very simple. We can go API on Q
to spin up a new background. We call
them background actions.
We're going to go ahead and run this
right to Shopify action. We haven't
created this yet, but we will in a
minute. We're passing in some
parameters. And then there's some
options here to control my background
action concurrency in this case. So,
this will help me deal with Shopify's
rate limit. So this is this is kind of
nice. It's kind of easy instead of going
ahead and setting up a cloud task
project. It's just it's built into
gadget API.NQ is powered by temporal.
Let's go ahead and create write to
Shopify and then we can actually write
back to Shopify. Now this in this case
because there's you'll notice it's API
write to Shopify. There's no Shopify
product in there. That means I created a
global action. So, if I just create an
action in this actions folder, write to
Shopify.
There we go.
I need to go ahead and
implement my actual background action
here. So, once again, I'm just going to
copy paste code. I'm going to start at
the bottom of this one. So, you'll
notice a global action. If I just go
back here, by default, our API endpoint,
there are no parameters. I need to go
ahead and define parameters for this
action. And that's what I've done down
here. So, I've got a shop ID, it's a
string, product ID, it's a string, and
then an array of strings for my tags.
And you see that as I as I make edits,
my my sample off to the side here also
updates. So, you know, if I were to
change product to a number, all of a
sudden, we get one, two, three. Nice.
Now, let's go to my actual
implementation here. This is my run
function. I'm actually going to go back
a little bit and talk about the
difference between run and on success. I
didn't cover that before, but I should.
But let's focus on the implementation
here first. So, I'm checking my params.
You see, they are going to be fully
typed now because I've applied this
params definition. We're checking to see
if we have a shop ID and a product ID.
If not, we're throwing an error. And
then we're getting our authenticated
Shopify API clients. We're going
connections.shopify.for
ID. It's getting us the client here. So
it is an authenticated client that is
ready to write back to the store. And if
I actually check, remember this is
serverless node. So if I have a package
JSON file,
it's just Shopify API node. We're just
wrapping that up. While I'm here in the
package JSON file, you can add whatever
packages you're used to using. Once
again, it is just notes. So if you want
to import load dash to do something, you
can go ahead and do so.
Let's go back to our write Shopify
action. We're just using this API client
to go ahead Shopify.graphql
send this mutation for this product,
update the tags, and we're good. Now,
what's nice about this being a
background action is that retries will
already be built in. So, when I call
this action with API.NQ,
when it's run, it's going to be added to
this cues tab. And if there's a failure
here, it will automatically retry up to
a set number of times. And if not
actions that have determined to be
failed after retries will be visible in
this cues tab with any stack trace
information. So you go ahead and debug.
So for example, if I have an error in my
utils function, my apply tags function
and I'm missing a product ID and I keep
throwing this error. I'm going to go
ahead and see that in my logs.
Okay, so that's my back end. That's
pretty groovy. I did mention that I just
want to flip back to my create action.
So I added my custom code to this on
success function. On success and run
exist in our actions but they have
different purposes. Run is transactional
which means any failures in my run
function will roll back everything that
has occurred there. So for example if I
am saving something to the database then
I throw an error that save will be
rolled back. It won't be persisted to my
gadget database.
The reason I'm adding my custom code to
my on success function is because I'm
writing to Shopify. So if I write to
Shopify and then something fails, I
can't roll back that write. So on
success is good for longer running side
effects, any sort of writes out. I want
to put my code in on success. So we've
got a lot more information on the
differences between run on success in
our docs, but I just want to quickly
call that out.
Okay, perfect. The last thing to do now
is build my front end. So, let's go back
to our web folder.
We've got our app index file.
I'm just going to copy paste some code
once again.
Now, because Gadget knows, there we go.
Paste it in. Because Gadget knows the
shape of my APIs and my data models, we
can just use these auto components, auto
form and auto table to quickly build
front end. So in my case, I just need a
form for merchants to enter these
keywords and I want a table to display
entered keywords. So if I go back to my
app here in my admin,
it'll load up and you see I've got a
form and a table and an error. This is a
happy error though. It's permission
denied. So when I created my allow tag
model, remember gadget created my credit
API but it didn't give merchants access
to that API or permission. So if I go to
my access control permissions, I can go
ahead grant this Shopify app users role
which is merchants in the admin, I can
grant them access to read, create, and
delete. And then if I go ahead and
refresh this, I shouldn't see that
error. In fact, I should see my sweater
tag.
Very nice. cozies there and I can go
ahead and enter keywords now. And if I
go back to my front-end code quickly,
I've got my auto form. When it's
submitted, it's going to call my create
action. And then I'm just tossing a
title on there. So, this will just
create tags for me. I've got my auto
table. It's for my allowed tag model.
It's automatically going to be hooked up
to my delete action. And I'm just
showing my keyword column.
So, if I go sweater
or warm, it's going to go ahead add
these keywords. Let's get rid of
sweater. See, delete works. Run that.
Delete completed.
Very cool. Let's just go check that in
gadget. I see warm sweater has been
deleted. That's a very speedy way for me
to build my front ends.
So, that's kind of my app. I'm ready to
like test this out now. So remember I
deleted my product data. I'm going to
run a data sync which will include that
sweater and I should get a tag. So if I
go to my
installs
see this is my development store hasn't
been synced yet. I'm going to go ahead
and run my historical data sync to pull
in all of my product data into gadget.
There we go. It was completed. Is pretty
speedy. I will also note that there is a
sync API. Okay, so it's very common when
a merchant installs your app. You're
going to want to sync right away. So
you've got your Shopify shop model,
there's an install action. You can just
go ahead run a sync right away.
If I take a peek at my product data,
cool. It's all here. That's looking
good. I do see a cozy tag. So it looks
like my app worked. If I go and check
out my product in Shopify, click on my
sweater.
See, it's now tagged with cozy because
that is a word in my product description
and one of my keywords. So, that's
great. My app is working. Just to kind
of complete the loop here, if I check my
logs, remember we have those logger
statements. We can go ahead and see
we've got a bunch of empty keywords to
apply. These are all my written log
statements. I can actually just filter
by my events. But I do have one with
cozy and then I'm applying that final
tag to this product. So, that's great. I
know my app is working. I'm ready to
deploy to production. This is the last
step. And remember, I already set up my
production app in my dev dashboard. In
fact, something I haven't clicked on yet
is our environment. So, right now, I'm
working in my development environment.
You can create as many development
environments as you want. It's useful if
you're working on a team for every team
member to have their own development
environment, which also requires your
own Shopify app. Our docs have more
details on that, though. I also have a
production environment. So I can see I
need to go ahead and deploy to get
started. So let's go ahead and do that.
Let's click deploy.
Can deploy my changes to production.
This is going to go ahead. It's going to
run all the necessary database
migrations. It's going to minify my
front end, update my actions, and
restart my app for me. And once that is
finished,
I'll have a production app that's ready
to be installed on a store. You'll
notice if I do go to my production
environment settings, if I just go to
plugins, Shopify, it is already
connected to that production app in my
dev dashboard. So, I just want to
highlight that quickly. So, here we go.
It is deploying. We'll just let it do
its thing.
Once this is finished, I will have an
app that I can actually I can install on
a store if I want. Now, Shopify app
deploy the command it's running. This
will help if you do have any Shopify
extension. My app doesn't, but it will
deploy your extensions automatically as
well. My app is being restarted. That's
good. If I go to production, go to my
files now. So, you see I do have all of
my models here. I can look at my
production data. I can't edit. You
notice it's disabled. I can't edit any
of my production models or code. This is
just read only right now.
But it does allow me to see what is in
production currently.
Now, if I wanted to go ahead and install
my app on a store, I could go to my dev
dashboard, go through selecting the
custom distribution, and install on a
store, and I am all good. So, that was a
quick run through of building a full
stack Shopify app on Gadget. You'll
notice we didn't have to do any
infrastructure work when we deployed to
production or set up our development
environment. Everything is automatically
stitched together and powered by
autogenerated APIs, including that
background job system, which is really
handy. Makes development much quicker.
If you have any questions about building
on gadget, there's a lot more to go
through. Check out our documentation or
ask us in our developer Discord. Until
next time, I hope you keep building more
and coding less with Gadget.
원문 자막 펼치기
WEBVTT Kind: captions Language: en 00:00:00.000 --> 00:00:01.829 align:start position:0% Hey<00:00:00.240><c> there,</c><00:00:00.560><c> I'm</c><00:00:00.719><c> Rally</c><00:00:01.040><c> from</c><00:00:01.199><c> Gadget</c><00:00:01.680><c> and</c> 00:00:01.829 --> 00:00:01.839 align:start position:0% Hey there, I'm Rally from Gadget and 00:00:01.839 --> 00:00:03.830 align:start position:0% Hey there, I'm Rally from Gadget and today<00:00:02.080><c> we're</c><00:00:02.240><c> going</c><00:00:02.320><c> to</c><00:00:02.480><c> build</c><00:00:02.639><c> a</c><00:00:02.960><c> full</c><00:00:03.280><c> stack</c> 00:00:03.830 --> 00:00:03.840 align:start position:0% today we're going to build a full stack 00:00:03.840 --> 00:00:06.869 align:start position:0% today we're going to build a full stack Shopify<00:00:04.720><c> app.</c><00:00:05.839><c> Gadget's</c><00:00:06.400><c> going</c><00:00:06.480><c> to</c><00:00:06.560><c> handle</c> 00:00:06.869 --> 00:00:06.879 align:start position:0% Shopify app. Gadget's going to handle 00:00:06.879 --> 00:00:09.030 align:start position:0% Shopify app. Gadget's going to handle all<00:00:07.040><c> of</c><00:00:07.200><c> Shopify's</c><00:00:07.919><c> boilerplate</c><00:00:08.559><c> for</c><00:00:08.720><c> you,</c> 00:00:09.030 --> 00:00:09.040 align:start position:0% all of Shopify's boilerplate for you, 00:00:09.040 --> 00:00:11.350 align:start position:0% all of Shopify's boilerplate for you, including<00:00:09.440><c> OOTH,</c><00:00:10.240><c> front-end</c><00:00:10.880><c> session</c> 00:00:11.350 --> 00:00:11.360 align:start position:0% including OOTH, front-end session 00:00:11.360 --> 00:00:13.270 align:start position:0% including OOTH, front-end session tokens.<00:00:12.320><c> It's</c><00:00:12.480><c> going</c><00:00:12.559><c> to</c><00:00:12.639><c> help</c><00:00:12.800><c> you</c><00:00:12.960><c> subscribe</c> 00:00:13.270 --> 00:00:13.280 align:start position:0% tokens. It's going to help you subscribe 00:00:13.280 --> 00:00:15.270 align:start position:0% tokens. It's going to help you subscribe to<00:00:13.360><c> Shopify's</c><00:00:14.000><c> web</c><00:00:14.160><c> hooks</c><00:00:14.559><c> and</c><00:00:14.799><c> provide</c><00:00:15.120><c> you</c> 00:00:15.270 --> 00:00:15.280 align:start position:0% to Shopify's web hooks and provide you 00:00:15.280 --> 00:00:17.670 align:start position:0% to Shopify's web hooks and provide you with<00:00:15.440><c> a</c><00:00:15.679><c> historical</c><00:00:16.160><c> data</c><00:00:16.480><c> sync</c><00:00:16.960><c> that</c><00:00:17.279><c> manages</c> 00:00:17.670 --> 00:00:17.680 align:start position:0% with a historical data sync that manages 00:00:17.680 --> 00:00:20.790 align:start position:0% with a historical data sync that manages Shopify's<00:00:18.240><c> API</c><00:00:18.640><c> rate</c><00:00:18.880><c> limits.</c><00:00:19.840><c> Gadel</c><00:00:20.480><c> also</c> 00:00:20.790 --> 00:00:20.800 align:start position:0% Shopify's API rate limits. Gadel also 00:00:20.800 --> 00:00:22.470 align:start position:0% Shopify's API rate limits. Gadel also provides<00:00:21.199><c> all</c><00:00:21.359><c> the</c><00:00:21.600><c> infrastructure</c><00:00:22.160><c> you</c><00:00:22.320><c> need</c> 00:00:22.470 --> 00:00:22.480 align:start position:0% provides all the infrastructure you need 00:00:22.480 --> 00:00:24.150 align:start position:0% provides all the infrastructure you need for<00:00:22.640><c> building</c><00:00:22.880><c> your</c><00:00:23.039><c> apps.</c><00:00:23.600><c> You're</c><00:00:23.840><c> going</c><00:00:23.920><c> to</c> 00:00:24.150 --> 00:00:24.160 align:start position:0% for building your apps. You're going to 00:00:24.160 --> 00:00:25.509 align:start position:0% for building your apps. You're going to get<00:00:24.240><c> a</c><00:00:24.480><c> production</c><00:00:24.800><c> grade</c><00:00:25.039><c> Postgress</c> 00:00:25.509 --> 00:00:25.519 align:start position:0% get a production grade Postgress 00:00:25.519 --> 00:00:27.750 align:start position:0% get a production grade Postgress database,<00:00:26.240><c> serverless</c><00:00:26.720><c> node</c><00:00:26.960><c> backend,</c><00:00:27.439><c> React</c> 00:00:27.750 --> 00:00:27.760 align:start position:0% database, serverless node backend, React 00:00:27.760 --> 00:00:29.750 align:start position:0% database, serverless node backend, React front<00:00:28.000><c> end,</c><00:00:28.720><c> and</c><00:00:29.039><c> we're</c><00:00:29.199><c> going</c><00:00:29.279><c> to</c><00:00:29.439><c> make</c><00:00:29.599><c> use</c> 00:00:29.750 --> 00:00:29.760 align:start position:0% front end, and we're going to make use 00:00:29.760 --> 00:00:31.429 align:start position:0% front end, and we're going to make use of<00:00:29.920><c> the</c><00:00:30.080><c> built-in</c><00:00:30.400><c> background</c><00:00:30.880><c> job</c><00:00:31.119><c> system</c> 00:00:31.429 --> 00:00:31.439 align:start position:0% of the built-in background job system 00:00:31.439 --> 00:00:33.910 align:start position:0% of the built-in background job system that's<00:00:31.760><c> exposed</c><00:00:32.239><c> through</c><00:00:32.480><c> an</c><00:00:32.719><c> API</c><00:00:33.360><c> built</c><00:00:33.600><c> into</c> 00:00:33.910 --> 00:00:33.920 align:start position:0% that's exposed through an API built into 00:00:33.920 --> 00:00:35.990 align:start position:0% that's exposed through an API built into gadgets<00:00:34.480><c> built</c><00:00:34.800><c> on</c><00:00:34.880><c> top</c><00:00:35.040><c> of</c><00:00:35.200><c> temporal</c><00:00:35.760><c> under</c> 00:00:35.990 --> 00:00:36.000 align:start position:0% gadgets built on top of temporal under 00:00:36.000 --> 00:00:37.830 align:start position:0% gadgets built on top of temporal under the<00:00:36.160><c> hood.</c><00:00:37.200><c> They're</c><00:00:37.200><c> going</c><00:00:37.280><c> to</c><00:00:37.360><c> build</c><00:00:37.600><c> our</c> 00:00:37.830 --> 00:00:37.840 align:start position:0% the hood. They're going to build our 00:00:37.840 --> 00:00:40.069 align:start position:0% the hood. They're going to build our classic<00:00:38.160><c> product</c><00:00:38.480><c> tagger</c><00:00:38.960><c> application.</c><00:00:39.840><c> It's</c> 00:00:40.069 --> 00:00:40.079 align:start position:0% classic product tagger application. It's 00:00:40.079 --> 00:00:43.190 align:start position:0% classic product tagger application. It's our<00:00:40.800><c> typical</c><00:00:41.280><c> getting</c><00:00:41.680><c> started</c><00:00:42.239><c> introductory</c> 00:00:43.190 --> 00:00:43.200 align:start position:0% our typical getting started introductory 00:00:43.200 --> 00:00:45.430 align:start position:0% our typical getting started introductory tutorial.<00:00:44.239><c> What</c><00:00:44.480><c> it's</c><00:00:44.640><c> going</c><00:00:44.719><c> to</c><00:00:44.800><c> do</c><00:00:44.879><c> is</c><00:00:45.120><c> read</c> 00:00:45.430 --> 00:00:45.440 align:start position:0% tutorial. What it's going to do is read 00:00:45.440 --> 00:00:48.389 align:start position:0% tutorial. What it's going to do is read in<00:00:45.680><c> Shopify</c><00:00:46.160><c> product</c><00:00:46.480><c> data</c><00:00:46.879><c> to</c><00:00:47.200><c> our</c><00:00:47.440><c> database.</c> 00:00:48.389 --> 00:00:48.399 align:start position:0% in Shopify product data to our database. 00:00:48.399 --> 00:00:51.350 align:start position:0% in Shopify product data to our database. going<00:00:48.559><c> to</c><00:00:48.719><c> have</c><00:00:48.879><c> a</c><00:00:49.039><c> little</c><00:00:49.920><c> UI</c><00:00:50.399><c> in</c><00:00:50.640><c> the</c><00:00:50.879><c> Shopify</c> 00:00:51.350 --> 00:00:51.360 align:start position:0% going to have a little UI in the Shopify 00:00:51.360 --> 00:00:52.790 align:start position:0% going to have a little UI in the Shopify admin<00:00:51.680><c> that</c><00:00:51.840><c> allows</c><00:00:52.079><c> merchants</c><00:00:52.399><c> to</c><00:00:52.559><c> enter</c> 00:00:52.790 --> 00:00:52.800 align:start position:0% admin that allows merchants to enter 00:00:52.800 --> 00:00:54.549 align:start position:0% admin that allows merchants to enter keywords.<00:00:53.280><c> And</c><00:00:53.440><c> if</c><00:00:53.760><c> any</c><00:00:54.000><c> of</c><00:00:54.079><c> those</c><00:00:54.239><c> entered</c> 00:00:54.549 --> 00:00:54.559 align:start position:0% keywords. And if any of those entered 00:00:54.559 --> 00:00:55.990 align:start position:0% keywords. And if any of those entered keywords<00:00:54.960><c> match</c><00:00:55.280><c> words</c><00:00:55.520><c> in</c><00:00:55.680><c> the</c><00:00:55.760><c> product</c> 00:00:55.990 --> 00:00:56.000 align:start position:0% keywords match words in the product 00:00:56.000 --> 00:00:57.830 align:start position:0% keywords match words in the product descriptions,<00:00:56.480><c> we</c><00:00:56.640><c> just</c><00:00:57.039><c> write</c><00:00:57.360><c> those</c><00:00:57.600><c> back</c> 00:00:57.830 --> 00:00:57.840 align:start position:0% descriptions, we just write those back 00:00:57.840 --> 00:01:00.630 align:start position:0% descriptions, we just write those back to<00:00:58.000><c> the</c><00:00:58.160><c> products</c><00:00:58.480><c> as</c><00:00:58.800><c> tags.</c><00:01:00.000><c> If</c><00:01:00.160><c> you</c><00:01:00.320><c> have</c><00:01:00.399><c> any</c> 00:01:00.630 --> 00:01:00.640 align:start position:0% to the products as tags. If you have any 00:01:00.640 --> 00:01:02.389 align:start position:0% to the products as tags. If you have any questions,<00:01:01.199><c> check</c><00:01:01.440><c> out</c><00:01:01.600><c> our</c><00:01:01.760><c> documentation</c> 00:01:02.389 --> 00:01:02.399 align:start position:0% questions, check out our documentation 00:01:02.399 --> 00:01:04.950 align:start position:0% questions, check out our documentation or<00:01:02.719><c> ask</c><00:01:02.960><c> in</c><00:01:03.199><c> our</c><00:01:03.359><c> developer</c><00:01:03.760><c> Discord.</c><00:01:04.640><c> Let's</c> 00:01:04.950 --> 00:01:04.960 align:start position:0% or ask in our developer Discord. Let's 00:01:04.960 --> 00:01:06.789 align:start position:0% or ask in our developer Discord. Let's get<00:01:05.119><c> started.</c><00:01:05.760><c> Let's</c><00:01:06.000><c> get</c><00:01:06.159><c> started</c><00:01:06.560><c> building</c> 00:01:06.789 --> 00:01:06.799 align:start position:0% get started. Let's get started building 00:01:06.799 --> 00:01:09.190 align:start position:0% get started. Let's get started building our<00:01:07.040><c> full</c><00:01:07.360><c> stack</c><00:01:07.600><c> Shopify</c><00:01:08.159><c> app</c><00:01:08.320><c> with</c><00:01:08.560><c> Gadget.</c> 00:01:09.190 --> 00:01:09.200 align:start position:0% our full stack Shopify app with Gadget. 00:01:09.200 --> 00:01:10.950 align:start position:0% our full stack Shopify app with Gadget. I'm<00:01:09.439><c> just</c><00:01:09.520><c> going</c><00:01:09.600><c> to</c><00:01:09.680><c> be</c><00:01:09.840><c> building</c><00:01:10.080><c> a</c><00:01:10.560><c> product</c> 00:01:10.950 --> 00:01:10.960 align:start position:0% I'm just going to be building a product 00:01:10.960 --> 00:01:13.270 align:start position:0% I'm just going to be building a product tagger<00:01:11.520><c> application.</c><00:01:12.320><c> This</c><00:01:12.479><c> is</c><00:01:12.560><c> our</c> 00:01:13.270 --> 00:01:13.280 align:start position:0% tagger application. This is our 00:01:13.280 --> 00:01:15.030 align:start position:0% tagger application. This is our introduction<00:01:13.840><c> tutorial.</c><00:01:14.400><c> It's</c><00:01:14.560><c> a</c><00:01:14.720><c> great</c><00:01:14.880><c> way</c> 00:01:15.030 --> 00:01:15.040 align:start position:0% introduction tutorial. It's a great way 00:01:15.040 --> 00:01:17.270 align:start position:0% introduction tutorial. It's a great way to<00:01:15.200><c> learn</c><00:01:15.360><c> about</c><00:01:15.600><c> building</c><00:01:15.920><c> apps</c><00:01:16.159><c> for</c><00:01:16.400><c> Shopify</c> 00:01:17.270 --> 00:01:17.280 align:start position:0% to learn about building apps for Shopify 00:01:17.280 --> 00:01:18.950 align:start position:0% to learn about building apps for Shopify and<00:01:17.600><c> building</c><00:01:17.920><c> apps</c><00:01:18.159><c> for</c><00:01:18.320><c> Shopify</c><00:01:18.720><c> using</c> 00:01:18.950 --> 00:01:18.960 align:start position:0% and building apps for Shopify using 00:01:18.960 --> 00:01:22.070 align:start position:0% and building apps for Shopify using Gadget.<00:01:20.159><c> To</c><00:01:20.479><c> start,</c><00:01:20.880><c> I</c><00:01:21.200><c> am</c><00:01:21.439><c> just</c><00:01:21.600><c> going</c><00:01:21.680><c> to</c><00:01:21.840><c> go</c> 00:01:22.070 --> 00:01:22.080 align:start position:0% Gadget. To start, I am just going to go 00:01:22.080 --> 00:01:24.710 align:start position:0% Gadget. To start, I am just going to go to<00:01:22.560><c> gadget.new</c> 00:01:24.710 --> 00:01:24.720 align:start position:0% to gadget.new 00:01:24.720 --> 00:01:28.070 align:start position:0% to gadget.new and<00:01:25.840><c> create</c><00:01:26.080><c> my</c><00:01:26.240><c> new</c><00:01:26.400><c> gadget</c><00:01:26.799><c> app.</c><00:01:27.600><c> So,</c><00:01:27.759><c> I</c><00:01:28.000><c> am</c> 00:01:28.070 --> 00:01:28.080 align:start position:0% and create my new gadget app. So, I am 00:01:28.080 --> 00:01:29.990 align:start position:0% and create my new gadget app. So, I am going<00:01:28.159><c> to</c><00:01:28.240><c> select</c><00:01:28.560><c> Shopify</c><00:01:28.960><c> app.</c><00:01:29.360><c> Gadget</c><00:01:29.840><c> does</c> 00:01:29.990 --> 00:01:30.000 align:start position:0% going to select Shopify app. Gadget does 00:01:30.000 --> 00:01:32.550 align:start position:0% going to select Shopify app. Gadget does support<00:01:30.400><c> building</c><00:01:30.880><c> public</c><00:01:31.280><c> Shopify</c><00:01:31.759><c> apps</c> 00:01:32.550 --> 00:01:32.560 align:start position:0% support building public Shopify apps 00:01:32.560 --> 00:01:35.030 align:start position:0% support building public Shopify apps that<00:01:32.799><c> can</c><00:01:32.960><c> exist</c><00:01:33.200><c> on</c><00:01:33.520><c> Shopify's</c><00:01:34.159><c> app</c><00:01:34.479><c> store.</c> 00:01:35.030 --> 00:01:35.040 align:start position:0% that can exist on Shopify's app store. 00:01:35.040 --> 00:01:36.469 align:start position:0% that can exist on Shopify's app store. I'm<00:01:35.280><c> just</c><00:01:35.360><c> going</c><00:01:35.439><c> to</c><00:01:35.520><c> build</c><00:01:35.680><c> a</c><00:01:35.920><c> custom</c><00:01:36.159><c> app</c><00:01:36.320><c> for</c> 00:01:36.469 --> 00:01:36.479 align:start position:0% I'm just going to build a custom app for 00:01:36.479 --> 00:01:38.230 align:start position:0% I'm just going to build a custom app for a<00:01:36.640><c> single</c><00:01:36.880><c> merchant.</c><00:01:37.360><c> I'll</c><00:01:37.600><c> press</c><00:01:37.840><c> continue</c> 00:01:38.230 --> 00:01:38.240 align:start position:0% a single merchant. I'll press continue 00:01:38.240 --> 00:01:40.950 align:start position:0% a single merchant. I'll press continue and<00:01:38.479><c> I'll</c><00:01:38.640><c> give</c><00:01:38.799><c> my</c><00:01:38.960><c> app</c><00:01:39.119><c> a</c><00:01:39.360><c> name,</c><00:01:40.079><c> my</c><00:01:40.479><c> product</c> 00:01:40.950 --> 00:01:40.960 align:start position:0% and I'll give my app a name, my product 00:01:40.960 --> 00:01:42.789 align:start position:0% and I'll give my app a name, my product tagger. 00:01:42.789 --> 00:01:42.799 align:start position:0% tagger. 00:01:42.799 --> 00:01:44.710 align:start position:0% tagger. I'm<00:01:43.119><c> happy</c><00:01:43.280><c> with</c><00:01:43.520><c> remix</c><00:01:44.000><c> for</c><00:01:44.159><c> my</c><00:01:44.240><c> front-end</c> 00:01:44.710 --> 00:01:44.720 align:start position:0% I'm happy with remix for my front-end 00:01:44.720 --> 00:01:47.109 align:start position:0% I'm happy with remix for my front-end framework<00:01:45.520><c> matches</c><00:01:45.920><c> what</c><00:01:46.079><c> the</c><00:01:46.240><c> Shopify</c><00:01:46.640><c> CLI</c> 00:01:47.109 --> 00:01:47.119 align:start position:0% framework matches what the Shopify CLI 00:01:47.119 --> 00:01:49.270 align:start position:0% framework matches what the Shopify CLI is<00:01:47.280><c> using</c><00:01:47.920><c> uh</c><00:01:48.000><c> and</c><00:01:48.240><c> TypeScript.</c><00:01:48.880><c> So</c><00:01:48.960><c> I</c><00:01:49.119><c> will</c> 00:01:49.270 --> 00:01:49.280 align:start position:0% is using uh and TypeScript. So I will 00:01:49.280 --> 00:01:51.109 align:start position:0% is using uh and TypeScript. So I will press<00:01:49.520><c> confirm</c><00:01:49.840><c> and</c><00:01:50.159><c> gadget</c><00:01:50.560><c> will</c><00:01:50.720><c> create</c><00:01:50.880><c> my</c> 00:01:51.109 --> 00:01:51.119 align:start position:0% press confirm and gadget will create my 00:01:51.119 --> 00:01:52.870 align:start position:0% press confirm and gadget will create my new<00:01:51.280><c> app</c><00:01:51.840><c> and</c><00:01:52.000><c> what</c><00:01:52.159><c> it's</c><00:01:52.320><c> doing</c><00:01:52.479><c> is</c><00:01:52.640><c> it's</c> 00:01:52.870 --> 00:01:52.880 align:start position:0% new app and what it's doing is it's 00:01:52.880 --> 00:01:54.950 align:start position:0% new app and what it's doing is it's rolling<00:01:53.119><c> out</c><00:01:53.360><c> a</c><00:01:53.840><c> full</c><00:01:54.159><c> stack</c><00:01:54.399><c> infrastructure</c> 00:01:54.950 --> 00:01:54.960 align:start position:0% rolling out a full stack infrastructure 00:01:54.960 --> 00:01:56.230 align:start position:0% rolling out a full stack infrastructure setup<00:01:55.280><c> for</c><00:01:55.439><c> me.</c><00:01:55.600><c> So</c><00:01:55.759><c> this</c><00:01:55.840><c> is</c><00:01:55.920><c> going</c><00:01:56.000><c> to</c><00:01:56.079><c> be</c><00:01:56.079><c> a</c> 00:01:56.230 --> 00:01:56.240 align:start position:0% setup for me. So this is going to be a 00:01:56.240 --> 00:01:57.990 align:start position:0% setup for me. So this is going to be a Postgress<00:01:56.720><c> database.</c><00:01:57.439><c> It's</c><00:01:57.600><c> going</c><00:01:57.680><c> to</c><00:01:57.759><c> be</c><00:01:57.840><c> a</c> 00:01:57.990 --> 00:01:58.000 align:start position:0% Postgress database. It's going to be a 00:01:58.000 --> 00:02:01.030 align:start position:0% Postgress database. It's going to be a NodeJS<00:01:58.719><c> backend</c><00:01:59.200><c> serverless</c><00:02:00.079><c> and</c><00:02:00.399><c> a</c><00:02:00.560><c> Remix</c> 00:02:01.030 --> 00:02:01.040 align:start position:0% NodeJS backend serverless and a Remix 00:02:01.040 --> 00:02:02.709 align:start position:0% NodeJS backend serverless and a Remix front<00:02:01.280><c> end.</c><00:02:01.680><c> So</c><00:02:01.840><c> I</c><00:02:02.000><c> don't</c><00:02:02.159><c> need</c><00:02:02.240><c> to</c><00:02:02.320><c> spend</c><00:02:02.560><c> any</c> 00:02:02.709 --> 00:02:02.719 align:start position:0% front end. So I don't need to spend any 00:02:02.719 --> 00:02:04.950 align:start position:0% front end. So I don't need to spend any time<00:02:03.040><c> stitching</c><00:02:03.439><c> things</c><00:02:03.680><c> together.</c><00:02:04.479><c> Gadget's</c> 00:02:04.950 --> 00:02:04.960 align:start position:0% time stitching things together. Gadget's 00:02:04.960 --> 00:02:06.469 align:start position:0% time stitching things together. Gadget's going<00:02:05.040><c> to</c><00:02:05.119><c> do</c><00:02:05.200><c> it</c><00:02:05.360><c> for</c><00:02:05.520><c> me</c><00:02:05.600><c> and</c><00:02:05.840><c> my</c><00:02:06.000><c> app</c><00:02:06.240><c> will</c><00:02:06.399><c> be</c> 00:02:06.469 --> 00:02:06.479 align:start position:0% going to do it for me and my app will be 00:02:06.479 --> 00:02:08.309 align:start position:0% going to do it for me and my app will be live<00:02:06.799><c> on</c><00:02:06.960><c> the</c><00:02:07.200><c> internet.</c><00:02:07.680><c> I'm</c><00:02:07.920><c> brought</c><00:02:08.160><c> here</c> 00:02:08.309 --> 00:02:08.319 align:start position:0% live on the internet. I'm brought here 00:02:08.319 --> 00:02:09.749 align:start position:0% live on the internet. I'm brought here to<00:02:08.479><c> the</c><00:02:08.640><c> gadget</c><00:02:08.959><c> editor.</c><00:02:09.360><c> The</c><00:02:09.520><c> first</c><00:02:09.679><c> thing</c> 00:02:09.749 --> 00:02:09.759 align:start position:0% to the gadget editor. The first thing 00:02:09.759 --> 00:02:13.270 align:start position:0% to the gadget editor. The first thing I'm<00:02:10.000><c> going</c><00:02:10.080><c> to</c><00:02:10.160><c> do</c><00:02:10.319><c> is</c><00:02:10.640><c> connect</c><00:02:11.200><c> to</c><00:02:11.920><c> Shopify.</c> 00:02:13.270 --> 00:02:13.280 align:start position:0% I'm going to do is connect to Shopify. 00:02:13.280 --> 00:02:14.869 align:start position:0% I'm going to do is connect to Shopify. Now,<00:02:13.440><c> at</c><00:02:13.680><c> this</c><00:02:13.840><c> point,</c><00:02:14.239><c> if</c><00:02:14.400><c> I</c><00:02:14.560><c> enter</c><00:02:14.720><c> a</c> 00:02:14.869 --> 00:02:14.879 align:start position:0% Now, at this point, if I enter a 00:02:14.879 --> 00:02:15.990 align:start position:0% Now, at this point, if I enter a description<00:02:15.200><c> for</c><00:02:15.360><c> my</c><00:02:15.520><c> app</c><00:02:15.680><c> when</c><00:02:15.760><c> I</c><00:02:15.920><c> was</c> 00:02:15.990 --> 00:02:16.000 align:start position:0% description for my app when I was 00:02:16.000 --> 00:02:18.070 align:start position:0% description for my app when I was getting<00:02:16.160><c> set</c><00:02:16.319><c> up,</c><00:02:16.560><c> it</c><00:02:16.720><c> would</c><00:02:16.879><c> be</c><00:02:17.200><c> pasted</c><00:02:17.760><c> here</c> 00:02:18.070 --> 00:02:18.080 align:start position:0% getting set up, it would be pasted here 00:02:18.080 --> 00:02:20.630 align:start position:0% getting set up, it would be pasted here in<00:02:18.319><c> the</c><00:02:18.480><c> AI</c><00:02:18.959><c> assistant.</c><00:02:20.000><c> You</c><00:02:20.239><c> can</c><00:02:20.319><c> give</c><00:02:20.480><c> the</c> 00:02:20.630 --> 00:02:20.640 align:start position:0% in the AI assistant. You can give the 00:02:20.640 --> 00:02:22.150 align:start position:0% in the AI assistant. You can give the assistant<00:02:20.959><c> a</c><00:02:21.200><c> detailed</c><00:02:21.520><c> description</c><00:02:21.840><c> of</c><00:02:22.000><c> your</c> 00:02:22.150 --> 00:02:22.160 align:start position:0% assistant a detailed description of your 00:02:22.160 --> 00:02:24.070 align:start position:0% assistant a detailed description of your app,<00:02:22.319><c> and</c><00:02:22.480><c> it</c><00:02:22.640><c> will</c><00:02:22.800><c> go</c><00:02:22.959><c> ahead</c><00:02:23.680><c> guide</c><00:02:23.920><c> you</c> 00:02:24.070 --> 00:02:24.080 align:start position:0% app, and it will go ahead guide you 00:02:24.080 --> 00:02:26.390 align:start position:0% app, and it will go ahead guide you through<00:02:24.319><c> Shopify</c><00:02:24.959><c> setup,</c><00:02:25.440><c> select</c><00:02:25.760><c> the</c><00:02:26.080><c> data</c> 00:02:26.390 --> 00:02:26.400 align:start position:0% through Shopify setup, select the data 00:02:26.400 --> 00:02:28.390 align:start position:0% through Shopify setup, select the data models<00:02:26.720><c> it</c><00:02:26.959><c> thinks</c><00:02:27.200><c> you</c><00:02:27.440><c> need,</c><00:02:27.680><c> and</c><00:02:28.080><c> it's</c><00:02:28.319><c> a</c> 00:02:28.390 --> 00:02:28.400 align:start position:0% models it thinks you need, and it's a 00:02:28.400 --> 00:02:30.309 align:start position:0% models it thinks you need, and it's a good<00:02:28.560><c> way</c><00:02:28.640><c> to</c><00:02:28.879><c> accelerate</c><00:02:29.440><c> and</c><00:02:29.760><c> get</c><00:02:29.920><c> started,</c> 00:02:30.309 --> 00:02:30.319 align:start position:0% good way to accelerate and get started, 00:02:30.319 --> 00:02:31.589 align:start position:0% good way to accelerate and get started, especially<00:02:30.560><c> if</c><00:02:30.720><c> you</c><00:02:30.879><c> don't</c><00:02:31.040><c> necessarily</c><00:02:31.440><c> know</c> 00:02:31.589 --> 00:02:31.599 align:start position:0% especially if you don't necessarily know 00:02:31.599 --> 00:02:34.070 align:start position:0% especially if you don't necessarily know all<00:02:31.760><c> the</c><00:02:31.920><c> models</c><00:02:32.160><c> you</c><00:02:32.319><c> might</c><00:02:32.480><c> need.</c><00:02:33.599><c> I</c><00:02:33.760><c> do</c><00:02:33.920><c> know</c> 00:02:34.070 --> 00:02:34.080 align:start position:0% all the models you might need. I do know 00:02:34.080 --> 00:02:35.589 align:start position:0% all the models you might need. I do know the<00:02:34.239><c> models</c><00:02:34.480><c> I</c><00:02:34.640><c> need</c><00:02:34.959><c> because</c><00:02:35.360><c> of</c><00:02:35.440><c> the</c> 00:02:35.589 --> 00:02:35.599 align:start position:0% the models I need because of the 00:02:35.599 --> 00:02:37.190 align:start position:0% the models I need because of the tutorial,<00:02:35.920><c> and</c><00:02:36.239><c> believe</c><00:02:36.400><c> it</c><00:02:36.480><c> or</c><00:02:36.640><c> not,</c><00:02:36.800><c> I've</c> 00:02:37.190 --> 00:02:37.200 align:start position:0% tutorial, and believe it or not, I've 00:02:37.200 --> 00:02:39.110 align:start position:0% tutorial, and believe it or not, I've written<00:02:37.440><c> it</c><00:02:37.680><c> before.</c><00:02:38.080><c> So,</c><00:02:38.560><c> I'm</c><00:02:38.800><c> just</c><00:02:38.959><c> going</c><00:02:39.040><c> to</c> 00:02:39.110 --> 00:02:39.120 align:start position:0% written it before. So, I'm just going to 00:02:39.120 --> 00:02:40.470 align:start position:0% written it before. So, I'm just going to close<00:02:39.280><c> the</c><00:02:39.440><c> assistant</c><00:02:39.840><c> and</c><00:02:40.000><c> go</c><00:02:40.160><c> through</c> 00:02:40.470 --> 00:02:40.480 align:start position:0% close the assistant and go through 00:02:40.480 --> 00:02:41.990 align:start position:0% close the assistant and go through manual<00:02:40.879><c> connection.</c><00:02:41.280><c> So,</c><00:02:41.440><c> I'll</c><00:02:41.599><c> choose</c><00:02:41.840><c> a</c> 00:02:41.990 --> 00:02:42.000 align:start position:0% manual connection. So, I'll choose a 00:02:42.000 --> 00:02:44.070 align:start position:0% manual connection. So, I'll choose a different<00:02:42.160><c> method.</c><00:02:43.280><c> I'm</c><00:02:43.440><c> going</c><00:02:43.519><c> to</c><00:02:43.599><c> select</c><00:02:43.840><c> my</c> 00:02:44.070 --> 00:02:44.080 align:start position:0% different method. I'm going to select my 00:02:44.080 --> 00:02:47.750 align:start position:0% different method. I'm going to select my Riley<00:02:44.480><c> test</c><00:02:44.800><c> stuff</c><00:02:45.440><c> Shopify</c><00:02:45.920><c> organization.</c> 00:02:47.750 --> 00:02:47.760 align:start position:0% Riley test stuff Shopify organization. 00:02:47.760 --> 00:02:49.990 align:start position:0% Riley test stuff Shopify organization. And<00:02:48.080><c> at</c><00:02:48.319><c> this</c><00:02:48.560><c> point,</c><00:02:49.040><c> I'm</c><00:02:49.360><c> going</c><00:02:49.519><c> to</c><00:02:49.680><c> go</c><00:02:49.840><c> ahead</c> 00:02:49.990 --> 00:02:50.000 align:start position:0% And at this point, I'm going to go ahead 00:02:50.000 --> 00:02:52.070 align:start position:0% And at this point, I'm going to go ahead and<00:02:50.239><c> create</c><00:02:50.640><c> apps</c><00:02:51.040><c> in</c><00:02:51.200><c> my</c><00:02:51.360><c> Shopify</c><00:02:51.840><c> dev</c> 00:02:52.070 --> 00:02:52.080 align:start position:0% and create apps in my Shopify dev 00:02:52.080 --> 00:02:54.470 align:start position:0% and create apps in my Shopify dev dashboard.<00:02:53.120><c> So,</c><00:02:53.360><c> in</c><00:02:53.680><c> Shopify,</c><00:02:54.239><c> if</c><00:02:54.400><c> you</c> 00:02:54.470 --> 00:02:54.480 align:start position:0% dashboard. So, in Shopify, if you 00:02:54.480 --> 00:02:56.229 align:start position:0% dashboard. So, in Shopify, if you haven't<00:02:54.640><c> built</c><00:02:54.720><c> a</c><00:02:54.879><c> Shopify</c><00:02:55.280><c> app</c><00:02:55.519><c> before,</c> 00:02:56.229 --> 00:02:56.239 align:start position:0% haven't built a Shopify app before, 00:02:56.239 --> 00:02:58.150 align:start position:0% haven't built a Shopify app before, you'll<00:02:56.560><c> need</c><00:02:56.800><c> separate</c><00:02:57.120><c> apps</c><00:02:57.519><c> for</c><00:02:57.840><c> your</c> 00:02:58.150 --> 00:02:58.160 align:start position:0% you'll need separate apps for your 00:02:58.160 --> 00:03:00.229 align:start position:0% you'll need separate apps for your development<00:02:58.560><c> environments</c><00:02:59.200><c> as</c><00:02:59.519><c> well</c><00:02:59.680><c> as</c><00:02:59.920><c> your</c> 00:03:00.229 --> 00:03:00.239 align:start position:0% development environments as well as your 00:03:00.239 --> 00:03:01.750 align:start position:0% development environments as well as your production<00:03:00.720><c> environment.</c><00:03:01.200><c> So,</c><00:03:01.360><c> at</c><00:03:01.599><c> this</c> 00:03:01.750 --> 00:03:01.760 align:start position:0% production environment. So, at this 00:03:01.760 --> 00:03:03.990 align:start position:0% production environment. So, at this point,<00:03:02.400><c> Gadget</c><00:03:02.879><c> can</c><00:03:03.040><c> go</c><00:03:03.120><c> ahead</c><00:03:03.519><c> create</c><00:03:03.760><c> both</c> 00:03:03.990 --> 00:03:04.000 align:start position:0% point, Gadget can go ahead create both 00:03:04.000 --> 00:03:06.390 align:start position:0% point, Gadget can go ahead create both my<00:03:04.239><c> development</c><00:03:04.720><c> and</c><00:03:05.040><c> production</c><00:03:05.599><c> apps</c><00:03:06.000><c> in</c><00:03:06.239><c> my</c> 00:03:06.390 --> 00:03:06.400 align:start position:0% my development and production apps in my 00:03:06.400 --> 00:03:07.990 align:start position:0% my development and production apps in my dev<00:03:06.720><c> dashboard.</c> 00:03:07.990 --> 00:03:08.000 align:start position:0% dev dashboard. 00:03:08.000 --> 00:03:09.430 align:start position:0% dev dashboard. I'm<00:03:08.319><c> going</c><00:03:08.400><c> to</c><00:03:08.480><c> go</c><00:03:08.560><c> ahead</c><00:03:08.720><c> and</c><00:03:08.879><c> do</c><00:03:08.959><c> that</c><00:03:09.120><c> so</c><00:03:09.280><c> I</c> 00:03:09.430 --> 00:03:09.440 align:start position:0% I'm going to go ahead and do that so I 00:03:09.440 --> 00:03:11.670 align:start position:0% I'm going to go ahead and do that so I can<00:03:09.599><c> show</c><00:03:09.840><c> off</c><00:03:10.400><c> deployment</c><00:03:10.879><c> at</c><00:03:11.120><c> the</c><00:03:11.280><c> end.</c><00:03:11.519><c> So,</c> 00:03:11.670 --> 00:03:11.680 align:start position:0% can show off deployment at the end. So, 00:03:11.680 --> 00:03:13.910 align:start position:0% can show off deployment at the end. So, let's<00:03:11.840><c> just</c><00:03:12.000><c> press</c><00:03:12.239><c> continue.</c><00:03:13.519><c> At</c><00:03:13.760><c> this</c> 00:03:13.910 --> 00:03:13.920 align:start position:0% let's just press continue. At this 00:03:13.920 --> 00:03:15.589 align:start position:0% let's just press continue. At this point,<00:03:14.080><c> I'm</c><00:03:14.319><c> selecting</c><00:03:14.560><c> my</c><00:03:14.720><c> Shopify</c><00:03:15.200><c> API</c> 00:03:15.589 --> 00:03:15.599 align:start position:0% point, I'm selecting my Shopify API 00:03:15.599 --> 00:03:18.149 align:start position:0% point, I'm selecting my Shopify API scopes<00:03:16.000><c> and</c><00:03:16.239><c> data</c><00:03:16.560><c> models</c><00:03:16.879><c> because</c><00:03:17.120><c> I</c><00:03:17.360><c> need</c><00:03:17.440><c> to</c> 00:03:18.149 --> 00:03:18.159 align:start position:0% scopes and data models because I need to 00:03:18.159 --> 00:03:21.030 align:start position:0% scopes and data models because I need to read<00:03:18.480><c> in</c><00:03:18.720><c> my</c><00:03:18.959><c> product</c><00:03:19.360><c> data.</c><00:03:20.239><c> I'm</c><00:03:20.640><c> going</c><00:03:20.800><c> to</c> 00:03:21.030 --> 00:03:21.040 align:start position:0% read in my product data. I'm going to 00:03:21.040 --> 00:03:22.710 align:start position:0% read in my product data. I'm going to read<00:03:21.280><c> my</c><00:03:21.440><c> product</c><00:03:21.680><c> description</c><00:03:22.239><c> and</c><00:03:22.480><c> then</c> 00:03:22.710 --> 00:03:22.720 align:start position:0% read my product description and then 00:03:22.720 --> 00:03:25.270 align:start position:0% read my product description and then write<00:03:23.040><c> back</c><00:03:23.440><c> tags</c><00:03:23.840><c> to</c><00:03:24.000><c> my</c><00:03:24.239><c> product.</c><00:03:24.720><c> I</c><00:03:24.959><c> need</c><00:03:25.120><c> my</c> 00:03:25.270 --> 00:03:25.280 align:start position:0% write back tags to my product. I need my 00:03:25.280 --> 00:03:27.990 align:start position:0% write back tags to my product. I need my product<00:03:25.519><c> read</c><00:03:25.680><c> and</c><00:03:25.840><c> write</c><00:03:26.080><c> scopes</c> 00:03:27.990 --> 00:03:28.000 align:start position:0% product read and write scopes 00:03:28.000 --> 00:03:30.869 align:start position:0% product read and write scopes and<00:03:28.879><c> my</c><00:03:29.120><c> Shopify</c><00:03:29.599><c> product</c><00:03:30.000><c> data</c><00:03:30.400><c> model.</c><00:03:30.640><c> If</c><00:03:30.799><c> I</c> 00:03:30.869 --> 00:03:30.879 align:start position:0% and my Shopify product data model. If I 00:03:30.879 --> 00:03:32.550 align:start position:0% and my Shopify product data model. If I hover<00:03:31.120><c> over</c><00:03:31.360><c> that,</c><00:03:31.599><c> I</c><00:03:31.760><c> can</c><00:03:31.920><c> see</c><00:03:32.080><c> the</c><00:03:32.319><c> body</c> 00:03:32.550 --> 00:03:32.560 align:start position:0% hover over that, I can see the body 00:03:32.560 --> 00:03:34.309 align:start position:0% hover over that, I can see the body field<00:03:32.799><c> is</c><00:03:33.120><c> specifically</c><00:03:33.680><c> what</c><00:03:33.840><c> I</c><00:03:34.000><c> need.</c> 00:03:34.309 --> 00:03:34.319 align:start position:0% field is specifically what I need. 00:03:34.319 --> 00:03:36.470 align:start position:0% field is specifically what I need. That's<00:03:34.480><c> my</c><00:03:34.720><c> product</c><00:03:34.959><c> description.</c> 00:03:36.470 --> 00:03:36.480 align:start position:0% That's my product description. 00:03:36.480 --> 00:03:38.550 align:start position:0% That's my product description. When<00:03:36.720><c> I</c><00:03:36.959><c> selected</c><00:03:37.360><c> this</c><00:03:37.680><c> product</c><00:03:37.920><c> data</c><00:03:38.239><c> model,</c> 00:03:38.550 --> 00:03:38.560 align:start position:0% When I selected this product data model, 00:03:38.560 --> 00:03:41.589 align:start position:0% When I selected this product data model, you'll<00:03:38.799><c> notice</c><00:03:39.040><c> that</c><00:03:39.760><c> the</c><00:03:40.560><c> products</c><00:03:41.120><c> create,</c> 00:03:41.589 --> 00:03:41.599 align:start position:0% you'll notice that the products create, 00:03:41.599 --> 00:03:43.750 align:start position:0% you'll notice that the products create, update,<00:03:42.080><c> and</c><00:03:42.319><c> delete</c><00:03:42.720><c> web</c><00:03:42.959><c> hooks</c><00:03:43.360><c> were</c> 00:03:43.750 --> 00:03:43.760 align:start position:0% update, and delete web hooks were 00:03:43.760 --> 00:03:46.390 align:start position:0% update, and delete web hooks were automatically<00:03:44.640><c> added</c><00:03:45.040><c> here.</c><00:03:45.760><c> Gadget's</c><00:03:46.239><c> going</c> 00:03:46.390 --> 00:03:46.400 align:start position:0% automatically added here. Gadget's going 00:03:46.400 --> 00:03:48.309 align:start position:0% automatically added here. Gadget's going to<00:03:46.480><c> subscribe</c><00:03:46.879><c> to</c><00:03:47.120><c> Shopify's</c><00:03:47.680><c> web</c><00:03:47.840><c> hooks</c><00:03:48.159><c> for</c> 00:03:48.309 --> 00:03:48.319 align:start position:0% to subscribe to Shopify's web hooks for 00:03:48.319 --> 00:03:50.470 align:start position:0% to subscribe to Shopify's web hooks for you.<00:03:48.480><c> And</c><00:03:48.720><c> this</c><00:03:48.879><c> will</c><00:03:49.519><c> keep</c><00:03:49.840><c> your</c><00:03:50.159><c> product</c> 00:03:50.470 --> 00:03:50.480 align:start position:0% you. And this will keep your product 00:03:50.480 --> 00:03:52.630 align:start position:0% you. And this will keep your product data<00:03:50.879><c> here</c><00:03:51.120><c> in</c><00:03:51.360><c> gadget</c><00:03:51.760><c> in</c><00:03:52.000><c> your</c><00:03:52.080><c> Postgress</c> 00:03:52.630 --> 00:03:52.640 align:start position:0% data here in gadget in your Postgress 00:03:52.640 --> 00:03:56.149 align:start position:0% data here in gadget in your Postgress database<00:03:53.519><c> up</c><00:03:53.680><c> to</c><00:03:53.920><c> date</c><00:03:54.159><c> with</c><00:03:54.560><c> Shopify.</c><00:03:55.760><c> Gadget</c> 00:03:56.149 --> 00:03:56.159 align:start position:0% database up to date with Shopify. Gadget 00:03:56.159 --> 00:03:57.589 align:start position:0% database up to date with Shopify. Gadget also<00:03:56.319><c> comes</c><00:03:56.480><c> with</c><00:03:56.560><c> a</c><00:03:56.720><c> historical</c><00:03:57.120><c> data</c><00:03:57.360><c> sync.</c> 00:03:57.589 --> 00:03:57.599 align:start position:0% also comes with a historical data sync. 00:03:57.599 --> 00:03:58.949 align:start position:0% also comes with a historical data sync. So,<00:03:57.680><c> I'll</c><00:03:57.840><c> be</c><00:03:57.920><c> able</c><00:03:58.080><c> to</c><00:03:58.239><c> pull</c><00:03:58.400><c> in</c><00:03:58.640><c> all</c><00:03:58.799><c> that</c> 00:03:58.949 --> 00:03:58.959 align:start position:0% So, I'll be able to pull in all that 00:03:58.959 --> 00:04:01.509 align:start position:0% So, I'll be able to pull in all that historical<00:03:59.519><c> product</c><00:03:59.840><c> data,</c><00:04:00.640><c> use</c><00:04:00.879><c> web</c><00:04:01.120><c> hooks</c> 00:04:01.509 --> 00:04:01.519 align:start position:0% historical product data, use web hooks 00:04:01.519 --> 00:04:03.830 align:start position:0% historical product data, use web hooks to<00:04:01.680><c> keep</c><00:04:01.760><c> up</c><00:04:01.920><c> to</c><00:04:02.080><c> date</c><00:04:02.319><c> with</c><00:04:02.480><c> any</c><00:04:03.200><c> additional</c> 00:04:03.830 --> 00:04:03.840 align:start position:0% to keep up to date with any additional 00:04:03.840 --> 00:04:07.190 align:start position:0% to keep up to date with any additional changes,<00:04:04.720><c> and</c><00:04:05.519><c> we'll</c><00:04:05.760><c> stay</c><00:04:06.000><c> in</c><00:04:06.319><c> sync.</c><00:04:06.959><c> So,</c> 00:04:07.190 --> 00:04:07.200 align:start position:0% changes, and we'll stay in sync. So, 00:04:07.200 --> 00:04:08.550 align:start position:0% changes, and we'll stay in sync. So, that's<00:04:07.439><c> awesome.</c><00:04:07.920><c> And</c><00:04:08.080><c> we</c><00:04:08.239><c> won't</c><00:04:08.400><c> have</c><00:04:08.480><c> to</c> 00:04:08.550 --> 00:04:08.560 align:start position:0% that's awesome. And we won't have to 00:04:08.560 --> 00:04:09.670 align:start position:0% that's awesome. And we won't have to worry<00:04:08.640><c> about</c><00:04:08.799><c> Shopify's</c><00:04:09.200><c> rate</c><00:04:09.439><c> limits.</c> 00:04:09.670 --> 00:04:09.680 align:start position:0% worry about Shopify's rate limits. 00:04:09.680 --> 00:04:11.030 align:start position:0% worry about Shopify's rate limits. Gadget's<00:04:10.080><c> going</c><00:04:10.159><c> to</c><00:04:10.239><c> handle</c><00:04:10.480><c> all</c><00:04:10.640><c> that</c><00:04:10.799><c> for</c> 00:04:11.030 --> 00:04:11.040 align:start position:0% Gadget's going to handle all that for 00:04:11.040 --> 00:04:14.470 align:start position:0% Gadget's going to handle all that for me.<00:04:12.159><c> I'm</c><00:04:12.480><c> happy</c><00:04:12.640><c> with</c><00:04:12.879><c> this.</c><00:04:13.840><c> You</c><00:04:14.080><c> can</c><00:04:14.159><c> always</c> 00:04:14.470 --> 00:04:14.480 align:start position:0% me. I'm happy with this. You can always 00:04:14.480 --> 00:04:16.469 align:start position:0% me. I'm happy with this. You can always edit<00:04:14.799><c> this</c><00:04:15.040><c> connection</c><00:04:15.439><c> later</c><00:04:15.920><c> if</c><00:04:16.239><c> you</c><00:04:16.320><c> don't</c> 00:04:16.469 --> 00:04:16.479 align:start position:0% edit this connection later if you don't 00:04:16.479 --> 00:04:18.069 align:start position:0% edit this connection later if you don't know<00:04:16.720><c> everything</c><00:04:16.959><c> you</c><00:04:17.199><c> need</c><00:04:17.359><c> right</c><00:04:17.600><c> away.</c> 00:04:18.069 --> 00:04:18.079 align:start position:0% know everything you need right away. 00:04:18.079 --> 00:04:19.430 align:start position:0% know everything you need right away. This<00:04:18.239><c> is</c><00:04:18.320><c> all</c><00:04:18.479><c> I</c><00:04:18.639><c> need</c><00:04:18.720><c> for</c><00:04:18.880><c> this</c><00:04:19.040><c> app,</c><00:04:19.199><c> but</c> 00:04:19.430 --> 00:04:19.440 align:start position:0% This is all I need for this app, but 00:04:19.440 --> 00:04:21.110 align:start position:0% This is all I need for this app, but just<00:04:19.680><c> wanted</c><00:04:19.840><c> to</c><00:04:19.919><c> mention</c><00:04:20.160><c> it.</c><00:04:20.639><c> Let's</c><00:04:20.880><c> press</c> 00:04:21.110 --> 00:04:21.120 align:start position:0% just wanted to mention it. Let's press 00:04:21.120 --> 00:04:22.710 align:start position:0% just wanted to mention it. Let's press confirm. 00:04:22.710 --> 00:04:22.720 align:start position:0% confirm. 00:04:22.720 --> 00:04:24.950 align:start position:0% confirm. And<00:04:22.880><c> at</c><00:04:23.120><c> this</c><00:04:23.280><c> point,</c><00:04:23.520><c> I</c><00:04:23.840><c> will</c><00:04:24.160><c> install</c><00:04:24.560><c> on</c><00:04:24.800><c> one</c> 00:04:24.950 --> 00:04:24.960 align:start position:0% And at this point, I will install on one 00:04:24.960 --> 00:04:26.469 align:start position:0% And at this point, I will install on one of<00:04:25.040><c> my</c><00:04:25.199><c> development</c><00:04:25.520><c> stores.</c><00:04:25.840><c> So,</c><00:04:26.080><c> test</c><00:04:26.320><c> with</c> 00:04:26.469 --> 00:04:26.479 align:start position:0% of my development stores. So, test with 00:04:26.479 --> 00:04:27.990 align:start position:0% of my development stores. So, test with sample<00:04:26.720><c> data.</c><00:04:27.040><c> Looks</c><00:04:27.280><c> good.</c><00:04:27.520><c> Let's</c><00:04:27.759><c> press</c> 00:04:27.990 --> 00:04:28.000 align:start position:0% sample data. Looks good. Let's press 00:04:28.000 --> 00:04:29.830 align:start position:0% sample data. Looks good. Let's press install. 00:04:29.830 --> 00:04:29.840 align:start position:0% install. 00:04:29.840 --> 00:04:30.950 align:start position:0% install. And<00:04:30.000><c> this</c><00:04:30.160><c> is</c><00:04:30.240><c> just</c><00:04:30.400><c> one</c><00:04:30.479><c> of</c><00:04:30.560><c> the</c><00:04:30.720><c> development</c> 00:04:30.950 --> 00:04:30.960 align:start position:0% And this is just one of the development 00:04:30.960 --> 00:04:33.590 align:start position:0% And this is just one of the development stores<00:04:31.280><c> I</c><00:04:31.520><c> created</c><00:04:31.759><c> in</c><00:04:31.919><c> my</c><00:04:32.080><c> dev</c><00:04:32.400><c> dashboard.</c> 00:04:33.590 --> 00:04:33.600 align:start position:0% stores I created in my dev dashboard. 00:04:33.600 --> 00:04:35.990 align:start position:0% stores I created in my dev dashboard. Gadget<00:04:34.160><c> does</c><00:04:34.400><c> handle</c><00:04:34.720><c> all</c><00:04:34.960><c> of</c><00:04:35.040><c> Shopify's</c><00:04:35.600><c> OOTH</c> 00:04:35.990 --> 00:04:36.000 align:start position:0% Gadget does handle all of Shopify's OOTH 00:04:36.000 --> 00:04:38.710 align:start position:0% Gadget does handle all of Shopify's OOTH for<00:04:36.240><c> me.</c><00:04:36.880><c> I</c><00:04:37.120><c> don't</c><00:04:37.280><c> need</c><00:04:37.440><c> to</c><00:04:37.600><c> write</c><00:04:37.840><c> it</c><00:04:38.080><c> myself.</c> 00:04:38.710 --> 00:04:38.720 align:start position:0% for me. I don't need to write it myself. 00:04:38.720 --> 00:04:40.469 align:start position:0% for me. I don't need to write it myself. So,<00:04:38.880><c> let's</c><00:04:39.120><c> just</c><00:04:39.280><c> click</c><00:04:39.600><c> install.</c><00:04:40.160><c> And</c><00:04:40.320><c> I</c> 00:04:40.469 --> 00:04:40.479 align:start position:0% So, let's just click install. And I 00:04:40.479 --> 00:04:50.070 align:start position:0% So, let's just click install. And I should<00:04:40.639><c> see</c><00:04:40.800><c> my</c><00:04:41.040><c> app</c><00:04:41.280><c> here</c><00:04:41.840><c> in</c><00:04:42.160><c> my</c><00:04:42.479><c> admin</c> 00:04:50.070 --> 00:04:50.080 align:start position:0% 00:04:50.080 --> 00:04:52.469 align:start position:0% beauty.<00:04:50.639><c> Here</c><00:04:50.880><c> we</c><00:04:51.040><c> go.</c><00:04:51.440><c> This</c><00:04:51.600><c> is</c><00:04:51.759><c> my</c><00:04:52.000><c> remix</c> 00:04:52.469 --> 00:04:52.479 align:start position:0% beauty. Here we go. This is my remix 00:04:52.479 --> 00:04:53.990 align:start position:0% beauty. Here we go. This is my remix front<00:04:52.639><c> end.</c><00:04:52.800><c> You</c><00:04:52.960><c> can</c><00:04:53.040><c> see</c><00:04:53.199><c> edit</c><00:04:53.440><c> this</c><00:04:53.600><c> pages</c> 00:04:53.990 --> 00:04:54.000 align:start position:0% front end. You can see edit this pages 00:04:54.000 --> 00:04:57.030 align:start position:0% front end. You can see edit this pages code<00:04:54.240><c> directly</c><00:04:55.120><c> at</c><00:04:55.360><c> web</c><00:04:55.600><c> routes</c><00:04:56.000><c> app</c><00:04:56.160><c> index.</c> 00:04:57.030 --> 00:04:57.040 align:start position:0% code directly at web routes app index. 00:04:57.040 --> 00:04:58.950 align:start position:0% code directly at web routes app index. And<00:04:57.199><c> if</c><00:04:57.440><c> I</c><00:04:57.520><c> go</c><00:04:57.600><c> back</c><00:04:57.759><c> to</c><00:04:57.840><c> my</c><00:04:58.000><c> gajer,</c><00:04:58.560><c> we</c><00:04:58.800><c> are</c> 00:04:58.950 --> 00:04:58.960 align:start position:0% And if I go back to my gajer, we are 00:04:58.960 --> 00:05:01.030 align:start position:0% And if I go back to my gajer, we are successfully<00:04:59.440><c> connected.</c><00:04:59.919><c> That's</c><00:05:00.160><c> great.</c> 00:05:01.030 --> 00:05:01.040 align:start position:0% successfully connected. That's great. 00:05:01.040 --> 00:05:03.430 align:start position:0% successfully connected. That's great. Let's<00:05:01.280><c> go</c><00:05:01.440><c> to</c><00:05:01.600><c> files.</c> 00:05:03.430 --> 00:05:03.440 align:start position:0% Let's go to files. 00:05:03.440 --> 00:05:05.430 align:start position:0% Let's go to files. Web<00:05:03.680><c> folder</c><00:05:04.000><c> is</c><00:05:04.160><c> my</c><00:05:04.320><c> front</c><00:05:04.479><c> end.</c><00:05:04.800><c> API</c><00:05:05.199><c> is</c><00:05:05.360><c> my</c> 00:05:05.430 --> 00:05:05.440 align:start position:0% Web folder is my front end. API is my 00:05:05.440 --> 00:05:07.430 align:start position:0% Web folder is my front end. API is my back<00:05:05.600><c> end.</c><00:05:05.840><c> We'll</c><00:05:06.080><c> get</c><00:05:06.240><c> to</c><00:05:06.400><c> that</c><00:05:06.560><c> in</c><00:05:06.720><c> a</c><00:05:06.880><c> minute.</c> 00:05:07.430 --> 00:05:07.440 align:start position:0% back end. We'll get to that in a minute. 00:05:07.440 --> 00:05:11.350 align:start position:0% back end. We'll get to that in a minute. But<00:05:07.600><c> if</c><00:05:07.759><c> I</c><00:05:07.840><c> go</c><00:05:08.080><c> web</c><00:05:08.479><c> routes</c><00:05:09.840><c> and</c><00:05:10.320><c> my</c><00:05:10.880><c> default</c> 00:05:11.350 --> 00:05:11.360 align:start position:0% But if I go web routes and my default 00:05:11.360 --> 00:05:13.909 align:start position:0% But if I go web routes and my default route<00:05:11.759><c> here,</c><00:05:12.479><c> let's</c><00:05:12.800><c> edit</c><00:05:13.199><c> something.</c><00:05:13.680><c> Let's</c> 00:05:13.909 --> 00:05:13.919 align:start position:0% route here, let's edit something. Let's 00:05:13.919 --> 00:05:16.950 align:start position:0% route here, let's edit something. Let's go<00:05:14.160><c> hello.</c> 00:05:16.950 --> 00:05:16.960 align:start position:0% go hello. 00:05:16.960 --> 00:05:19.909 align:start position:0% go hello. If<00:05:17.199><c> I</c><00:05:17.360><c> go</c><00:05:17.520><c> back</c><00:05:17.919><c> to</c><00:05:18.160><c> my</c><00:05:18.400><c> app,</c><00:05:18.960><c> you</c><00:05:19.199><c> see,</c><00:05:19.600><c> oh,</c><00:05:19.840><c> it</c> 00:05:19.909 --> 00:05:19.919 align:start position:0% If I go back to my app, you see, oh, it 00:05:19.919 --> 00:05:22.070 align:start position:0% If I go back to my app, you see, oh, it just<00:05:20.080><c> says</c><00:05:20.320><c> there</c><00:05:20.479><c> we</c><00:05:20.639><c> go.</c><00:05:21.039><c> Hello.</c><00:05:21.600><c> So,</c><00:05:21.840><c> hot</c> 00:05:22.070 --> 00:05:22.080 align:start position:0% just says there we go. Hello. So, hot 00:05:22.080 --> 00:05:24.150 align:start position:0% just says there we go. Hello. So, hot module<00:05:22.479><c> reloading</c><00:05:23.360><c> does</c><00:05:23.600><c> work</c><00:05:23.759><c> out</c><00:05:23.919><c> of</c><00:05:24.000><c> the</c> 00:05:24.150 --> 00:05:24.160 align:start position:0% module reloading does work out of the 00:05:24.160 --> 00:05:25.510 align:start position:0% module reloading does work out of the box<00:05:24.320><c> with</c><00:05:24.479><c> gadget.</c><00:05:24.880><c> So,</c><00:05:24.960><c> building</c><00:05:25.199><c> your</c><00:05:25.360><c> front</c> 00:05:25.510 --> 00:05:25.520 align:start position:0% box with gadget. So, building your front 00:05:25.520 --> 00:05:28.150 align:start position:0% box with gadget. So, building your front ends<00:05:25.919><c> feels</c><00:05:26.240><c> like</c><00:05:26.479><c> you're</c><00:05:26.960><c> building</c><00:05:27.360><c> locally,</c> 00:05:28.150 --> 00:05:28.160 align:start position:0% ends feels like you're building locally, 00:05:28.160 --> 00:05:30.629 align:start position:0% ends feels like you're building locally, which<00:05:28.479><c> is</c><00:05:28.800><c> pretty</c><00:05:29.120><c> nice.</c><00:05:30.000><c> I'm</c><00:05:30.320><c> just</c><00:05:30.479><c> going</c><00:05:30.560><c> to</c> 00:05:30.629 --> 00:05:30.639 align:start position:0% which is pretty nice. I'm just going to 00:05:30.639 --> 00:05:34.310 align:start position:0% which is pretty nice. I'm just going to go<00:05:30.800><c> back</c><00:05:30.960><c> to</c><00:05:31.199><c> my</c><00:05:32.320><c> gadget</c><00:05:33.039><c> editor</c><00:05:33.520><c> here</c><00:05:34.000><c> and</c> 00:05:34.310 --> 00:05:34.320 align:start position:0% go back to my gadget editor here and 00:05:34.320 --> 00:05:35.909 align:start position:0% go back to my gadget editor here and let's<00:05:34.639><c> start</c><00:05:34.880><c> in</c><00:05:35.039><c> the</c><00:05:35.199><c> back</c><00:05:35.360><c> end.</c><00:05:35.600><c> We'll</c><00:05:35.759><c> we'll</c> 00:05:35.909 --> 00:05:35.919 align:start position:0% let's start in the back end. We'll we'll 00:05:35.919 --> 00:05:37.189 align:start position:0% let's start in the back end. We'll we'll put<00:05:36.000><c> front</c><00:05:36.240><c> ends</c><00:05:36.400><c> to</c><00:05:36.479><c> the</c><00:05:36.639><c> side</c><00:05:36.800><c> for</c><00:05:36.880><c> a</c><00:05:37.039><c> bit.</c> 00:05:37.189 --> 00:05:37.199 align:start position:0% put front ends to the side for a bit. 00:05:37.199 --> 00:05:38.790 align:start position:0% put front ends to the side for a bit. We'll<00:05:37.360><c> come</c><00:05:37.520><c> back</c><00:05:37.600><c> to</c><00:05:37.759><c> them</c><00:05:37.919><c> at</c><00:05:38.080><c> the</c><00:05:38.160><c> end,</c><00:05:38.320><c> but</c> 00:05:38.790 --> 00:05:38.800 align:start position:0% We'll come back to them at the end, but 00:05:38.800 --> 00:05:40.790 align:start position:0% We'll come back to them at the end, but I<00:05:39.039><c> want</c><00:05:39.199><c> to</c><00:05:39.280><c> start</c><00:05:39.520><c> at</c><00:05:39.759><c> the</c><00:05:39.919><c> database</c><00:05:40.400><c> level.</c> 00:05:40.790 --> 00:05:40.800 align:start position:0% I want to start at the database level. 00:05:40.800 --> 00:05:43.510 align:start position:0% I want to start at the database level. API<00:05:41.199><c> is</c><00:05:41.360><c> my</c><00:05:41.520><c> back</c><00:05:41.680><c> end.</c><00:05:42.400><c> Models</c><00:05:42.880><c> are</c><00:05:43.120><c> how</c><00:05:43.280><c> you</c> 00:05:43.510 --> 00:05:43.520 align:start position:0% API is my back end. Models are how you 00:05:43.520 --> 00:05:45.510 align:start position:0% API is my back end. Models are how you define<00:05:44.320><c> tables</c><00:05:44.720><c> in</c><00:05:44.960><c> the</c><00:05:45.120><c> underlying</c> 00:05:45.510 --> 00:05:45.520 align:start position:0% define tables in the underlying 00:05:45.520 --> 00:05:47.189 align:start position:0% define tables in the underlying Postgress<00:05:46.080><c> database,</c><00:05:46.560><c> right?</c><00:05:46.720><c> This</c><00:05:46.880><c> is</c><00:05:47.039><c> a</c> 00:05:47.189 --> 00:05:47.199 align:start position:0% Postgress database, right? This is a 00:05:47.199 --> 00:05:50.469 align:start position:0% Postgress database, right? This is a visual<00:05:47.759><c> OM.</c><00:05:48.960><c> So</c><00:05:49.199><c> if</c><00:05:49.360><c> I</c><00:05:49.520><c> click</c><00:05:49.680><c> on</c><00:05:49.919><c> Shopify</c> 00:05:50.469 --> 00:05:50.479 align:start position:0% visual OM. So if I click on Shopify 00:05:50.479 --> 00:05:52.070 align:start position:0% visual OM. So if I click on Shopify product,<00:05:50.880><c> which</c><00:05:51.039><c> is</c><00:05:51.120><c> the</c><00:05:51.280><c> model</c><00:05:51.520><c> I</c><00:05:51.759><c> selected</c> 00:05:52.070 --> 00:05:52.080 align:start position:0% product, which is the model I selected 00:05:52.080 --> 00:05:54.469 align:start position:0% product, which is the model I selected during<00:05:52.400><c> setup,</c><00:05:53.120><c> click</c><00:05:53.360><c> on</c><00:05:53.520><c> the</c><00:05:53.680><c> schema,</c><00:05:54.160><c> I</c><00:05:54.320><c> can</c> 00:05:54.469 --> 00:05:54.479 align:start position:0% during setup, click on the schema, I can 00:05:54.479 --> 00:05:56.469 align:start position:0% during setup, click on the schema, I can see<00:05:54.639><c> it's</c><00:05:54.880><c> got</c><00:05:55.039><c> all</c><00:05:55.199><c> of</c><00:05:55.360><c> these</c><00:05:55.680><c> fields.</c><00:05:56.240><c> These</c> 00:05:56.469 --> 00:05:56.479 align:start position:0% see it's got all of these fields. These 00:05:56.479 --> 00:06:00.070 align:start position:0% see it's got all of these fields. These are<00:05:56.720><c> like</c><00:05:56.960><c> columns</c><00:05:57.440><c> in</c><00:05:57.680><c> my</c><00:05:57.919><c> database</c><00:05:58.639><c> table.</c><00:05:59.840><c> I</c> 00:06:00.070 --> 00:06:00.080 align:start position:0% are like columns in my database table. I 00:06:00.080 --> 00:06:02.230 align:start position:0% are like columns in my database table. I own<00:06:00.320><c> these</c><00:06:00.560><c> models.</c><00:06:01.120><c> So</c><00:06:01.360><c> just</c><00:06:01.520><c> because</c><00:06:01.759><c> Gadget</c> 00:06:02.230 --> 00:06:02.240 align:start position:0% own these models. So just because Gadget 00:06:02.240 --> 00:06:03.749 align:start position:0% own these models. So just because Gadget populated<00:06:02.639><c> all</c><00:06:02.720><c> this</c><00:06:02.880><c> for</c><00:06:03.039><c> me</c><00:06:03.199><c> doesn't</c><00:06:03.440><c> mean</c><00:06:03.520><c> I</c> 00:06:03.749 --> 00:06:03.759 align:start position:0% populated all this for me doesn't mean I 00:06:03.759 --> 00:06:05.510 align:start position:0% populated all this for me doesn't mean I need<00:06:03.840><c> to</c><00:06:04.000><c> leave</c><00:06:04.160><c> it</c><00:06:04.319><c> as</c><00:06:04.479><c> is.</c><00:06:05.039><c> I</c><00:06:05.199><c> can</c><00:06:05.280><c> go</c><00:06:05.360><c> ahead</c> 00:06:05.510 --> 00:06:05.520 align:start position:0% need to leave it as is. I can go ahead 00:06:05.520 --> 00:06:07.670 align:start position:0% need to leave it as is. I can go ahead and<00:06:05.680><c> add</c><00:06:05.840><c> custom</c><00:06:06.160><c> models.</c><00:06:07.280><c> This</c><00:06:07.440><c> is</c> 00:06:07.670 --> 00:06:07.680 align:start position:0% and add custom models. This is 00:06:07.680 --> 00:06:09.270 align:start position:0% and add custom models. This is particularly<00:06:08.160><c> nice</c><00:06:08.400><c> if</c><00:06:08.560><c> I'm</c><00:06:08.720><c> storing</c><00:06:08.960><c> metap</c> 00:06:09.270 --> 00:06:09.280 align:start position:0% particularly nice if I'm storing metap 00:06:09.280 --> 00:06:10.870 align:start position:0% particularly nice if I'm storing metap field<00:06:09.520><c> information</c><00:06:09.919><c> from</c><00:06:10.160><c> Shopify.</c><00:06:10.560><c> I</c><00:06:10.720><c> can</c> 00:06:10.870 --> 00:06:10.880 align:start position:0% field information from Shopify. I can 00:06:10.880 --> 00:06:13.270 align:start position:0% field information from Shopify. I can inline<00:06:11.280><c> all</c><00:06:11.440><c> of</c><00:06:11.520><c> my</c><00:06:11.840><c> product</c><00:06:12.240><c> meta</c><00:06:12.560><c> fields</c> 00:06:13.270 --> 00:06:13.280 align:start position:0% inline all of my product meta fields 00:06:13.280 --> 00:06:16.070 align:start position:0% inline all of my product meta fields alongside<00:06:13.919><c> the</c><00:06:14.160><c> actual</c><00:06:14.880><c> product</c><00:06:15.280><c> record.</c> 00:06:16.070 --> 00:06:16.080 align:start position:0% alongside the actual product record. 00:06:16.080 --> 00:06:17.830 align:start position:0% alongside the actual product record. I'll<00:06:16.319><c> just</c><00:06:16.479><c> delete</c><00:06:16.800><c> that</c><00:06:16.960><c> for</c><00:06:17.120><c> now.</c><00:06:17.440><c> And</c><00:06:17.680><c> and</c> 00:06:17.830 --> 00:06:17.840 align:start position:0% I'll just delete that for now. And and 00:06:17.840 --> 00:06:19.670 align:start position:0% I'll just delete that for now. And and speaking<00:06:18.080><c> of</c><00:06:18.240><c> deleting,</c><00:06:18.960><c> I</c><00:06:19.199><c> really</c><00:06:19.360><c> just</c><00:06:19.600><c> need</c> 00:06:19.670 --> 00:06:19.680 align:start position:0% speaking of deleting, I really just need 00:06:19.680 --> 00:06:22.070 align:start position:0% speaking of deleting, I really just need the<00:06:20.160><c> body</c><00:06:20.560><c> field</c><00:06:20.960><c> here.</c><00:06:21.280><c> So</c><00:06:21.440><c> if</c><00:06:21.680><c> I</c><00:06:21.759><c> want</c><00:06:21.840><c> to</c><00:06:22.000><c> go</c> 00:06:22.070 --> 00:06:22.080 align:start position:0% the body field here. So if I want to go 00:06:22.080 --> 00:06:24.950 align:start position:0% the body field here. So if I want to go ahead<00:06:22.240><c> and</c><00:06:22.560><c> let's</c><00:06:22.800><c> get</c><00:06:22.880><c> rid</c><00:06:23.039><c> of</c><00:06:23.199><c> vendor.</c> 00:06:24.950 --> 00:06:24.960 align:start position:0% ahead and let's get rid of vendor. 00:06:24.960 --> 00:06:27.350 align:start position:0% ahead and let's get rid of vendor. I<00:06:25.199><c> can</c><00:06:25.360><c> do</c><00:06:25.520><c> that.</c><00:06:25.919><c> Store</c><00:06:26.240><c> less</c><00:06:26.560><c> data.</c><00:06:27.120><c> That's</c> 00:06:27.350 --> 00:06:27.360 align:start position:0% I can do that. Store less data. That's 00:06:27.360 --> 00:06:29.830 align:start position:0% I can do that. Store less data. That's good.<00:06:28.080><c> So</c><00:06:28.240><c> I</c><00:06:28.400><c> can</c><00:06:28.479><c> go</c><00:06:28.560><c> ahead</c><00:06:28.800><c> and</c><00:06:29.199><c> manipulate</c> 00:06:29.830 --> 00:06:29.840 align:start position:0% good. So I can go ahead and manipulate 00:06:29.840 --> 00:06:32.070 align:start position:0% good. So I can go ahead and manipulate these<00:06:30.160><c> models</c><00:06:30.560><c> however</c><00:06:30.960><c> I</c><00:06:31.199><c> want.</c><00:06:31.680><c> You'll</c><00:06:31.919><c> see</c> 00:06:32.070 --> 00:06:32.080 align:start position:0% these models however I want. You'll see 00:06:32.080 --> 00:06:34.150 align:start position:0% these models however I want. You'll see that<00:06:32.319><c> gadget</c><00:06:32.720><c> also</c><00:06:33.039><c> generated</c><00:06:33.440><c> a</c><00:06:33.680><c> Shopify</c> 00:06:34.150 --> 00:06:34.160 align:start position:0% that gadget also generated a Shopify 00:06:34.160 --> 00:06:36.870 align:start position:0% that gadget also generated a Shopify GDPR<00:06:34.800><c> request.</c><00:06:35.280><c> Shop</c><00:06:35.680><c> and</c><00:06:35.919><c> sync</c><00:06:36.240><c> model.</c><00:06:36.639><c> These</c> 00:06:36.870 --> 00:06:36.880 align:start position:0% GDPR request. Shop and sync model. These 00:06:36.880 --> 00:06:39.029 align:start position:0% GDPR request. Shop and sync model. These are<00:06:36.960><c> going</c><00:06:37.039><c> to</c><00:06:37.120><c> be</c><00:06:37.759><c> created</c><00:06:38.160><c> for</c><00:06:38.400><c> you</c><00:06:38.639><c> every</c> 00:06:39.029 --> 00:06:39.039 align:start position:0% are going to be created for you every 00:06:39.039 --> 00:06:42.950 align:start position:0% are going to be created for you every time<00:06:39.440><c> you</c><00:06:40.000><c> connect</c><00:06:40.479><c> to</c><00:06:40.960><c> Shopify.</c><00:06:42.319><c> Shop</c><00:06:42.639><c> holds</c> 00:06:42.950 --> 00:06:42.960 align:start position:0% time you connect to Shopify. Shop holds 00:06:42.960 --> 00:06:45.510 align:start position:0% time you connect to Shopify. Shop holds your<00:06:43.280><c> shop</c><00:06:43.600><c> records.</c><00:06:43.919><c> Of</c><00:06:44.080><c> course,</c><00:06:44.720><c> sync</c><00:06:45.120><c> holds</c> 00:06:45.510 --> 00:06:45.520 align:start position:0% your shop records. Of course, sync holds 00:06:45.520 --> 00:06:47.990 align:start position:0% your shop records. Of course, sync holds records<00:06:46.000><c> of</c><00:06:46.319><c> any</c><00:06:46.720><c> historical</c><00:06:47.280><c> data</c><00:06:47.600><c> syncs</c> 00:06:47.990 --> 00:06:48.000 align:start position:0% records of any historical data syncs 00:06:48.000 --> 00:06:50.629 align:start position:0% records of any historical data syncs you've<00:06:48.240><c> run.</c><00:06:48.720><c> And</c><00:06:48.960><c> GDPR</c><00:06:49.520><c> request</c><00:06:49.919><c> is</c><00:06:50.160><c> good</c><00:06:50.400><c> for</c> 00:06:50.629 --> 00:06:50.639 align:start position:0% you've run. And GDPR request is good for 00:06:50.639 --> 00:06:53.510 align:start position:0% you've run. And GDPR request is good for compliance<00:06:51.440><c> requests.</c><00:06:52.800><c> This</c><00:06:53.039><c> is</c><00:06:53.199><c> more</c> 00:06:53.510 --> 00:06:53.520 align:start position:0% compliance requests. This is more 00:06:53.520 --> 00:06:55.350 align:start position:0% compliance requests. This is more important<00:06:53.840><c> for</c><00:06:54.160><c> your</c><00:06:54.479><c> public</c><00:06:54.800><c> apps</c><00:06:55.120><c> on</c> 00:06:55.350 --> 00:06:55.360 align:start position:0% important for your public apps on 00:06:55.360 --> 00:06:57.749 align:start position:0% important for your public apps on Shopify's<00:06:55.919><c> app</c><00:06:56.160><c> store.</c> 00:06:57.749 --> 00:06:57.759 align:start position:0% Shopify's app store. 00:06:57.759 --> 00:06:59.270 align:start position:0% Shopify's app store. Now,<00:06:58.000><c> as</c><00:06:58.240><c> you</c><00:06:58.400><c> go</c><00:06:58.479><c> ahead</c><00:06:58.639><c> and</c><00:06:58.800><c> create</c><00:06:58.960><c> models,</c> 00:06:59.270 --> 00:06:59.280 align:start position:0% Now, as you go ahead and create models, 00:06:59.280 --> 00:07:00.230 align:start position:0% Now, as you go ahead and create models, whether<00:06:59.440><c> it's</c><00:06:59.599><c> through</c><00:06:59.759><c> the</c><00:06:59.840><c> Shopify</c> 00:07:00.230 --> 00:07:00.240 align:start position:0% whether it's through the Shopify 00:07:00.240 --> 00:07:02.390 align:start position:0% whether it's through the Shopify connection<00:07:00.479><c> or</c><00:07:00.960><c> create</c><00:07:01.199><c> a</c><00:07:01.360><c> custom</c><00:07:01.680><c> model</c><00:07:02.000><c> in</c><00:07:02.240><c> a</c> 00:07:02.390 --> 00:07:02.400 align:start position:0% connection or create a custom model in a 00:07:02.400 --> 00:07:05.430 align:start position:0% connection or create a custom model in a bit,<00:07:02.960><c> we're</c><00:07:03.280><c> also,</c><00:07:04.400><c> and</c><00:07:04.639><c> by</c><00:07:04.880><c> we,</c><00:07:05.120><c> I</c><00:07:05.280><c> mean</c> 00:07:05.430 --> 00:07:05.440 align:start position:0% bit, we're also, and by we, I mean 00:07:05.440 --> 00:07:08.390 align:start position:0% bit, we're also, and by we, I mean Gadget,<00:07:06.000><c> is</c><00:07:06.240><c> also</c><00:07:06.639><c> generating</c><00:07:07.199><c> a</c><00:07:07.599><c> CRUD</c><00:07:07.919><c> API</c> 00:07:08.390 --> 00:07:08.400 align:start position:0% Gadget, is also generating a CRUD API 00:07:08.400 --> 00:07:10.070 align:start position:0% Gadget, is also generating a CRUD API for<00:07:08.560><c> you.</c><00:07:08.720><c> So</c><00:07:08.880><c> that's</c><00:07:09.120><c> create,</c><00:07:09.440><c> read,</c><00:07:09.680><c> update,</c> 00:07:10.070 --> 00:07:10.080 align:start position:0% for you. So that's create, read, update, 00:07:10.080 --> 00:07:12.710 align:start position:0% for you. So that's create, read, update, delete.<00:07:10.240><c> So</c><00:07:10.400><c> if</c><00:07:10.560><c> I</c><00:07:10.880><c> click</c><00:07:11.120><c> on</c><00:07:11.360><c> my</c><00:07:12.319><c> got</c><00:07:12.560><c> my</c> 00:07:12.710 --> 00:07:12.720 align:start position:0% delete. So if I click on my got my 00:07:12.720 --> 00:07:15.670 align:start position:0% delete. So if I click on my got my actions<00:07:13.199><c> folder.</c><00:07:13.599><c> If</c><00:07:13.759><c> I</c><00:07:13.919><c> click</c><00:07:14.080><c> on</c><00:07:14.319><c> create,</c><00:07:15.360><c> I</c> 00:07:15.670 --> 00:07:15.680 align:start position:0% actions folder. If I click on create, I 00:07:15.680 --> 00:07:18.629 align:start position:0% actions folder. If I click on create, I can<00:07:15.840><c> see</c><00:07:16.160><c> that</c><00:07:16.960><c> I've</c><00:07:17.280><c> got</c><00:07:17.599><c> a</c><00:07:17.919><c> serverless</c><00:07:18.400><c> node</c> 00:07:18.629 --> 00:07:18.639 align:start position:0% can see that I've got a serverless node 00:07:18.639 --> 00:07:21.029 align:start position:0% can see that I've got a serverless node function<00:07:18.960><c> here.</c><00:07:19.919><c> And</c><00:07:20.240><c> all</c><00:07:20.400><c> it's</c><00:07:20.639><c> doing</c><00:07:20.800><c> by</c> 00:07:21.029 --> 00:07:21.039 align:start position:0% function here. And all it's doing by 00:07:21.039 --> 00:07:22.950 align:start position:0% function here. And all it's doing by default<00:07:21.280><c> is</c><00:07:21.599><c> going</c><00:07:21.680><c> to</c><00:07:21.840><c> save</c><00:07:22.240><c> my</c><00:07:22.560><c> record,</c> 00:07:22.950 --> 00:07:22.960 align:start position:0% default is going to save my record, 00:07:22.960 --> 00:07:24.710 align:start position:0% default is going to save my record, which<00:07:23.199><c> is</c><00:07:23.280><c> my</c><00:07:23.440><c> Shopify</c><00:07:23.919><c> product.</c><00:07:24.160><c> If</c><00:07:24.319><c> I</c><00:07:24.479><c> hover</c> 00:07:24.710 --> 00:07:24.720 align:start position:0% which is my Shopify product. If I hover 00:07:24.720 --> 00:07:27.990 align:start position:0% which is my Shopify product. If I hover over<00:07:24.960><c> it,</c><00:07:25.599><c> to</c><00:07:25.840><c> my</c><00:07:26.160><c> gadget</c><00:07:26.639><c> database.</c><00:07:27.680><c> These</c> 00:07:27.990 --> 00:07:28.000 align:start position:0% over it, to my gadget database. These 00:07:28.000 --> 00:07:29.510 align:start position:0% over it, to my gadget database. These are<00:07:28.080><c> fully</c><00:07:28.319><c> extensible.</c><00:07:28.880><c> So</c><00:07:29.039><c> you</c><00:07:29.199><c> can</c><00:07:29.280><c> see</c> 00:07:29.510 --> 00:07:29.520 align:start position:0% are fully extensible. So you can see 00:07:29.520 --> 00:07:31.270 align:start position:0% are fully extensible. So you can see your<00:07:29.840><c> logic</c><00:07:30.160><c> goes</c><00:07:30.400><c> here.</c><00:07:30.639><c> You</c><00:07:30.800><c> can</c><00:07:30.960><c> go</c><00:07:31.039><c> ahead</c> 00:07:31.270 --> 00:07:31.280 align:start position:0% your logic goes here. You can go ahead 00:07:31.280 --> 00:07:35.830 align:start position:0% your logic goes here. You can go ahead and<00:07:31.599><c> extend</c><00:07:32.400><c> these</c><00:07:33.759><c> actions</c><00:07:34.479><c> as</c><00:07:34.880><c> needed.</c><00:07:35.599><c> One</c> 00:07:35.830 --> 00:07:35.840 align:start position:0% and extend these actions as needed. One 00:07:35.840 --> 00:07:38.150 align:start position:0% and extend these actions as needed. One more<00:07:36.000><c> thing</c><00:07:36.160><c> to</c><00:07:36.319><c> point</c><00:07:36.479><c> out</c><00:07:37.360><c> off</c><00:07:37.599><c> to</c><00:07:37.840><c> the</c><00:07:37.919><c> right</c> 00:07:38.150 --> 00:07:38.160 align:start position:0% more thing to point out off to the right 00:07:38.160 --> 00:07:40.790 align:start position:0% more thing to point out off to the right here,<00:07:38.479><c> the</c><00:07:38.800><c> triggers</c><00:07:39.599><c> section.</c><00:07:40.319><c> So</c><00:07:40.560><c> this</c><00:07:40.720><c> is</c> 00:07:40.790 --> 00:07:40.800 align:start position:0% here, the triggers section. So this is 00:07:40.800 --> 00:07:42.710 align:start position:0% here, the triggers section. So this is what's<00:07:41.039><c> actually</c><00:07:41.280><c> going</c><00:07:41.440><c> to</c><00:07:41.680><c> trigger</c><00:07:42.319><c> this</c> 00:07:42.710 --> 00:07:42.720 align:start position:0% what's actually going to trigger this 00:07:42.720 --> 00:07:46.070 align:start position:0% what's actually going to trigger this action<00:07:43.199><c> run.</c><00:07:44.160><c> So</c><00:07:44.880><c> when</c><00:07:45.039><c> a</c><00:07:45.199><c> Shopify</c><00:07:45.680><c> web</c><00:07:45.840><c> hook</c> 00:07:46.070 --> 00:07:46.080 align:start position:0% action run. So when a Shopify web hook 00:07:46.080 --> 00:07:48.870 align:start position:0% action run. So when a Shopify web hook comes<00:07:46.319><c> in</c><00:07:47.440><c> or</c><00:07:47.759><c> when</c><00:07:47.919><c> I</c><00:07:48.080><c> run</c><00:07:48.160><c> that</c><00:07:48.479><c> historical</c> 00:07:48.870 --> 00:07:48.880 align:start position:0% comes in or when I run that historical 00:07:48.880 --> 00:07:53.189 align:start position:0% comes in or when I run that historical data<00:07:49.199><c> sync,</c><00:07:50.000><c> it</c><00:07:50.240><c> could</c><00:07:50.960><c> run</c><00:07:51.520><c> this</c><00:07:52.400><c> create</c><00:07:52.880><c> code</c> 00:07:53.189 --> 00:07:53.199 align:start position:0% data sync, it could run this create code 00:07:53.199 --> 00:07:56.150 align:start position:0% data sync, it could run this create code here.<00:07:53.840><c> So</c><00:07:54.080><c> that's</c><00:07:54.400><c> important.</c><00:07:55.599><c> Notably</c> 00:07:56.150 --> 00:07:56.160 align:start position:0% here. So that's important. Notably 00:07:56.160 --> 00:07:58.550 align:start position:0% here. So that's important. Notably absent<00:07:56.639><c> is</c><00:07:56.960><c> an</c><00:07:57.280><c> API</c><00:07:57.759><c> request,</c><00:07:58.160><c> and</c><00:07:58.319><c> we're</c> 00:07:58.550 --> 00:07:58.560 align:start position:0% absent is an API request, and we're 00:07:58.560 --> 00:08:01.670 align:start position:0% absent is an API request, and we're going<00:07:58.639><c> to</c><00:07:58.960><c> check</c><00:07:59.199><c> that</c><00:07:59.440><c> out</c><00:08:00.240><c> when</c><00:08:00.960><c> I</c><00:08:01.280><c> create</c><00:08:01.440><c> a</c> 00:08:01.670 --> 00:08:01.680 align:start position:0% going to check that out when I create a 00:08:01.680 --> 00:08:03.510 align:start position:0% going to check that out when I create a custom<00:08:02.000><c> model.</c> 00:08:03.510 --> 00:08:03.520 align:start position:0% custom model. 00:08:03.520 --> 00:08:05.110 align:start position:0% custom model. So<00:08:03.680><c> that's</c><00:08:03.919><c> fantastic.</c><00:08:04.400><c> This</c><00:08:04.639><c> is</c><00:08:04.720><c> kind</c><00:08:04.879><c> of</c><00:08:04.960><c> the</c> 00:08:05.110 --> 00:08:05.120 align:start position:0% So that's fantastic. This is kind of the 00:08:05.120 --> 00:08:07.909 align:start position:0% So that's fantastic. This is kind of the basics<00:08:05.520><c> of</c><00:08:05.840><c> our</c><00:08:06.319><c> Shopify</c><00:08:06.960><c> connection</c><00:08:07.520><c> on</c> 00:08:07.909 --> 00:08:07.919 align:start position:0% basics of our Shopify connection on 00:08:07.919 --> 00:08:10.070 align:start position:0% basics of our Shopify connection on Gadget.<00:08:08.800><c> All</c><00:08:08.960><c> the</c><00:08:09.120><c> Shopify</c><00:08:09.440><c> boiler</c><00:08:09.759><c> plate</c><00:08:10.000><c> is</c> 00:08:10.070 --> 00:08:10.080 align:start position:0% Gadget. All the Shopify boiler plate is 00:08:10.080 --> 00:08:11.589 align:start position:0% Gadget. All the Shopify boiler plate is handled<00:08:10.319><c> for</c><00:08:10.479><c> me.</c><00:08:10.639><c> The</c><00:08:10.800><c> whole</c><00:08:11.039><c> idea</c><00:08:11.280><c> behind</c> 00:08:11.589 --> 00:08:11.599 align:start position:0% handled for me. The whole idea behind 00:08:11.599 --> 00:08:14.309 align:start position:0% handled for me. The whole idea behind Gadget<00:08:11.919><c> is</c><00:08:12.080><c> that</c><00:08:12.240><c> you</c><00:08:12.400><c> just</c><00:08:12.560><c> focus</c><00:08:12.960><c> on</c> 00:08:14.309 --> 00:08:14.319 align:start position:0% Gadget is that you just focus on 00:08:14.319 --> 00:08:15.990 align:start position:0% Gadget is that you just focus on building<00:08:14.639><c> and</c><00:08:14.879><c> writing</c><00:08:15.120><c> what's</c><00:08:15.440><c> unique</c><00:08:15.759><c> to</c> 00:08:15.990 --> 00:08:16.000 align:start position:0% building and writing what's unique to 00:08:16.000 --> 00:08:18.150 align:start position:0% building and writing what's unique to your<00:08:16.160><c> app.</c><00:08:16.560><c> So</c><00:08:17.039><c> speaking</c><00:08:17.360><c> of</c><00:08:17.520><c> that,</c><00:08:17.840><c> let's</c> 00:08:18.150 --> 00:08:18.160 align:start position:0% your app. So speaking of that, let's 00:08:18.160 --> 00:08:20.150 align:start position:0% your app. So speaking of that, let's create<00:08:18.319><c> a</c><00:08:18.639><c> custom</c><00:08:18.960><c> data</c><00:08:19.199><c> model.</c><00:08:19.680><c> If</c><00:08:19.840><c> I</c><00:08:20.000><c> click</c> 00:08:20.150 --> 00:08:20.160 align:start position:0% create a custom data model. If I click 00:08:20.160 --> 00:08:21.830 align:start position:0% create a custom data model. If I click on<00:08:20.240><c> the</c><00:08:20.400><c> plus</c><00:08:20.639><c> here</c><00:08:20.800><c> and</c><00:08:20.960><c> just</c><00:08:21.120><c> go</c><00:08:21.280><c> allowed</c> 00:08:21.830 --> 00:08:21.840 align:start position:0% on the plus here and just go allowed 00:08:21.840 --> 00:08:25.029 align:start position:0% on the plus here and just go allowed tag,<00:08:23.199><c> boom,</c><00:08:23.919><c> just</c><00:08:24.160><c> like</c><00:08:24.319><c> that,</c><00:08:24.639><c> database</c> 00:08:25.029 --> 00:08:25.039 align:start position:0% tag, boom, just like that, database 00:08:25.039 --> 00:08:27.270 align:start position:0% tag, boom, just like that, database migrations<00:08:25.520><c> are</c><00:08:25.759><c> run</c><00:08:26.000><c> under</c><00:08:26.240><c> the</c><00:08:26.400><c> hood</c><00:08:27.039><c> and</c> 00:08:27.270 --> 00:08:27.280 align:start position:0% migrations are run under the hood and 00:08:27.280 --> 00:08:30.070 align:start position:0% migrations are run under the hood and I've<00:08:27.520><c> got</c><00:08:27.599><c> an</c><00:08:27.840><c> allowed</c><00:08:28.160><c> tag</c><00:08:28.560><c> table</c><00:08:29.280><c> in</c><00:08:29.520><c> my</c><00:08:29.680><c> app.</c> 00:08:30.070 --> 00:08:30.080 align:start position:0% I've got an allowed tag table in my app. 00:08:30.080 --> 00:08:33.110 align:start position:0% I've got an allowed tag table in my app. My<00:08:30.319><c> allowed</c><00:08:30.639><c> tag</c><00:08:30.879><c> model</c><00:08:32.240><c> schema</c><00:08:32.640><c> is</c><00:08:32.880><c> pretty</c> 00:08:33.110 --> 00:08:33.120 align:start position:0% My allowed tag model schema is pretty 00:08:33.120 --> 00:08:34.870 align:start position:0% My allowed tag model schema is pretty bare<00:08:33.440><c> bones</c><00:08:33.760><c> to</c><00:08:33.919><c> start.</c><00:08:34.159><c> It'll</c><00:08:34.399><c> give</c><00:08:34.560><c> you</c><00:08:34.719><c> an</c> 00:08:34.870 --> 00:08:34.880 align:start position:0% bare bones to start. It'll give you an 00:08:34.880 --> 00:08:38.070 align:start position:0% bare bones to start. It'll give you an ID,<00:08:35.599><c> some</c><00:08:36.000><c> timestamps</c><00:08:36.880><c> to</c><00:08:37.200><c> manage</c><00:08:37.760><c> record</c> 00:08:38.070 --> 00:08:38.080 align:start position:0% ID, some timestamps to manage record 00:08:38.080 --> 00:08:40.550 align:start position:0% ID, some timestamps to manage record updates<00:08:38.479><c> and</c><00:08:38.719><c> creation.</c><00:08:39.839><c> I</c><00:08:40.080><c> can</c><00:08:40.159><c> go</c><00:08:40.240><c> ahead</c><00:08:40.399><c> and</c> 00:08:40.550 --> 00:08:40.560 align:start position:0% updates and creation. I can go ahead and 00:08:40.560 --> 00:08:42.630 align:start position:0% updates and creation. I can go ahead and add<00:08:40.719><c> custom</c><00:08:41.039><c> fields</c><00:08:41.599><c> once</c><00:08:41.839><c> again.</c><00:08:42.240><c> Uh</c><00:08:42.479><c> let's</c> 00:08:42.630 --> 00:08:42.640 align:start position:0% add custom fields once again. Uh let's 00:08:42.640 --> 00:08:44.389 align:start position:0% add custom fields once again. Uh let's go<00:08:42.880><c> keyword.</c> 00:08:44.389 --> 00:08:44.399 align:start position:0% go keyword. 00:08:44.399 --> 00:08:45.829 align:start position:0% go keyword. So<00:08:44.560><c> this</c><00:08:44.720><c> is</c><00:08:44.800><c> just</c><00:08:44.959><c> where</c><00:08:45.120><c> I'm</c><00:08:45.279><c> going</c><00:08:45.279><c> to</c><00:08:45.440><c> store</c> 00:08:45.829 --> 00:08:45.839 align:start position:0% So this is just where I'm going to store 00:08:45.839 --> 00:08:48.870 align:start position:0% So this is just where I'm going to store keywords<00:08:46.320><c> that</c><00:08:46.640><c> are</c><00:08:46.880><c> entered</c><00:08:47.200><c> by</c><00:08:47.440><c> merchants.</c> 00:08:48.870 --> 00:08:48.880 align:start position:0% keywords that are entered by merchants. 00:08:48.880 --> 00:08:50.949 align:start position:0% keywords that are entered by merchants. And<00:08:49.200><c> this</c><00:08:49.360><c> is</c><00:08:49.519><c> a</c><00:08:49.760><c> string</c><00:08:50.160><c> type.</c><00:08:50.560><c> I'm</c><00:08:50.800><c> happy</c> 00:08:50.949 --> 00:08:50.959 align:start position:0% And this is a string type. I'm happy 00:08:50.959 --> 00:08:53.030 align:start position:0% And this is a string type. I'm happy with<00:08:51.200><c> that.</c><00:08:51.920><c> Got</c><00:08:52.080><c> a</c><00:08:52.240><c> bunch</c><00:08:52.560><c> support</c><00:08:52.800><c> for</c><00:08:52.959><c> a</c> 00:08:53.030 --> 00:08:53.040 align:start position:0% with that. Got a bunch support for a 00:08:53.040 --> 00:08:54.389 align:start position:0% with that. Got a bunch support for a bunch<00:08:53.120><c> of</c><00:08:53.200><c> types</c><00:08:53.519><c> including</c><00:08:53.760><c> vectors.</c> 00:08:54.389 --> 00:08:54.399 align:start position:0% bunch of types including vectors. 00:08:54.399 --> 00:08:57.350 align:start position:0% bunch of types including vectors. There's<00:08:54.800><c> file</c><00:08:55.200><c> storage</c><00:08:56.320><c> built</c><00:08:56.560><c> into</c><00:08:56.880><c> gadget</c> 00:08:57.350 --> 00:08:57.360 align:start position:0% There's file storage built into gadget 00:08:57.360 --> 00:08:59.110 align:start position:0% There's file storage built into gadget files<00:08:57.760><c> right</c><00:08:58.000><c> here</c><00:08:58.560><c> as</c><00:08:58.800><c> well</c><00:08:58.880><c> as</c> 00:08:59.110 --> 00:08:59.120 align:start position:0% files right here as well as 00:08:59.120 --> 00:09:00.790 align:start position:0% files right here as well as relationship.<00:08:59.839><c> So</c><00:09:00.080><c> postgress</c><00:09:00.640><c> is</c> 00:09:00.790 --> 00:09:00.800 align:start position:0% relationship. So postgress is 00:09:00.800 --> 00:09:03.110 align:start position:0% relationship. So postgress is relational.<00:09:01.279><c> So</c><00:09:01.440><c> you</c><00:09:01.600><c> can</c><00:09:01.920><c> relate</c><00:09:02.399><c> your</c><00:09:02.800><c> data</c> 00:09:03.110 --> 00:09:03.120 align:start position:0% relational. So you can relate your data 00:09:03.120 --> 00:09:05.670 align:start position:0% relational. So you can relate your data models<00:09:03.519><c> as</c><00:09:03.760><c> well.</c><00:09:05.120><c> There's</c><00:09:05.360><c> also</c><00:09:05.519><c> some</c> 00:09:05.670 --> 00:09:05.680 align:start position:0% models as well. There's also some 00:09:05.680 --> 00:09:07.269 align:start position:0% models as well. There's also some built-in<00:09:06.000><c> validations</c><00:09:06.480><c> or</c><00:09:06.720><c> I</c><00:09:06.880><c> can</c><00:09:06.959><c> write</c><00:09:07.120><c> my</c> 00:09:07.269 --> 00:09:07.279 align:start position:0% built-in validations or I can write my 00:09:07.279 --> 00:09:09.910 align:start position:0% built-in validations or I can write my own.<00:09:07.440><c> I'm</c><00:09:07.680><c> going</c><00:09:07.760><c> to</c><00:09:07.839><c> make</c><00:09:08.560><c> keyword</c><00:09:09.120><c> required.</c> 00:09:09.910 --> 00:09:09.920 align:start position:0% own. I'm going to make keyword required. 00:09:09.920 --> 00:09:11.910 align:start position:0% own. I'm going to make keyword required. Uh<00:09:10.160><c> it</c><00:09:10.320><c> doesn't</c><00:09:10.480><c> really</c><00:09:10.640><c> make</c><00:09:10.800><c> sense</c><00:09:11.040><c> to</c><00:09:11.680><c> make</c> 00:09:11.910 --> 00:09:11.920 align:start position:0% Uh it doesn't really make sense to make 00:09:11.920 --> 00:09:13.990 align:start position:0% Uh it doesn't really make sense to make an<00:09:12.080><c> allowed</c><00:09:12.480><c> tag</c><00:09:12.800><c> record</c><00:09:13.120><c> without</c><00:09:13.360><c> a</c><00:09:13.519><c> keyword.</c> 00:09:13.990 --> 00:09:14.000 align:start position:0% an allowed tag record without a keyword. 00:09:14.000 --> 00:09:15.670 align:start position:0% an allowed tag record without a keyword. So<00:09:14.160><c> it's</c><00:09:14.399><c> going</c><00:09:14.480><c> to</c><00:09:14.560><c> be</c><00:09:14.720><c> required.</c><00:09:15.040><c> If</c><00:09:15.279><c> I</c><00:09:15.519><c> try</c> 00:09:15.670 --> 00:09:15.680 align:start position:0% So it's going to be required. If I try 00:09:15.680 --> 00:09:18.070 align:start position:0% So it's going to be required. If I try and<00:09:15.839><c> create</c><00:09:16.000><c> it</c><00:09:16.160><c> without</c><00:09:16.399><c> that,</c><00:09:17.040><c> it'll</c><00:09:17.440><c> fail</c> 00:09:18.070 --> 00:09:18.080 align:start position:0% and create it without that, it'll fail 00:09:18.080 --> 00:09:21.430 align:start position:0% and create it without that, it'll fail or<00:09:18.320><c> the</c><00:09:18.480><c> action</c><00:09:18.800><c> will</c><00:09:18.959><c> fail.</c><00:09:20.399><c> Speaking</c><00:09:20.800><c> of</c><00:09:21.120><c> my</c> 00:09:21.430 --> 00:09:21.440 align:start position:0% or the action will fail. Speaking of my 00:09:21.440 --> 00:09:23.750 align:start position:0% or the action will fail. Speaking of my actions,<00:09:22.000><c> once</c><00:09:22.240><c> again,</c><00:09:22.720><c> Cred</c><00:09:22.959><c> API</c><00:09:23.360><c> generated.</c> 00:09:23.750 --> 00:09:23.760 align:start position:0% actions, once again, Cred API generated. 00:09:23.760 --> 00:09:25.190 align:start position:0% actions, once again, Cred API generated. We've<00:09:23.920><c> got</c><00:09:24.000><c> our</c><00:09:24.160><c> create,</c><00:09:24.399><c> update,</c><00:09:24.720><c> and</c><00:09:24.880><c> delete</c> 00:09:25.190 --> 00:09:25.200 align:start position:0% We've got our create, update, and delete 00:09:25.200 --> 00:09:28.150 align:start position:0% We've got our create, update, and delete actions<00:09:25.600><c> here.</c><00:09:26.240><c> So,</c><00:09:26.399><c> if</c><00:09:26.640><c> I</c><00:09:26.800><c> click</c><00:09:26.959><c> on</c><00:09:27.279><c> create,</c> 00:09:28.150 --> 00:09:28.160 align:start position:0% actions here. So, if I click on create, 00:09:28.160 --> 00:09:29.750 align:start position:0% actions here. So, if I click on create, it<00:09:28.399><c> looks</c><00:09:28.560><c> pretty</c><00:09:28.720><c> similar</c><00:09:28.959><c> to</c><00:09:29.120><c> my</c><00:09:29.279><c> Shopify</c> 00:09:29.750 --> 00:09:29.760 align:start position:0% it looks pretty similar to my Shopify 00:09:29.760 --> 00:09:32.949 align:start position:0% it looks pretty similar to my Shopify product<00:09:30.080><c> create.</c><00:09:31.440><c> One,</c><00:09:31.920><c> well,</c><00:09:32.240><c> couple</c><00:09:32.640><c> couple</c> 00:09:32.949 --> 00:09:32.959 align:start position:0% product create. One, well, couple couple 00:09:32.959 --> 00:09:34.790 align:start position:0% product create. One, well, couple couple key<00:09:33.200><c> differences.</c><00:09:33.920><c> The</c><00:09:34.080><c> main</c><00:09:34.240><c> one</c><00:09:34.399><c> I</c><00:09:34.640><c> want</c><00:09:34.720><c> to</c> 00:09:34.790 --> 00:09:34.800 align:start position:0% key differences. The main one I want to 00:09:34.800 --> 00:09:37.269 align:start position:0% key differences. The main one I want to point<00:09:34.959><c> out</c><00:09:35.120><c> here</c><00:09:35.360><c> is</c><00:09:35.600><c> the</c><00:09:35.920><c> triggers</c><00:09:36.640><c> section.</c> 00:09:37.269 --> 00:09:37.279 align:start position:0% point out here is the triggers section. 00:09:37.279 --> 00:09:40.310 align:start position:0% point out here is the triggers section. So,<00:09:37.839><c> this</c><00:09:38.000><c> is</c><00:09:38.160><c> now</c><00:09:38.399><c> a</c><00:09:38.640><c> generate</c><00:09:39.360><c> API</c><00:09:39.839><c> endpoint.</c> 00:09:40.310 --> 00:09:40.320 align:start position:0% So, this is now a generate API endpoint. 00:09:40.320 --> 00:09:42.389 align:start position:0% So, this is now a generate API endpoint. So,<00:09:40.480><c> the</c><00:09:40.640><c> only</c><00:09:40.800><c> way</c><00:09:40.959><c> for</c><00:09:41.120><c> me</c><00:09:41.279><c> to</c><00:09:41.680><c> create</c><00:09:42.160><c> my</c> 00:09:42.389 --> 00:09:42.399 align:start position:0% So, the only way for me to create my 00:09:42.399 --> 00:09:43.990 align:start position:0% So, the only way for me to create my allowed<00:09:42.720><c> tags,</c><00:09:43.120><c> there's</c><00:09:43.360><c> obviously</c><00:09:43.600><c> no</c><00:09:43.760><c> web</c> 00:09:43.990 --> 00:09:44.000 align:start position:0% allowed tags, there's obviously no web 00:09:44.000 --> 00:09:46.710 align:start position:0% allowed tags, there's obviously no web hooks<00:09:44.240><c> for</c><00:09:44.399><c> it,</c><00:09:45.040><c> is</c><00:09:45.360><c> to</c><00:09:45.600><c> go</c><00:09:45.760><c> ahead</c><00:09:46.000><c> and</c><00:09:46.320><c> call</c><00:09:46.480><c> my</c> 00:09:46.710 --> 00:09:46.720 align:start position:0% hooks for it, is to go ahead and call my 00:09:46.720 --> 00:09:48.470 align:start position:0% hooks for it, is to go ahead and call my action.<00:09:47.440><c> Under</c><00:09:47.680><c> the</c><00:09:47.760><c> hood,</c><00:09:48.160><c> everything</c> 00:09:48.470 --> 00:09:48.480 align:start position:0% action. Under the hood, everything 00:09:48.480 --> 00:09:51.110 align:start position:0% action. Under the hood, everything gadget<00:09:48.880><c> is</c><00:09:49.120><c> GraphQL.</c><00:09:50.160><c> But</c><00:09:50.399><c> that</c><00:09:50.560><c> said,</c><00:09:50.800><c> we</c><00:09:50.959><c> are</c> 00:09:51.110 --> 00:09:51.120 align:start position:0% gadget is GraphQL. But that said, we are 00:09:51.120 --> 00:09:54.070 align:start position:0% gadget is GraphQL. But that said, we are generating<00:09:51.680><c> a</c><00:09:52.240><c> node</c><00:09:52.720><c> API</c><00:09:53.200><c> client</c><00:09:53.600><c> unique</c><00:09:53.920><c> to</c> 00:09:54.070 --> 00:09:54.080 align:start position:0% generating a node API client unique to 00:09:54.080 --> 00:09:56.310 align:start position:0% generating a node API client unique to your<00:09:54.320><c> app.</c><00:09:54.880><c> And</c><00:09:55.040><c> we've</c><00:09:55.279><c> got</c><00:09:55.519><c> some</c><00:09:55.839><c> useful</c> 00:09:56.310 --> 00:09:56.320 align:start position:0% your app. And we've got some useful 00:09:56.320 --> 00:09:59.030 align:start position:0% your app. And we've got some useful React<00:09:56.720><c> hooks</c><00:09:57.279><c> that</c><00:09:57.600><c> help</c><00:09:57.839><c> you</c><00:09:58.080><c> to</c><00:09:58.480><c> go</c><00:09:58.720><c> ahead</c> 00:09:59.030 --> 00:09:59.040 align:start position:0% React hooks that help you to go ahead 00:09:59.040 --> 00:10:01.190 align:start position:0% React hooks that help you to go ahead and<00:09:59.279><c> you</c><00:09:59.440><c> see</c><00:09:59.680><c> there's</c><00:09:59.920><c> a</c><00:10:00.160><c> use</c><00:10:00.560><c> action</c><00:10:00.880><c> hook</c> 00:10:01.190 --> 00:10:01.200 align:start position:0% and you see there's a use action hook 00:10:01.200 --> 00:10:04.790 align:start position:0% and you see there's a use action hook here.<00:10:01.519><c> When</c><00:10:01.680><c> we</c><00:10:02.160><c> pass</c><00:10:02.480><c> in</c><00:10:02.880><c> our</c><00:10:03.680><c> API</c><00:10:04.160><c> allow</c><00:10:04.480><c> tag</c> 00:10:04.790 --> 00:10:04.800 align:start position:0% here. When we pass in our API allow tag 00:10:04.800 --> 00:10:08.070 align:start position:0% here. When we pass in our API allow tag create<00:10:05.920><c> that</c><00:10:06.240><c> will</c><00:10:06.480><c> help</c><00:10:06.720><c> us</c><00:10:07.279><c> run</c><00:10:07.519><c> our</c><00:10:07.680><c> actions</c> 00:10:08.070 --> 00:10:08.080 align:start position:0% create that will help us run our actions 00:10:08.080 --> 00:10:10.710 align:start position:0% create that will help us run our actions in<00:10:08.240><c> the</c><00:10:08.399><c> front</c><00:10:08.560><c> end</c><00:10:08.720><c> in</c><00:10:08.959><c> a</c><00:10:09.200><c> very</c><00:10:09.440><c> reactful</c><00:10:10.000><c> way.</c> 00:10:10.710 --> 00:10:10.720 align:start position:0% in the front end in a very reactful way. 00:10:10.720 --> 00:10:12.150 align:start position:0% in the front end in a very reactful way. So<00:10:11.040><c> let's</c><00:10:11.279><c> go</c><00:10:11.360><c> ahead</c><00:10:11.519><c> and</c><00:10:11.680><c> test</c><00:10:11.839><c> out</c><00:10:12.000><c> our</c> 00:10:12.150 --> 00:10:12.160 align:start position:0% So let's go ahead and test out our 00:10:12.160 --> 00:10:15.910 align:start position:0% So let's go ahead and test out our action.<00:10:13.040><c> If</c><00:10:13.279><c> I</c><00:10:13.839><c> click</c><00:10:14.240><c> run</c><00:10:14.560><c> action,</c><00:10:15.360><c> opens</c><00:10:15.760><c> up</c> 00:10:15.910 --> 00:10:15.920 align:start position:0% action. If I click run action, opens up 00:10:15.920 --> 00:10:19.269 align:start position:0% action. If I click run action, opens up our<00:10:16.160><c> API</c><00:10:16.640><c> playground.</c><00:10:17.680><c> API</c><00:10:18.399><c> that</c><00:10:18.560><c> is</c><00:10:18.720><c> our</c><00:10:18.880><c> API</c> 00:10:19.269 --> 00:10:19.279 align:start position:0% our API playground. API that is our API 00:10:19.279 --> 00:10:20.949 align:start position:0% our API playground. API that is our API client.<00:10:19.600><c> Allowed</c><00:10:19.920><c> tag</c><00:10:20.160><c> is</c><00:10:20.320><c> my</c><00:10:20.399><c> model</c><00:10:20.640><c> name.</c> 00:10:20.949 --> 00:10:20.959 align:start position:0% client. Allowed tag is my model name. 00:10:20.959 --> 00:10:23.670 align:start position:0% client. Allowed tag is my model name. Create<00:10:21.200><c> is</c><00:10:21.440><c> my</c><00:10:21.680><c> action</c><00:10:22.079><c> name.</c><00:10:22.959><c> And</c><00:10:23.120><c> if</c><00:10:23.360><c> I</c><00:10:23.600><c> go</c> 00:10:23.670 --> 00:10:23.680 align:start position:0% Create is my action name. And if I go 00:10:23.680 --> 00:10:26.230 align:start position:0% Create is my action name. And if I go ahead 00:10:26.230 --> 00:10:26.240 align:start position:0% ahead 00:10:26.240 --> 00:10:29.110 align:start position:0% ahead cozy, 00:10:29.110 --> 00:10:29.120 align:start position:0% cozy, 00:10:29.120 --> 00:10:31.990 align:start position:0% cozy, I<00:10:29.360><c> can</c><00:10:29.519><c> see</c><00:10:29.680><c> I</c><00:10:29.920><c> have</c><00:10:30.320><c> created</c><00:10:30.880><c> a</c><00:10:31.200><c> record.</c><00:10:31.839><c> This</c> 00:10:31.990 --> 00:10:32.000 align:start position:0% I can see I have created a record. This 00:10:32.000 --> 00:10:34.069 align:start position:0% I can see I have created a record. This has<00:10:32.160><c> been</c><00:10:32.399><c> now</c><00:10:32.720><c> added</c><00:10:32.959><c> to</c><00:10:33.200><c> my</c><00:10:33.360><c> database.</c><00:10:33.760><c> So</c><00:10:33.920><c> if</c> 00:10:34.069 --> 00:10:34.079 align:start position:0% has been now added to my database. So if 00:10:34.079 --> 00:10:36.389 align:start position:0% has been now added to my database. So if I<00:10:34.160><c> click</c><00:10:34.320><c> on</c><00:10:34.480><c> my</c><00:10:34.640><c> data</c><00:10:34.880><c> tab,</c><00:10:35.279><c> I</c><00:10:35.519><c> see</c><00:10:35.600><c> that</c><00:10:35.920><c> yes,</c> 00:10:36.389 --> 00:10:36.399 align:start position:0% I click on my data tab, I see that yes, 00:10:36.399 --> 00:10:39.110 align:start position:0% I click on my data tab, I see that yes, Cozy<00:10:36.880><c> is</c><00:10:37.040><c> there.</c><00:10:37.440><c> That</c><00:10:37.600><c> is</c><00:10:37.760><c> great.</c><00:10:38.800><c> Speaking</c> 00:10:39.110 --> 00:10:39.120 align:start position:0% Cozy is there. That is great. Speaking 00:10:39.120 --> 00:10:40.870 align:start position:0% Cozy is there. That is great. Speaking of<00:10:39.279><c> data,</c><00:10:39.760><c> you</c><00:10:39.920><c> know</c><00:10:39.920><c> what?</c><00:10:40.240><c> Let's</c><00:10:40.560><c> go</c><00:10:40.640><c> ahead</c> 00:10:40.870 --> 00:10:40.880 align:start position:0% of data, you know what? Let's go ahead 00:10:40.880 --> 00:10:43.269 align:start position:0% of data, you know what? Let's go ahead and<00:10:41.040><c> take</c><00:10:41.200><c> a</c><00:10:41.360><c> peek</c><00:10:41.440><c> at</c><00:10:41.680><c> my</c><00:10:42.160><c> Shopify</c><00:10:42.800><c> data.</c><00:10:43.120><c> So,</c> 00:10:43.269 --> 00:10:43.279 align:start position:0% and take a peek at my Shopify data. So, 00:10:43.279 --> 00:10:45.590 align:start position:0% and take a peek at my Shopify data. So, I've<00:10:43.519><c> got</c><00:10:43.680><c> nothing</c><00:10:44.079><c> right</c><00:10:44.320><c> now.</c><00:10:45.120><c> If</c><00:10:45.279><c> I</c><00:10:45.519><c> go</c> 00:10:45.590 --> 00:10:45.600 align:start position:0% I've got nothing right now. If I go 00:10:45.600 --> 00:10:54.790 align:start position:0% I've got nothing right now. If I go ahead<00:10:46.399><c> and</c><00:10:46.800><c> create</c><00:10:47.040><c> a</c><00:10:47.279><c> new</c><00:10:47.440><c> product,</c> 00:10:54.790 --> 00:10:54.800 align:start position:0% 00:10:54.800 --> 00:11:00.630 align:start position:0% this<00:10:55.120><c> is</c><00:10:55.600><c> a</c><00:10:56.640><c> cozy</c><00:10:57.360><c> sweater.</c> 00:11:00.630 --> 00:11:00.640 align:start position:0% 00:11:00.640 --> 00:11:02.949 align:start position:0% And<00:11:00.800><c> notice</c><00:11:01.120><c> I</c><00:11:01.600><c> am</c><00:11:01.839><c> reusing</c><00:11:02.240><c> the</c><00:11:02.399><c> word</c><00:11:02.560><c> cozy</c> 00:11:02.949 --> 00:11:02.959 align:start position:0% And notice I am reusing the word cozy 00:11:02.959 --> 00:11:04.470 align:start position:0% And notice I am reusing the word cozy because<00:11:03.200><c> I</c><00:11:03.360><c> eventually</c><00:11:03.680><c> want</c><00:11:03.839><c> a</c><00:11:04.000><c> tag</c><00:11:04.160><c> to</c><00:11:04.320><c> be</c> 00:11:04.470 --> 00:11:04.480 align:start position:0% because I eventually want a tag to be 00:11:04.480 --> 00:11:06.150 align:start position:0% because I eventually want a tag to be applied.<00:11:05.040><c> So,</c><00:11:05.200><c> when</c><00:11:05.440><c> I</c><00:11:05.519><c> go</c><00:11:05.600><c> ahead</c><00:11:05.760><c> and</c><00:11:05.920><c> create</c> 00:11:06.150 --> 00:11:06.160 align:start position:0% applied. So, when I go ahead and create 00:11:06.160 --> 00:11:07.750 align:start position:0% applied. So, when I go ahead and create this<00:11:06.320><c> product</c><00:11:06.560><c> in</c><00:11:06.720><c> Shopify,</c><00:11:07.200><c> it</c><00:11:07.360><c> fires</c><00:11:07.600><c> that</c> 00:11:07.750 --> 00:11:07.760 align:start position:0% this product in Shopify, it fires that 00:11:07.760 --> 00:11:09.990 align:start position:0% this product in Shopify, it fires that web<00:11:08.000><c> hook.</c><00:11:08.800><c> If</c><00:11:08.959><c> I</c><00:11:09.120><c> come</c><00:11:09.279><c> to</c><00:11:09.440><c> gadget</c><00:11:09.760><c> and</c> 00:11:09.990 --> 00:11:10.000 align:start position:0% web hook. If I come to gadget and 00:11:10.000 --> 00:11:13.030 align:start position:0% web hook. If I come to gadget and refresh<00:11:10.399><c> here,</c><00:11:11.279><c> I</c><00:11:11.519><c> see</c><00:11:11.680><c> that</c><00:11:12.079><c> there</c><00:11:12.399><c> we</c><00:11:12.560><c> go.</c><00:11:12.800><c> My</c> 00:11:13.030 --> 00:11:13.040 align:start position:0% refresh here, I see that there we go. My 00:11:13.040 --> 00:11:14.790 align:start position:0% refresh here, I see that there we go. My sweater<00:11:13.440><c> is</c><00:11:13.680><c> now</c><00:11:13.839><c> here</c><00:11:14.079><c> in</c><00:11:14.240><c> my</c><00:11:14.399><c> gadget</c> 00:11:14.790 --> 00:11:14.800 align:start position:0% sweater is now here in my gadget 00:11:14.800 --> 00:11:17.750 align:start position:0% sweater is now here in my gadget database.<00:11:15.760><c> We'll</c><00:11:16.079><c> run</c><00:11:16.320><c> a</c><00:11:16.560><c> data</c><00:11:16.880><c> sync</c><00:11:17.200><c> at</c><00:11:17.519><c> the</c> 00:11:17.750 --> 00:11:17.760 align:start position:0% database. We'll run a data sync at the 00:11:17.760 --> 00:11:20.150 align:start position:0% database. We'll run a data sync at the end<00:11:18.000><c> of</c><00:11:18.160><c> this</c><00:11:18.720><c> tutorial,</c><00:11:19.360><c> but</c><00:11:19.600><c> it</c><00:11:19.839><c> just</c><00:11:20.000><c> shows</c> 00:11:20.150 --> 00:11:20.160 align:start position:0% end of this tutorial, but it just shows 00:11:20.160 --> 00:11:21.590 align:start position:0% end of this tutorial, but it just shows you<00:11:20.320><c> that</c><00:11:20.480><c> my</c><00:11:20.640><c> web</c><00:11:20.800><c> hooks</c><00:11:21.120><c> are</c><00:11:21.279><c> indeed</c> 00:11:21.590 --> 00:11:21.600 align:start position:0% you that my web hooks are indeed 00:11:21.600 --> 00:11:22.949 align:start position:0% you that my web hooks are indeed working.<00:11:21.920><c> So,</c><00:11:22.079><c> I'll</c><00:11:22.320><c> just</c><00:11:22.480><c> go</c><00:11:22.560><c> ahead</c><00:11:22.720><c> and</c> 00:11:22.949 --> 00:11:22.959 align:start position:0% working. So, I'll just go ahead and 00:11:22.959 --> 00:11:27.509 align:start position:0% working. So, I'll just go ahead and delete<00:11:23.279><c> this</c><00:11:23.519><c> for</c><00:11:23.760><c> now.</c> 00:11:27.509 --> 00:11:27.519 align:start position:0% 00:11:27.519 --> 00:11:30.069 align:start position:0% Excellent.<00:11:28.160><c> So,</c><00:11:28.480><c> we've</c><00:11:28.800><c> got</c><00:11:29.120><c> my</c><00:11:29.360><c> custom</c><00:11:29.760><c> data</c> 00:11:30.069 --> 00:11:30.079 align:start position:0% Excellent. So, we've got my custom data 00:11:30.079 --> 00:11:31.750 align:start position:0% Excellent. So, we've got my custom data model.<00:11:30.399><c> The</c><00:11:30.560><c> cred</c><00:11:30.880><c> API</c><00:11:31.200><c> is</c><00:11:31.440><c> already</c> 00:11:31.750 --> 00:11:31.760 align:start position:0% model. The cred API is already 00:11:31.760 --> 00:11:34.710 align:start position:0% model. The cred API is already generated.<00:11:32.720><c> So,</c><00:11:33.040><c> I</c><00:11:33.279><c> just</c><00:11:33.440><c> now</c><00:11:33.760><c> need</c><00:11:33.920><c> to</c><00:11:34.240><c> add</c><00:11:34.480><c> a</c> 00:11:34.710 --> 00:11:34.720 align:start position:0% generated. So, I just now need to add a 00:11:34.720 --> 00:11:37.590 align:start position:0% generated. So, I just now need to add a bit<00:11:34.880><c> of</c><00:11:35.120><c> custom</c><00:11:35.600><c> code</c><00:11:35.920><c> to</c><00:11:36.160><c> my</c><00:11:36.399><c> application.</c> 00:11:37.590 --> 00:11:37.600 align:start position:0% bit of custom code to my application. 00:11:37.600 --> 00:11:39.190 align:start position:0% bit of custom code to my application. And<00:11:37.760><c> this</c><00:11:38.000><c> is</c><00:11:38.079><c> what</c><00:11:38.320><c> is</c><00:11:38.480><c> going</c><00:11:38.560><c> to</c><00:11:38.640><c> handle</c><00:11:38.959><c> the</c> 00:11:39.190 --> 00:11:39.200 align:start position:0% And this is what is going to handle the 00:11:39.200 --> 00:11:40.870 align:start position:0% And this is what is going to handle the business<00:11:39.440><c> logic</c><00:11:39.760><c> for</c><00:11:39.920><c> my</c><00:11:40.160><c> app.</c><00:11:40.399><c> So</c><00:11:40.480><c> I</c><00:11:40.720><c> need</c><00:11:40.800><c> to</c> 00:11:40.870 --> 00:11:40.880 align:start position:0% business logic for my app. So I need to 00:11:40.880 --> 00:11:43.990 align:start position:0% business logic for my app. So I need to be<00:11:41.040><c> able</c><00:11:41.200><c> to</c><00:11:41.760><c> when</c><00:11:42.000><c> that</c><00:11:42.800><c> product</c><00:11:43.360><c> data</c><00:11:43.760><c> comes</c> 00:11:43.990 --> 00:11:44.000 align:start position:0% be able to when that product data comes 00:11:44.000 --> 00:11:46.790 align:start position:0% be able to when that product data comes in,<00:11:44.240><c> whether</c><00:11:44.480><c> it's</c><00:11:44.720><c> an</c><00:11:44.959><c> update</c><00:11:45.360><c> or</c><00:11:45.600><c> a</c><00:11:45.920><c> create,</c> 00:11:46.790 --> 00:11:46.800 align:start position:0% in, whether it's an update or a create, 00:11:46.800 --> 00:11:48.310 align:start position:0% in, whether it's an update or a create, check<00:11:46.959><c> to</c><00:11:47.120><c> see</c><00:11:47.279><c> if</c><00:11:47.360><c> the</c><00:11:47.519><c> product</c><00:11:47.839><c> description</c> 00:11:48.310 --> 00:11:48.320 align:start position:0% check to see if the product description 00:11:48.320 --> 00:11:51.190 align:start position:0% check to see if the product description has<00:11:48.640><c> changed</c><00:11:48.959><c> at</c><00:11:49.200><c> all.</c><00:11:49.920><c> If</c><00:11:50.160><c> it</c><00:11:50.320><c> has,</c><00:11:50.640><c> I</c><00:11:50.880><c> need</c><00:11:50.959><c> to</c> 00:11:51.190 --> 00:11:51.200 align:start position:0% has changed at all. If it has, I need to 00:11:51.200 --> 00:11:53.829 align:start position:0% has changed at all. If it has, I need to check<00:11:51.519><c> my</c><00:11:51.839><c> stored</c><00:11:52.240><c> allowed</c><00:11:52.480><c> tag</c><00:11:52.800><c> records,</c><00:11:53.680><c> see</c> 00:11:53.829 --> 00:11:53.839 align:start position:0% check my stored allowed tag records, see 00:11:53.839 --> 00:11:55.350 align:start position:0% check my stored allowed tag records, see if<00:11:54.000><c> there's</c><00:11:54.240><c> any</c><00:11:54.399><c> matches</c><00:11:54.800><c> between</c><00:11:55.040><c> keywords</c> 00:11:55.350 --> 00:11:55.360 align:start position:0% if there's any matches between keywords 00:11:55.360 --> 00:11:56.630 align:start position:0% if there's any matches between keywords and<00:11:55.519><c> words</c><00:11:55.760><c> in</c><00:11:55.839><c> the</c><00:11:56.000><c> product</c><00:11:56.160><c> description,</c> 00:11:56.630 --> 00:11:56.640 align:start position:0% and words in the product description, 00:11:56.640 --> 00:12:00.230 align:start position:0% and words in the product description, and<00:11:56.800><c> then</c><00:11:57.040><c> write</c><00:11:57.760><c> any</c><00:11:58.560><c> new</c><00:11:58.959><c> keywords</c><00:11:59.680><c> or</c><00:12:00.000><c> new</c> 00:12:00.230 --> 00:12:00.240 align:start position:0% and then write any new keywords or new 00:12:00.240 --> 00:12:03.350 align:start position:0% and then write any new keywords or new tags<00:12:00.880><c> back</c><00:12:01.200><c> to</c><00:12:01.519><c> the</c><00:12:01.760><c> product.</c><00:12:02.959><c> So,</c><00:12:03.120><c> I'm</c><00:12:03.279><c> going</c> 00:12:03.350 --> 00:12:03.360 align:start position:0% tags back to the product. So, I'm going 00:12:03.360 --> 00:12:05.350 align:start position:0% tags back to the product. So, I'm going to<00:12:03.440><c> do</c><00:12:03.600><c> that</c><00:12:03.760><c> in</c><00:12:04.000><c> my</c><00:12:04.160><c> Shopify</c><00:12:04.720><c> product</c><00:12:05.040><c> data</c> 00:12:05.350 --> 00:12:05.360 align:start position:0% to do that in my Shopify product data 00:12:05.360 --> 00:12:08.069 align:start position:0% to do that in my Shopify product data model<00:12:05.600><c> actions,</c><00:12:06.000><c> both</c><00:12:06.240><c> create</c><00:12:06.480><c> and</c><00:12:06.800><c> update.</c> 00:12:08.069 --> 00:12:08.079 align:start position:0% model actions, both create and update. 00:12:08.079 --> 00:12:11.269 align:start position:0% model actions, both create and update. So,<00:12:08.320><c> let's</c><00:12:08.560><c> just</c><00:12:08.720><c> go</c><00:12:08.880><c> ahead</c><00:12:09.760><c> and</c> 00:12:11.269 --> 00:12:11.279 align:start position:0% So, let's just go ahead and 00:12:11.279 --> 00:12:13.110 align:start position:0% So, let's just go ahead and start<00:12:11.440><c> with</c><00:12:11.760><c> create.</c><00:12:12.320><c> Now,</c><00:12:12.639><c> in</c><00:12:12.880><c> this</c> 00:12:13.110 --> 00:12:13.120 align:start position:0% start with create. Now, in this 00:12:13.120 --> 00:12:15.110 align:start position:0% start with create. Now, in this tutorial,<00:12:13.920><c> I'm</c><00:12:14.160><c> just</c><00:12:14.320><c> going</c><00:12:14.399><c> to</c><00:12:14.480><c> use</c><00:12:14.639><c> this</c> 00:12:15.110 --> 00:12:15.120 align:start position:0% tutorial, I'm just going to use this 00:12:15.120 --> 00:12:17.590 align:start position:0% tutorial, I'm just going to use this gadget<00:12:15.600><c> web</c><00:12:15.839><c> editor</c><00:12:16.160><c> to</c><00:12:16.399><c> do</c><00:12:16.480><c> all</c><00:12:16.639><c> my</c><00:12:16.880><c> building.</c> 00:12:17.590 --> 00:12:17.600 align:start position:0% gadget web editor to do all my building. 00:12:17.600 --> 00:12:19.269 align:start position:0% gadget web editor to do all my building. I<00:12:17.839><c> want</c><00:12:18.000><c> to</c><00:12:18.160><c> point</c><00:12:18.320><c> out</c><00:12:18.480><c> that</c><00:12:18.720><c> we</c><00:12:18.959><c> do</c><00:12:19.040><c> have</c><00:12:19.120><c> a</c> 00:12:19.269 --> 00:12:19.279 align:start position:0% I want to point out that we do have a 00:12:19.279 --> 00:12:21.030 align:start position:0% I want to point out that we do have a CLI<00:12:19.680><c> tool.</c><00:12:19.920><c> If</c><00:12:20.079><c> you</c><00:12:20.160><c> click</c><00:12:20.320><c> up</c><00:12:20.480><c> here,</c><00:12:20.800><c> gives</c> 00:12:21.030 --> 00:12:21.040 align:start position:0% CLI tool. If you click up here, gives 00:12:21.040 --> 00:12:22.389 align:start position:0% CLI tool. If you click up here, gives you<00:12:21.200><c> some</c><00:12:21.360><c> instructions</c><00:12:21.760><c> for</c><00:12:21.920><c> getting</c><00:12:22.240><c> set</c> 00:12:22.389 --> 00:12:22.399 align:start position:0% you some instructions for getting set 00:12:22.399 --> 00:12:25.590 align:start position:0% you some instructions for getting set up.<00:12:23.200><c> I</c><00:12:23.440><c> can</c><00:12:23.600><c> run</c><00:12:23.920><c> ggt,</c><00:12:24.800><c> which</c><00:12:25.040><c> is</c><00:12:25.120><c> the</c><00:12:25.360><c> name</c><00:12:25.440><c> of</c> 00:12:25.590 --> 00:12:25.600 align:start position:0% up. I can run ggt, which is the name of 00:12:25.600 --> 00:12:27.509 align:start position:0% up. I can run ggt, which is the name of the<00:12:25.760><c> tool.</c><00:12:26.560><c> It's</c><00:12:26.800><c> going</c><00:12:26.880><c> to</c><00:12:26.959><c> run</c><00:12:27.120><c> in</c><00:12:27.360><c> the</c> 00:12:27.509 --> 00:12:27.519 align:start position:0% the tool. It's going to run in the 00:12:27.519 --> 00:12:29.990 align:start position:0% the tool. It's going to run in the background<00:12:28.240><c> if</c><00:12:28.480><c> I</c><00:12:28.639><c> keep</c><00:12:28.800><c> it</c><00:12:28.959><c> running</c><00:12:29.279><c> locally.</c> 00:12:29.990 --> 00:12:30.000 align:start position:0% background if I keep it running locally. 00:12:30.000 --> 00:12:32.389 align:start position:0% background if I keep it running locally. any<00:12:30.320><c> changes</c><00:12:30.639><c> I</c><00:12:30.880><c> make</c><00:12:30.959><c> in</c><00:12:31.200><c> my</c><00:12:31.360><c> local</c><00:12:31.680><c> IDE</c><00:12:32.240><c> will</c> 00:12:32.389 --> 00:12:32.399 align:start position:0% any changes I make in my local IDE will 00:12:32.399 --> 00:12:35.350 align:start position:0% any changes I make in my local IDE will be<00:12:32.560><c> synced</c><00:12:32.959><c> up</c><00:12:33.360><c> to</c><00:12:33.680><c> this</c><00:12:34.000><c> gadget</c><00:12:34.560><c> web</c><00:12:34.800><c> editor</c> 00:12:35.350 --> 00:12:35.360 align:start position:0% be synced up to this gadget web editor 00:12:35.360 --> 00:12:38.069 align:start position:0% be synced up to this gadget web editor and<00:12:35.680><c> vice</c><00:12:36.079><c> versa</c><00:12:36.639><c> keeps</c><00:12:36.959><c> them</c><00:12:37.040><c> in</c><00:12:37.279><c> sync</c><00:12:37.920><c> and</c> 00:12:38.069 --> 00:12:38.079 align:start position:0% and vice versa keeps them in sync and 00:12:38.079 --> 00:12:40.870 align:start position:0% and vice versa keeps them in sync and that<00:12:38.320><c> means</c><00:12:38.560><c> your</c><00:12:39.440><c> live</c><00:12:40.079><c> project</c><00:12:40.639><c> your</c> 00:12:40.870 --> 00:12:40.880 align:start position:0% that means your live project your 00:12:40.880 --> 00:12:42.710 align:start position:0% that means your live project your development<00:12:41.279><c> environment</c><00:12:41.760><c> here</c><00:12:42.240><c> you</c><00:12:42.560><c> can</c> 00:12:42.710 --> 00:12:42.720 align:start position:0% development environment here you can 00:12:42.720 --> 00:12:44.870 align:start position:0% development environment here you can build<00:12:43.200><c> locally</c><00:12:43.680><c> and</c><00:12:44.000><c> it</c><00:12:44.240><c> feels</c><00:12:44.480><c> like</c><00:12:44.720><c> you're</c> 00:12:44.870 --> 00:12:44.880 align:start position:0% build locally and it feels like you're 00:12:44.880 --> 00:12:46.870 align:start position:0% build locally and it feels like you're building<00:12:45.120><c> any</c><00:12:45.440><c> other</c><00:12:45.600><c> app</c><00:12:46.320><c> pulling</c><00:12:46.560><c> down</c><00:12:46.720><c> your</c> 00:12:46.870 --> 00:12:46.880 align:start position:0% building any other app pulling down your 00:12:46.880 --> 00:12:48.790 align:start position:0% building any other app pulling down your project<00:12:47.120><c> locally</c><00:12:47.519><c> also</c><00:12:47.839><c> enables</c><00:12:48.399><c> source</c> 00:12:48.790 --> 00:12:48.800 align:start position:0% project locally also enables source 00:12:48.800 --> 00:12:50.310 align:start position:0% project locally also enables source control<00:12:49.120><c> which</c><00:12:49.360><c> is</c><00:12:49.519><c> super</c><00:12:49.760><c> important</c><00:12:50.160><c> and</c> 00:12:50.310 --> 00:12:50.320 align:start position:0% control which is super important and 00:12:50.320 --> 00:12:52.470 align:start position:0% control which is super important and then<00:12:50.480><c> ggt</c><00:12:51.120><c> also</c><00:12:51.440><c> contains</c><00:12:51.839><c> commands</c><00:12:52.240><c> for</c> 00:12:52.470 --> 00:12:52.480 align:start position:0% then ggt also contains commands for 00:12:52.480 --> 00:12:54.230 align:start position:0% then ggt also contains commands for things<00:12:52.720><c> like</c><00:12:52.959><c> deployment</c><00:12:53.600><c> so</c><00:12:53.760><c> you</c><00:12:53.920><c> can</c><00:12:54.000><c> set</c><00:12:54.160><c> up</c> 00:12:54.230 --> 00:12:54.240 align:start position:0% things like deployment so you can set up 00:12:54.240 --> 00:12:56.629 align:start position:0% things like deployment so you can set up a<00:12:54.399><c> CI/CD</c><00:12:54.959><c> pipeline</c><00:12:55.519><c> for</c><00:12:55.920><c> actually</c><00:12:56.240><c> deploying</c> 00:12:56.629 --> 00:12:56.639 align:start position:0% a CI/CD pipeline for actually deploying 00:12:56.639 --> 00:13:00.310 align:start position:0% a CI/CD pipeline for actually deploying to<00:12:56.880><c> production</c><00:12:58.000><c> you</c><00:12:58.480><c> set</c><00:12:58.720><c> up</c><00:12:59.040><c> or</c><00:12:59.600><c> standard</c> 00:13:00.310 --> 00:13:00.320 align:start position:0% to production you set up or standard 00:13:00.320 --> 00:13:02.150 align:start position:0% to production you set up or standard standard<00:13:00.880><c> whatever</c><00:13:01.200><c> that</c><00:13:01.360><c> might</c><00:13:01.519><c> be</c><00:13:01.839><c> git</c> 00:13:02.150 --> 00:13:02.160 align:start position:0% standard whatever that might be git 00:13:02.160 --> 00:13:04.069 align:start position:0% standard whatever that might be git workflow. 00:13:04.069 --> 00:13:04.079 align:start position:0% workflow. 00:13:04.079 --> 00:13:05.590 align:start position:0% workflow. Okay,<00:13:04.480><c> now</c><00:13:04.639><c> let's</c><00:13:04.880><c> get</c><00:13:04.959><c> back</c><00:13:05.040><c> to</c><00:13:05.120><c> the</c><00:13:05.279><c> action</c> 00:13:05.590 --> 00:13:05.600 align:start position:0% Okay, now let's get back to the action 00:13:05.600 --> 00:13:06.790 align:start position:0% Okay, now let's get back to the action here.<00:13:05.920><c> I'm</c><00:13:06.160><c> just</c><00:13:06.240><c> going</c><00:13:06.320><c> to</c><00:13:06.399><c> go</c><00:13:06.480><c> ahead</c><00:13:06.639><c> and</c> 00:13:06.790 --> 00:13:06.800 align:start position:0% here. I'm just going to go ahead and 00:13:06.800 --> 00:13:08.230 align:start position:0% here. I'm just going to go ahead and copy<00:13:07.120><c> paste</c><00:13:07.440><c> code.</c><00:13:07.680><c> I'm</c><00:13:07.920><c> going</c><00:13:08.000><c> to</c><00:13:08.079><c> walk</c> 00:13:08.230 --> 00:13:08.240 align:start position:0% copy paste code. I'm going to walk 00:13:08.240 --> 00:13:09.670 align:start position:0% copy paste code. I'm going to walk through<00:13:08.399><c> some</c><00:13:08.560><c> of</c><00:13:08.639><c> the</c><00:13:08.720><c> gadgetisms,</c><00:13:09.360><c> but</c><00:13:09.600><c> the</c> 00:13:09.670 --> 00:13:09.680 align:start position:0% through some of the gadgetisms, but the 00:13:09.680 --> 00:13:11.910 align:start position:0% through some of the gadgetisms, but the whole<00:13:09.839><c> point</c><00:13:10.000><c> is</c><00:13:10.160><c> that</c><00:13:10.880><c> the</c><00:13:11.200><c> code</c><00:13:11.440><c> is</c><00:13:11.680><c> really</c> 00:13:11.910 --> 00:13:11.920 align:start position:0% whole point is that the code is really 00:13:11.920 --> 00:13:13.750 align:start position:0% whole point is that the code is really what's<00:13:12.240><c> unique</c><00:13:12.639><c> to</c><00:13:12.880><c> your</c><00:13:13.120><c> app.</c><00:13:13.440><c> So,</c><00:13:13.519><c> I</c><00:13:13.680><c> don't</c> 00:13:13.750 --> 00:13:13.760 align:start position:0% what's unique to your app. So, I don't 00:13:13.760 --> 00:13:15.750 align:start position:0% what's unique to your app. So, I don't want<00:13:13.839><c> to</c><00:13:13.920><c> spend</c><00:13:14.079><c> too</c><00:13:14.320><c> much</c><00:13:14.480><c> time</c><00:13:14.639><c> on</c><00:13:14.800><c> our</c><00:13:15.360><c> tag</c> 00:13:15.750 --> 00:13:15.760 align:start position:0% want to spend too much time on our tag 00:13:15.760 --> 00:13:18.470 align:start position:0% want to spend too much time on our tag processing<00:13:16.320><c> logic</c><00:13:16.720><c> because</c><00:13:17.600><c> it's</c><00:13:18.160><c> kind</c><00:13:18.320><c> of</c> 00:13:18.470 --> 00:13:18.480 align:start position:0% processing logic because it's kind of 00:13:18.480 --> 00:13:20.550 align:start position:0% processing logic because it's kind of the<00:13:18.880><c> the</c><00:13:19.200><c> standard</c><00:13:19.519><c> stuff.</c><00:13:19.839><c> It's</c><00:13:20.000><c> not</c><00:13:20.240><c> unique</c> 00:13:20.550 --> 00:13:20.560 align:start position:0% the the standard stuff. It's not unique 00:13:20.560 --> 00:13:23.350 align:start position:0% the the standard stuff. It's not unique to<00:13:20.720><c> gadget.</c><00:13:21.200><c> It's</c><00:13:21.360><c> just</c><00:13:22.480><c> logic,</c><00:13:23.040><c> business</c> 00:13:23.350 --> 00:13:23.360 align:start position:0% to gadget. It's just logic, business 00:13:23.360 --> 00:13:26.069 align:start position:0% to gadget. It's just logic, business logic.<00:13:24.320><c> So,</c><00:13:24.560><c> what</c><00:13:24.720><c> I'll</c><00:13:24.959><c> need</c><00:13:25.040><c> to</c><00:13:25.200><c> do</c><00:13:25.360><c> here,</c> 00:13:26.069 --> 00:13:26.079 align:start position:0% logic. So, what I'll need to do here, 00:13:26.079 --> 00:13:28.230 align:start position:0% logic. So, what I'll need to do here, I'm<00:13:26.320><c> going</c><00:13:26.399><c> to</c><00:13:26.480><c> go</c><00:13:26.639><c> ahead</c> 00:13:28.230 --> 00:13:28.240 align:start position:0% I'm going to go ahead 00:13:28.240 --> 00:13:32.389 align:start position:0% I'm going to go ahead and<00:13:28.560><c> add</c><00:13:28.880><c> a</c><00:13:29.200><c> if</c><00:13:30.639><c> record</c><00:13:31.040><c> is.</c><00:13:31.519><c> Once</c><00:13:31.760><c> again,</c><00:13:32.000><c> if</c><00:13:32.240><c> I</c> 00:13:32.389 --> 00:13:32.399 align:start position:0% and add a if record is. Once again, if I 00:13:32.399 --> 00:13:34.389 align:start position:0% and add a if record is. Once again, if I hover<00:13:32.639><c> over</c><00:13:32.800><c> it,</c><00:13:33.279><c> that's</c><00:13:33.519><c> our</c><00:13:33.839><c> Shopify</c> 00:13:34.389 --> 00:13:34.399 align:start position:0% hover over it, that's our Shopify 00:13:34.399 --> 00:13:36.230 align:start position:0% hover over it, that's our Shopify product. 00:13:36.230 --> 00:13:36.240 align:start position:0% product. 00:13:36.240 --> 00:13:38.629 align:start position:0% product. And<00:13:36.480><c> you'll</c><00:13:36.720><c> see</c><00:13:36.880><c> I</c><00:13:37.120><c> have</c><00:13:37.200><c> a</c><00:13:37.519><c> changed</c><00:13:37.920><c> API</c><00:13:38.399><c> on</c> 00:13:38.629 --> 00:13:38.639 align:start position:0% And you'll see I have a changed API on 00:13:38.639 --> 00:13:40.949 align:start position:0% And you'll see I have a changed API on here.<00:13:38.959><c> So,</c><00:13:39.279><c> the</c><00:13:39.600><c> record</c><00:13:39.920><c> API</c><00:13:40.240><c> in</c><00:13:40.399><c> gadget</c><00:13:40.800><c> does</c> 00:13:40.949 --> 00:13:40.959 align:start position:0% here. So, the record API in gadget does 00:13:40.959 --> 00:13:43.430 align:start position:0% here. So, the record API in gadget does have<00:13:41.040><c> built-in</c><00:13:41.519><c> change</c><00:13:42.000><c> detection.</c><00:13:43.120><c> And</c><00:13:43.279><c> this</c> 00:13:43.430 --> 00:13:43.440 align:start position:0% have built-in change detection. And this 00:13:43.440 --> 00:13:45.190 align:start position:0% have built-in change detection. And this is<00:13:43.600><c> super</c><00:13:43.839><c> useful</c><00:13:44.160><c> for</c><00:13:44.320><c> providing</c><00:13:44.639><c> a</c><00:13:44.800><c> web</c><00:13:44.959><c> hook</c> 00:13:45.190 --> 00:13:45.200 align:start position:0% is super useful for providing a web hook 00:13:45.200 --> 00:13:49.110 align:start position:0% is super useful for providing a web hook loop.<00:13:45.360><c> So</c><00:13:45.600><c> what</c><00:13:45.760><c> would</c><00:13:45.920><c> happen</c><00:13:46.240><c> is</c><00:13:47.200><c> if</c><00:13:47.519><c> I</c><00:13:48.639><c> get</c><00:13:48.880><c> a</c> 00:13:49.110 --> 00:13:49.120 align:start position:0% loop. So what would happen is if I get a 00:13:49.120 --> 00:13:52.230 align:start position:0% loop. So what would happen is if I get a product<00:13:49.440><c> web</c><00:13:49.680><c> hook</c><00:13:49.920><c> come</c><00:13:50.079><c> in,</c><00:13:50.720><c> I</c><00:13:51.600><c> always</c><00:13:51.920><c> write</c> 00:13:52.230 --> 00:13:52.240 align:start position:0% product web hook come in, I always write 00:13:52.240 --> 00:13:53.990 align:start position:0% product web hook come in, I always write back<00:13:52.399><c> to</c><00:13:52.560><c> Shopify,</c><00:13:53.200><c> write</c><00:13:53.360><c> tags</c><00:13:53.680><c> whether</c><00:13:53.920><c> or</c> 00:13:53.990 --> 00:13:54.000 align:start position:0% back to Shopify, write tags whether or 00:13:54.000 --> 00:13:56.550 align:start position:0% back to Shopify, write tags whether or not<00:13:54.160><c> they</c><00:13:54.399><c> changed</c><00:13:54.800><c> or</c><00:13:55.120><c> not,</c><00:13:56.160><c> that's</c><00:13:56.399><c> going</c><00:13:56.480><c> to</c> 00:13:56.550 --> 00:13:56.560 align:start position:0% not they changed or not, that's going to 00:13:56.560 --> 00:13:58.389 align:start position:0% not they changed or not, that's going to go<00:13:56.720><c> ahead</c><00:13:56.880><c> and</c><00:13:56.959><c> fire</c><00:13:57.199><c> another</c><00:13:57.440><c> web</c><00:13:57.600><c> hook.</c><00:13:58.079><c> I'll</c> 00:13:58.389 --> 00:13:58.399 align:start position:0% go ahead and fire another web hook. I'll 00:13:58.399 --> 00:14:01.030 align:start position:0% go ahead and fire another web hook. I'll update<00:13:59.199><c> web</c><00:13:59.440><c> hook</c><00:13:59.920><c> update.</c><00:14:00.560><c> It'll</c><00:14:00.800><c> be</c><00:14:00.880><c> an</c> 00:14:01.030 --> 00:14:01.040 align:start position:0% update web hook update. It'll be an 00:14:01.040 --> 00:14:02.389 align:start position:0% update web hook update. It'll be an endless<00:14:01.440><c> loop.</c><00:14:01.680><c> We</c><00:14:01.839><c> don't</c><00:14:01.920><c> want</c><00:14:02.000><c> to</c><00:14:02.079><c> do</c><00:14:02.160><c> that.</c> 00:14:02.389 --> 00:14:02.399 align:start position:0% endless loop. We don't want to do that. 00:14:02.399 --> 00:14:03.750 align:start position:0% endless loop. We don't want to do that. So<00:14:02.480><c> we</c><00:14:02.639><c> want</c><00:14:02.720><c> to</c><00:14:02.880><c> use</c><00:14:02.959><c> change</c><00:14:03.199><c> detection</c><00:14:03.600><c> to</c> 00:14:03.750 --> 00:14:03.760 align:start position:0% So we want to use change detection to 00:14:03.760 --> 00:14:05.350 align:start position:0% So we want to use change detection to only<00:14:03.920><c> run</c><00:14:04.079><c> our</c><00:14:04.320><c> logic</c><00:14:04.639><c> if</c><00:14:04.880><c> the</c><00:14:05.120><c> product</c> 00:14:05.350 --> 00:14:05.360 align:start position:0% only run our logic if the product 00:14:05.360 --> 00:14:07.269 align:start position:0% only run our logic if the product description<00:14:05.920><c> changed.</c><00:14:06.639><c> So</c><00:14:06.800><c> I</c><00:14:06.959><c> can</c><00:14:07.040><c> just</c><00:14:07.199><c> go</c> 00:14:07.269 --> 00:14:07.279 align:start position:0% description changed. So I can just go 00:14:07.279 --> 00:14:09.509 align:start position:0% description changed. So I can just go ahead<00:14:07.440><c> and</c><00:14:07.600><c> do</c><00:14:07.760><c> body</c><00:14:08.480><c> and</c><00:14:08.800><c> that</c><00:14:08.959><c> is</c><00:14:09.120><c> the</c><00:14:09.360><c> name</c> 00:14:09.509 --> 00:14:09.519 align:start position:0% ahead and do body and that is the name 00:14:09.519 --> 00:14:11.430 align:start position:0% ahead and do body and that is the name of<00:14:09.680><c> my</c><00:14:09.839><c> field.</c><00:14:10.480><c> And</c><00:14:10.639><c> then</c><00:14:10.800><c> I'm</c><00:14:11.040><c> going</c><00:14:11.120><c> to</c><00:14:11.199><c> write</c> 00:14:11.430 --> 00:14:11.440 align:start position:0% of my field. And then I'm going to write 00:14:11.440 --> 00:14:13.670 align:start position:0% of my field. And then I'm going to write a<00:14:11.680><c> little</c><00:14:12.079><c> utility</c><00:14:12.560><c> function.</c><00:14:13.279><c> I'm</c><00:14:13.519><c> going</c><00:14:13.600><c> to</c> 00:14:13.670 --> 00:14:13.680 align:start position:0% a little utility function. I'm going to 00:14:13.680 --> 00:14:15.189 align:start position:0% a little utility function. I'm going to call<00:14:13.760><c> that</c><00:14:14.000><c> apply</c><00:14:14.320><c> tags.</c><00:14:14.639><c> And</c><00:14:14.800><c> I'm</c><00:14:14.959><c> just</c><00:14:15.120><c> going</c> 00:14:15.189 --> 00:14:15.199 align:start position:0% call that apply tags. And I'm just going 00:14:15.199 --> 00:14:17.990 align:start position:0% call that apply tags. And I'm just going to<00:14:15.760><c> copy</c><00:14:16.160><c> paste</c><00:14:16.320><c> a</c><00:14:16.560><c> bit</c><00:14:16.639><c> of</c><00:14:16.720><c> code</c><00:14:16.880><c> in</c><00:14:17.120><c> here.</c><00:14:17.680><c> We</c> 00:14:17.990 --> 00:14:18.000 align:start position:0% to copy paste a bit of code in here. We 00:14:18.000 --> 00:14:21.030 align:start position:0% to copy paste a bit of code in here. We haven't<00:14:19.040><c> written</c><00:14:19.600><c> this</c><00:14:20.000><c> utility</c><00:14:20.320><c> yet.</c><00:14:20.959><c> But</c> 00:14:21.030 --> 00:14:21.040 align:start position:0% haven't written this utility yet. But 00:14:21.040 --> 00:14:22.550 align:start position:0% haven't written this utility yet. But I'm<00:14:21.199><c> going</c><00:14:21.279><c> to</c><00:14:21.360><c> create</c><00:14:21.519><c> a</c><00:14:21.760><c> little</c><00:14:22.000><c> util</c><00:14:22.320><c> file</c> 00:14:22.550 --> 00:14:22.560 align:start position:0% I'm going to create a little util file 00:14:22.560 --> 00:14:25.670 align:start position:0% I'm going to create a little util file in<00:14:22.800><c> a</c><00:14:22.959><c> minute.</c> 00:14:25.670 --> 00:14:25.680 align:start position:0% in a minute. 00:14:25.680 --> 00:14:27.430 align:start position:0% in a minute. And<00:14:25.839><c> this</c><00:14:26.079><c> will</c><00:14:26.399><c> go</c><00:14:26.560><c> ahead.</c><00:14:26.959><c> It's</c><00:14:27.199><c> going</c><00:14:27.279><c> to</c> 00:14:27.430 --> 00:14:27.440 align:start position:0% And this will go ahead. It's going to 00:14:27.440 --> 00:14:29.910 align:start position:0% And this will go ahead. It's going to pass<00:14:27.680><c> the</c><00:14:27.920><c> ID,</c><00:14:28.800><c> product</c><00:14:29.120><c> description,</c><00:14:29.760><c> and</c> 00:14:29.910 --> 00:14:29.920 align:start position:0% pass the ID, product description, and 00:14:29.920 --> 00:14:32.790 align:start position:0% pass the ID, product description, and then<00:14:30.160><c> any</c><00:14:30.560><c> existing</c><00:14:31.199><c> tags.</c><00:14:32.320><c> I</c><00:14:32.560><c> want</c><00:14:32.639><c> to</c><00:14:32.720><c> do</c> 00:14:32.790 --> 00:14:32.800 align:start position:0% then any existing tags. I want to do 00:14:32.800 --> 00:14:35.509 align:start position:0% then any existing tags. I want to do this<00:14:32.959><c> in</c><00:14:33.199><c> create</c><00:14:33.680><c> as</c><00:14:33.920><c> well</c><00:14:34.079><c> as</c><00:14:34.480><c> update.</c><00:14:35.279><c> So</c> 00:14:35.509 --> 00:14:35.519 align:start position:0% this in create as well as update. So 00:14:35.519 --> 00:14:37.269 align:start position:0% this in create as well as update. So update,<00:14:36.079><c> it's</c><00:14:36.240><c> going</c><00:14:36.399><c> to</c><00:14:36.480><c> be</c><00:14:36.800><c> almost</c><00:14:37.120><c> the</c> 00:14:37.269 --> 00:14:37.279 align:start position:0% update, it's going to be almost the 00:14:37.279 --> 00:14:43.350 align:start position:0% update, it's going to be almost the exact<00:14:37.600><c> same</c><00:14:37.760><c> here.</c><00:14:38.880><c> Let's</c><00:14:39.120><c> just</c><00:14:39.279><c> go</c><00:14:39.440><c> ahead</c> 00:14:43.350 --> 00:14:43.360 align:start position:0% 00:14:43.360 --> 00:14:46.150 align:start position:0% paste<00:14:43.680><c> it</c><00:14:43.920><c> in.</c><00:14:44.800><c> And</c><00:14:44.959><c> then</c><00:14:45.199><c> I</c><00:14:45.519><c> of</c><00:14:45.680><c> course</c><00:14:45.920><c> need</c> 00:14:46.150 --> 00:14:46.160 align:start position:0% paste it in. And then I of course need 00:14:46.160 --> 00:14:49.269 align:start position:0% paste it in. And then I of course need to 00:14:49.269 --> 00:14:49.279 align:start position:0% 00:14:49.279 --> 00:14:51.269 align:start position:0% import<00:14:49.760><c> apply</c><00:14:50.160><c> tag.</c><00:14:50.560><c> So</c><00:14:50.639><c> let's</c><00:14:50.880><c> go</c><00:14:50.959><c> ahead</c><00:14:51.120><c> and</c> 00:14:51.269 --> 00:14:51.279 align:start position:0% import apply tag. So let's go ahead and 00:14:51.279 --> 00:14:54.069 align:start position:0% import apply tag. So let's go ahead and implement<00:14:51.680><c> apply</c><00:14:52.000><c> tags.</c><00:14:52.399><c> Now</c> 00:14:54.069 --> 00:14:54.079 align:start position:0% implement apply tags. Now 00:14:54.079 --> 00:14:56.790 align:start position:0% implement apply tags. Now I'm<00:14:54.240><c> going</c><00:14:54.320><c> to</c><00:14:54.399><c> go</c><00:14:54.560><c> ahead</c><00:14:54.800><c> create</c><00:14:55.040><c> new</c><00:14:55.199><c> file</c> 00:14:56.790 --> 00:14:56.800 align:start position:0% I'm going to go ahead create new file 00:14:56.800 --> 00:14:58.949 align:start position:0% I'm going to go ahead create new file utils.ts. 00:14:58.949 --> 00:14:58.959 align:start position:0% utils.ts. 00:14:58.959 --> 00:15:01.350 align:start position:0% utils.ts. It<00:14:59.199><c> exists</c><00:14:59.680><c> within</c><00:15:00.079><c> my</c><00:15:00.320><c> Shopify</c><00:15:00.959><c> product</c> 00:15:01.350 --> 00:15:01.360 align:start position:0% It exists within my Shopify product 00:15:01.360 --> 00:15:03.030 align:start position:0% It exists within my Shopify product folder. 00:15:03.030 --> 00:15:03.040 align:start position:0% folder. 00:15:03.040 --> 00:15:05.670 align:start position:0% folder. And<00:15:03.279><c> we</c><00:15:03.519><c> can</c><00:15:03.600><c> go</c><00:15:03.760><c> ahead.</c><00:15:04.160><c> I'm</c><00:15:04.480><c> just</c><00:15:04.639><c> going</c><00:15:04.720><c> to</c> 00:15:05.670 --> 00:15:05.680 align:start position:0% And we can go ahead. I'm just going to 00:15:05.680 --> 00:15:07.670 align:start position:0% And we can go ahead. I'm just going to copy<00:15:06.079><c> paste</c><00:15:06.320><c> a</c><00:15:06.480><c> bunch</c><00:15:06.720><c> of</c><00:15:07.120><c> I'm</c><00:15:07.360><c> going</c><00:15:07.440><c> to</c><00:15:07.519><c> do</c> 00:15:07.670 --> 00:15:07.680 align:start position:0% copy paste a bunch of I'm going to do 00:15:07.680 --> 00:15:09.269 align:start position:0% copy paste a bunch of I'm going to do some<00:15:07.839><c> imports</c><00:15:08.320><c> first</c><00:15:08.639><c> because</c><00:15:08.880><c> we</c><00:15:09.040><c> can</c><00:15:09.120><c> talk</c> 00:15:09.269 --> 00:15:09.279 align:start position:0% some imports first because we can talk 00:15:09.279 --> 00:15:11.590 align:start position:0% some imports first because we can talk about<00:15:09.360><c> the</c><00:15:09.600><c> imports</c><00:15:10.399><c> and</c><00:15:10.720><c> then</c><00:15:11.040><c> I'll</c><00:15:11.279><c> copy</c> 00:15:11.590 --> 00:15:11.600 align:start position:0% about the imports and then I'll copy 00:15:11.600 --> 00:15:13.350 align:start position:0% about the imports and then I'll copy paste<00:15:11.760><c> a</c><00:15:11.920><c> bunch</c><00:15:12.079><c> of</c><00:15:12.160><c> code.</c><00:15:12.480><c> So</c><00:15:12.880><c> we'll</c><00:15:13.120><c> go</c> 00:15:13.350 --> 00:15:13.360 align:start position:0% paste a bunch of code. So we'll go 00:15:13.360 --> 00:15:15.590 align:start position:0% paste a bunch of code. So we'll go import<00:15:14.480><c> some</c><00:15:14.720><c> of</c><00:15:14.800><c> the</c><00:15:14.959><c> utilities</c><00:15:15.279><c> from</c><00:15:15.440><c> the</c> 00:15:15.590 --> 00:15:15.600 align:start position:0% import some of the utilities from the 00:15:15.600 --> 00:15:18.069 align:start position:0% import some of the utilities from the gadget<00:15:16.000><c> server.</c><00:15:16.480><c> We've</c><00:15:16.720><c> got</c><00:15:16.880><c> a</c><00:15:17.040><c> logger</c><00:15:17.839><c> that's</c> 00:15:18.069 --> 00:15:18.079 align:start position:0% gadget server. We've got a logger that's 00:15:18.079 --> 00:15:20.790 align:start position:0% gadget server. We've got a logger that's going<00:15:18.160><c> to</c><00:15:18.320><c> write</c><00:15:18.480><c> to</c><00:15:18.720><c> these</c><00:15:19.120><c> logs</c><00:15:19.600><c> over</c><00:15:19.839><c> here.</c> 00:15:20.790 --> 00:15:20.800 align:start position:0% going to write to these logs over here. 00:15:20.800 --> 00:15:22.949 align:start position:0% going to write to these logs over here. We<00:15:21.040><c> have</c><00:15:21.199><c> API.</c><00:15:21.839><c> This</c><00:15:22.000><c> is</c><00:15:22.079><c> our</c><00:15:22.240><c> API</c><00:15:22.639><c> client.</c> 00:15:22.949 --> 00:15:22.959 align:start position:0% We have API. This is our API client. 00:15:22.959 --> 00:15:24.790 align:start position:0% We have API. This is our API client. It's<00:15:23.199><c> the</c><00:15:23.440><c> same</c><00:15:23.600><c> client</c><00:15:23.920><c> we</c><00:15:24.160><c> use</c><00:15:24.399><c> to</c><00:15:24.560><c> make</c> 00:15:24.790 --> 00:15:24.800 align:start position:0% It's the same client we use to make 00:15:24.800 --> 00:15:27.990 align:start position:0% It's the same client we use to make requests<00:15:25.360><c> in</c><00:15:25.680><c> the</c><00:15:25.839><c> API</c><00:15:26.399><c> playground.</c><00:15:27.680><c> And</c><00:15:27.839><c> then</c> 00:15:27.990 --> 00:15:28.000 align:start position:0% requests in the API playground. And then 00:15:28.000 --> 00:15:30.710 align:start position:0% requests in the API playground. And then we<00:15:28.160><c> have</c><00:15:28.320><c> this</c><00:15:28.720><c> connections.</c><00:15:30.160><c> This</c><00:15:30.480><c> is</c><00:15:30.639><c> going</c> 00:15:30.710 --> 00:15:30.720 align:start position:0% we have this connections. This is going 00:15:30.720 --> 00:15:32.470 align:start position:0% we have this connections. This is going to<00:15:30.880><c> help</c><00:15:31.120><c> us</c><00:15:31.360><c> write</c><00:15:31.680><c> back</c><00:15:31.839><c> to</c><00:15:32.000><c> Shopify.</c><00:15:32.399><c> It's</c> 00:15:32.470 --> 00:15:32.480 align:start position:0% to help us write back to Shopify. It's 00:15:32.480 --> 00:15:34.389 align:start position:0% to help us write back to Shopify. It's going<00:15:32.639><c> to</c><00:15:32.720><c> have</c><00:15:32.880><c> an</c><00:15:33.199><c> authenticated</c><00:15:33.920><c> API</c> 00:15:34.389 --> 00:15:34.399 align:start position:0% going to have an authenticated API 00:15:34.399 --> 00:15:36.230 align:start position:0% going to have an authenticated API client<00:15:34.639><c> I</c><00:15:34.880><c> can</c><00:15:35.040><c> use</c><00:15:35.199><c> to</c><00:15:35.360><c> send</c><00:15:35.519><c> GraphQL</c> 00:15:36.230 --> 00:15:36.240 align:start position:0% client I can use to send GraphQL 00:15:36.240 --> 00:15:38.790 align:start position:0% client I can use to send GraphQL requests<00:15:36.560><c> to</c><00:15:36.800><c> Shopify</c><00:15:37.279><c> to</c><00:15:37.440><c> update</c><00:15:37.680><c> my</c><00:15:37.920><c> tags.</c> 00:15:38.790 --> 00:15:38.800 align:start position:0% requests to Shopify to update my tags. 00:15:38.800 --> 00:15:41.189 align:start position:0% requests to Shopify to update my tags. And<00:15:38.959><c> this</c><00:15:39.120><c> all</c><00:15:39.360><c> comes</c><00:15:39.600><c> from</c> 00:15:41.189 --> 00:15:41.199 align:start position:0% And this all comes from 00:15:41.199 --> 00:15:44.310 align:start position:0% And this all comes from my<00:15:41.519><c> gadget</c><00:15:42.160><c> server</c><00:15:42.639><c> package.</c> 00:15:44.310 --> 00:15:44.320 align:start position:0% my gadget server package. 00:15:44.320 --> 00:15:47.189 align:start position:0% my gadget server package. Not<00:15:44.560><c> gadget</c><00:15:44.959><c> gadget</c><00:15:45.360><c> server,</c><00:15:46.480><c> just</c><00:15:46.720><c> gadget</c> 00:15:47.189 --> 00:15:47.199 align:start position:0% Not gadget gadget server, just gadget 00:15:47.199 --> 00:15:49.189 align:start position:0% Not gadget gadget server, just gadget server. 00:15:49.189 --> 00:15:49.199 align:start position:0% server. 00:15:49.199 --> 00:15:50.949 align:start position:0% server. And<00:15:49.440><c> you'll</c><00:15:49.680><c> notice</c><00:15:50.160><c> if</c><00:15:50.399><c> you</c><00:15:50.560><c> look</c><00:15:50.639><c> at</c><00:15:50.720><c> these,</c> 00:15:50.949 --> 00:15:50.959 align:start position:0% And you'll notice if you look at these, 00:15:50.959 --> 00:15:52.150 align:start position:0% And you'll notice if you look at these, they<00:15:51.120><c> look</c><00:15:51.279><c> familiar.</c><00:15:51.680><c> They're</c><00:15:51.920><c> also</c> 00:15:52.150 --> 00:15:52.160 align:start position:0% they look familiar. They're also 00:15:52.160 --> 00:15:54.310 align:start position:0% they look familiar. They're also available<00:15:52.639><c> here</c><00:15:53.040><c> in</c><00:15:53.279><c> your</c><00:15:53.519><c> actions</c><00:15:54.000><c> as</c><00:15:54.240><c> part</c> 00:15:54.310 --> 00:15:54.320 align:start position:0% available here in your actions as part 00:15:54.320 --> 00:15:56.150 align:start position:0% available here in your actions as part of<00:15:54.399><c> this</c><00:15:54.560><c> high</c><00:15:54.800><c> context</c><00:15:55.199><c> parameter.</c><00:15:55.680><c> A</c><00:15:55.920><c> full</c> 00:15:56.150 --> 00:15:56.160 align:start position:0% of this high context parameter. A full 00:15:56.160 --> 00:15:58.470 align:start position:0% of this high context parameter. A full list<00:15:56.399><c> of</c><00:15:56.959><c> the</c><00:15:57.199><c> available</c><00:15:57.680><c> options</c><00:15:58.079><c> in</c><00:15:58.320><c> this</c> 00:15:58.470 --> 00:15:58.480 align:start position:0% list of the available options in this 00:15:58.480 --> 00:16:00.150 align:start position:0% list of the available options in this parameter<00:15:59.040><c> are</c><00:15:59.360><c> available</c><00:15:59.759><c> in</c><00:16:00.000><c> our</c> 00:16:00.150 --> 00:16:00.160 align:start position:0% parameter are available in our 00:16:00.160 --> 00:16:02.069 align:start position:0% parameter are available in our documentation. 00:16:02.069 --> 00:16:02.079 align:start position:0% documentation. 00:16:02.079 --> 00:16:03.990 align:start position:0% documentation. So<00:16:02.399><c> now</c><00:16:02.639><c> I'm</c><00:16:02.880><c> just</c><00:16:02.959><c> going</c><00:16:03.040><c> to</c><00:16:03.120><c> go</c><00:16:03.199><c> ahead</c><00:16:03.519><c> copy</c> 00:16:03.990 --> 00:16:04.000 align:start position:0% So now I'm just going to go ahead copy 00:16:04.000 --> 00:16:06.150 align:start position:0% So now I'm just going to go ahead copy paste<00:16:04.399><c> a</c><00:16:04.480><c> bunch</c><00:16:04.639><c> of</c><00:16:04.800><c> code</c><00:16:05.040><c> here.</c><00:16:05.759><c> So</c><00:16:05.920><c> let's</c> 00:16:06.150 --> 00:16:06.160 align:start position:0% paste a bunch of code here. So let's 00:16:06.160 --> 00:16:09.590 align:start position:0% paste a bunch of code here. So let's just<00:16:06.399><c> implement</c><00:16:06.800><c> our</c><00:16:07.120><c> apply</c><00:16:07.600><c> tags</c><00:16:08.480><c> function.</c> 00:16:09.590 --> 00:16:09.600 align:start position:0% just implement our apply tags function. 00:16:09.600 --> 00:16:10.949 align:start position:0% just implement our apply tags function. We're<00:16:09.759><c> just</c><00:16:09.920><c> checking</c><00:16:10.160><c> to</c><00:16:10.320><c> make</c><00:16:10.399><c> sure</c><00:16:10.639><c> there</c> 00:16:10.949 --> 00:16:10.959 align:start position:0% We're just checking to make sure there 00:16:10.959 --> 00:16:13.910 align:start position:0% We're just checking to make sure there is<00:16:11.199><c> an</c><00:16:11.519><c> ID</c><00:16:12.079><c> and</c><00:16:12.320><c> a</c><00:16:12.560><c> product</c><00:16:12.800><c> description.</c><00:16:13.759><c> If</c> 00:16:13.910 --> 00:16:13.920 align:start position:0% is an ID and a product description. If 00:16:13.920 --> 00:16:15.430 align:start position:0% is an ID and a product description. If there<00:16:14.079><c> is,</c><00:16:14.399><c> that's</c><00:16:14.639><c> great.</c><00:16:14.959><c> Let's</c><00:16:15.279><c> keep</c> 00:16:15.430 --> 00:16:15.440 align:start position:0% there is, that's great. Let's keep 00:16:15.440 --> 00:16:17.990 align:start position:0% there is, that's great. Let's keep going.<00:16:15.759><c> If</c><00:16:16.000><c> not,</c><00:16:16.800><c> I'm</c><00:16:17.040><c> not</c><00:16:17.199><c> going</c><00:16:17.279><c> to</c><00:16:17.440><c> run</c><00:16:17.600><c> this</c> 00:16:17.990 --> 00:16:18.000 align:start position:0% going. If not, I'm not going to run this 00:16:18.000 --> 00:16:19.990 align:start position:0% going. If not, I'm not going to run this run<00:16:18.240><c> this</c><00:16:18.399><c> function</c><00:16:18.720><c> because</c><00:16:18.959><c> I</c><00:16:19.120><c> either</c><00:16:19.759><c> have</c> 00:16:19.990 --> 00:16:20.000 align:start position:0% run this function because I either have 00:16:20.000 --> 00:16:21.269 align:start position:0% run this function because I either have nothing<00:16:20.160><c> to</c><00:16:20.399><c> compare</c><00:16:20.720><c> against.</c><00:16:20.959><c> If</c><00:16:21.120><c> there's</c> 00:16:21.269 --> 00:16:21.279 align:start position:0% nothing to compare against. If there's 00:16:21.279 --> 00:16:22.790 align:start position:0% nothing to compare against. If there's no<00:16:21.440><c> description,</c><00:16:21.839><c> if</c><00:16:22.000><c> there's</c><00:16:22.160><c> no</c><00:16:22.320><c> ID,</c><00:16:22.639><c> I</c> 00:16:22.790 --> 00:16:22.800 align:start position:0% no description, if there's no ID, I 00:16:22.800 --> 00:16:24.389 align:start position:0% no description, if there's no ID, I can't<00:16:22.880><c> write</c><00:16:23.120><c> back</c><00:16:23.279><c> to</c><00:16:23.440><c> Shopify.</c><00:16:24.240><c> This</c> 00:16:24.389 --> 00:16:24.399 align:start position:0% can't write back to Shopify. This 00:16:24.399 --> 00:16:25.829 align:start position:0% can't write back to Shopify. This shouldn't<00:16:24.639><c> happen.</c><00:16:25.040><c> It's</c><00:16:25.199><c> just</c><00:16:25.360><c> a</c><00:16:25.519><c> bit</c><00:16:25.600><c> of</c> 00:16:25.829 --> 00:16:25.839 align:start position:0% shouldn't happen. It's just a bit of 00:16:25.839 --> 00:16:28.629 align:start position:0% shouldn't happen. It's just a bit of error<00:16:26.079><c> detection.</c><00:16:27.440><c> I'm</c><00:16:27.680><c> using</c><00:16:27.920><c> a</c><00:16:28.240><c> regular</c> 00:16:28.629 --> 00:16:28.639 align:start position:0% error detection. I'm using a regular 00:16:28.639 --> 00:16:31.829 align:start position:0% error detection. I'm using a regular expression<00:16:29.440><c> to</c><00:16:30.320><c> parse</c><00:16:30.720><c> out</c><00:16:30.959><c> the</c><00:16:31.279><c> words</c><00:16:31.519><c> in</c><00:16:31.680><c> my</c> 00:16:31.829 --> 00:16:31.839 align:start position:0% expression to parse out the words in my 00:16:31.839 --> 00:16:33.590 align:start position:0% expression to parse out the words in my product<00:16:32.079><c> description</c><00:16:32.560><c> and</c><00:16:32.720><c> then</c><00:16:32.880><c> a</c><00:16:33.120><c> set</c><00:16:33.360><c> just</c> 00:16:33.590 --> 00:16:33.600 align:start position:0% product description and then a set just 00:16:33.600 --> 00:16:35.509 align:start position:0% product description and then a set just to<00:16:33.759><c> remove</c><00:16:34.079><c> any</c><00:16:34.320><c> duplicates.</c><00:16:34.959><c> I</c><00:16:35.199><c> don't</c><00:16:35.360><c> need</c> 00:16:35.509 --> 00:16:35.519 align:start position:0% to remove any duplicates. I don't need 00:16:35.519 --> 00:16:38.470 align:start position:0% to remove any duplicates. I don't need to<00:16:35.680><c> match</c><00:16:36.160><c> words</c><00:16:36.560><c> more</c><00:16:36.720><c> than</c><00:16:36.880><c> once.</c><00:16:38.160><c> And</c><00:16:38.320><c> then</c> 00:16:38.470 --> 00:16:38.480 align:start position:0% to match words more than once. And then 00:16:38.480 --> 00:16:40.629 align:start position:0% to match words more than once. And then I'm<00:16:38.639><c> using</c><00:16:38.800><c> my</c><00:16:39.040><c> API</c><00:16:39.440><c> client</c><00:16:39.680><c> to</c><00:16:39.839><c> go</c><00:16:40.000><c> ahead</c><00:16:40.240><c> and</c> 00:16:40.629 --> 00:16:40.639 align:start position:0% I'm using my API client to go ahead and 00:16:40.639 --> 00:16:43.189 align:start position:0% I'm using my API client to go ahead and read<00:16:41.120><c> my</c><00:16:41.440><c> allowed</c><00:16:41.839><c> tag</c><00:16:42.079><c> records.</c><00:16:42.720><c> So</c><00:16:42.880><c> I'm</c><00:16:43.040><c> just</c> 00:16:43.189 --> 00:16:43.199 align:start position:0% read my allowed tag records. So I'm just 00:16:43.199 --> 00:16:45.509 align:start position:0% read my allowed tag records. So I'm just reading<00:16:43.519><c> the</c><00:16:43.680><c> first</c><00:16:44.079><c> 250.</c><00:16:44.800><c> This</c><00:16:44.880><c> is</c><00:16:45.040><c> the</c><00:16:45.199><c> max</c> 00:16:45.509 --> 00:16:45.519 align:start position:0% reading the first 250. This is the max 00:16:45.519 --> 00:16:49.269 align:start position:0% reading the first 250. This is the max page<00:16:45.839><c> size</c><00:16:46.160><c> in</c><00:16:46.399><c> a</c><00:16:46.639><c> read</c><00:16:47.040><c> in</c><00:16:47.680><c> gadget.</c><00:16:48.800><c> If</c><00:16:49.040><c> I</c><00:16:49.199><c> were</c> 00:16:49.269 --> 00:16:49.279 align:start position:0% page size in a read in gadget. If I were 00:16:49.279 --> 00:16:50.790 align:start position:0% page size in a read in gadget. If I were building<00:16:49.519><c> a</c><00:16:49.680><c> production</c><00:16:50.000><c> app,</c><00:16:50.320><c> I</c><00:16:50.560><c> would</c><00:16:50.639><c> need</c> 00:16:50.790 --> 00:16:50.800 align:start position:0% building a production app, I would need 00:16:50.800 --> 00:16:52.790 align:start position:0% building a production app, I would need to<00:16:50.880><c> go</c><00:16:51.040><c> ahead</c><00:16:51.199><c> and</c><00:16:51.519><c> actually</c><00:16:51.839><c> pageionate</c><00:16:52.560><c> over</c> 00:16:52.790 --> 00:16:52.800 align:start position:0% to go ahead and actually pageionate over 00:16:52.800 --> 00:16:54.470 align:start position:0% to go ahead and actually pageionate over my<00:16:53.040><c> records.</c><00:16:53.519><c> I'm</c><00:16:53.759><c> not</c><00:16:53.839><c> going</c><00:16:53.920><c> to</c><00:16:54.079><c> worry</c><00:16:54.240><c> about</c> 00:16:54.470 --> 00:16:54.480 align:start position:0% my records. I'm not going to worry about 00:16:54.480 --> 00:16:56.150 align:start position:0% my records. I'm not going to worry about that<00:16:54.880><c> right</c><00:16:55.199><c> now</c><00:16:55.440><c> though.</c><00:16:55.680><c> I'm</c><00:16:55.920><c> just</c><00:16:56.000><c> going</c><00:16:56.079><c> to</c> 00:16:56.150 --> 00:16:56.160 align:start position:0% that right now though. I'm just going to 00:16:56.160 --> 00:17:00.150 align:start position:0% that right now though. I'm just going to grab<00:16:56.480><c> 250</c><00:16:57.440><c> to</c><00:16:57.759><c> start.</c><00:16:58.399><c> And</c><00:16:58.560><c> then</c><00:16:58.880><c> I</c><00:16:59.279><c> am</c> 00:17:00.150 --> 00:17:00.160 align:start position:0% grab 250 to start. And then I am 00:17:00.160 --> 00:17:02.470 align:start position:0% grab 250 to start. And then I am iterating<00:17:00.720><c> over</c><00:17:01.040><c> the</c><00:17:01.279><c> returned</c><00:17:01.759><c> records.</c><00:17:02.240><c> So</c> 00:17:02.470 --> 00:17:02.480 align:start position:0% iterating over the returned records. So 00:17:02.480 --> 00:17:04.949 align:start position:0% iterating over the returned records. So this<00:17:02.880><c> find</c><00:17:03.199><c> many</c><00:17:03.519><c> it's</c><00:17:03.680><c> in</c><00:17:03.920><c> it's</c><00:17:04.079><c> our</c><00:17:04.240><c> read</c><00:17:04.480><c> API</c> 00:17:04.949 --> 00:17:04.959 align:start position:0% this find many it's in it's our read API 00:17:04.959 --> 00:17:07.510 align:start position:0% this find many it's in it's our read API built<00:17:05.199><c> into</c><00:17:05.919><c> gadget.</c><00:17:06.720><c> I'm</c><00:17:06.959><c> going</c><00:17:07.039><c> to</c><00:17:07.120><c> map</c><00:17:07.360><c> over</c> 00:17:07.510 --> 00:17:07.520 align:start position:0% built into gadget. I'm going to map over 00:17:07.520 --> 00:17:09.029 align:start position:0% built into gadget. I'm going to map over the<00:17:07.679><c> results</c><00:17:08.000><c> and</c><00:17:08.160><c> just</c><00:17:08.319><c> get</c><00:17:08.400><c> the</c><00:17:08.559><c> keywords.</c> 00:17:09.029 --> 00:17:09.039 align:start position:0% the results and just get the keywords. 00:17:09.039 --> 00:17:11.189 align:start position:0% the results and just get the keywords. Now<00:17:09.199><c> if</c><00:17:09.360><c> I</c><00:17:09.600><c> open</c> 00:17:11.189 --> 00:17:11.199 align:start position:0% Now if I open 00:17:11.199 --> 00:17:13.909 align:start position:0% Now if I open my<00:17:11.520><c> docs</c><00:17:11.919><c> here,</c> 00:17:13.909 --> 00:17:13.919 align:start position:0% my docs here, 00:17:13.919 --> 00:17:15.829 align:start position:0% my docs here, it's<00:17:14.079><c> a</c><00:17:14.240><c> good</c><00:17:14.400><c> time</c><00:17:14.559><c> as</c><00:17:14.799><c> any</c><00:17:15.039><c> to</c><00:17:15.199><c> look</c><00:17:15.360><c> at</c><00:17:15.520><c> find</c> 00:17:15.829 --> 00:17:15.839 align:start position:0% it's a good time as any to look at find 00:17:15.839 --> 00:17:19.029 align:start position:0% it's a good time as any to look at find many.<00:17:17.039><c> So</c><00:17:17.520><c> as</c><00:17:17.760><c> you</c><00:17:18.000><c> build</c><00:17:18.240><c> and</c><00:17:18.480><c> as</c><00:17:18.640><c> you</c><00:17:18.799><c> edit</c> 00:17:19.029 --> 00:17:19.039 align:start position:0% many. So as you build and as you edit 00:17:19.039 --> 00:17:20.789 align:start position:0% many. So as you build and as you edit your<00:17:19.120><c> data</c><00:17:19.360><c> models,</c><00:17:19.600><c> gadget</c><00:17:19.919><c> is</c><00:17:20.079><c> going</c><00:17:20.240><c> to</c><00:17:20.640><c> go</c> 00:17:20.789 --> 00:17:20.799 align:start position:0% your data models, gadget is going to go 00:17:20.799 --> 00:17:22.710 align:start position:0% your data models, gadget is going to go ahead<00:17:20.959><c> and</c><00:17:21.199><c> create</c><00:17:21.520><c> API</c><00:17:22.000><c> documentation</c><00:17:22.559><c> for</c> 00:17:22.710 --> 00:17:22.720 align:start position:0% ahead and create API documentation for 00:17:22.720 --> 00:17:24.230 align:start position:0% ahead and create API documentation for you.<00:17:22.959><c> Keep</c><00:17:23.039><c> it</c><00:17:23.120><c> up</c><00:17:23.280><c> to</c><00:17:23.360><c> date.</c><00:17:23.520><c> So</c><00:17:23.679><c> you</c><00:17:23.839><c> see</c><00:17:23.919><c> I</c><00:17:24.079><c> do</c> 00:17:24.230 --> 00:17:24.240 align:start position:0% you. Keep it up to date. So you see I do 00:17:24.240 --> 00:17:26.710 align:start position:0% you. Keep it up to date. So you see I do have<00:17:24.400><c> allowed</c><00:17:24.720><c> tag</c><00:17:24.959><c> docs</c><00:17:25.280><c> and</c><00:17:25.439><c> if</c><00:17:25.600><c> I</c><00:17:25.760><c> want</c><00:17:25.839><c> to</c> 00:17:26.710 --> 00:17:26.720 align:start position:0% have allowed tag docs and if I want to 00:17:26.720 --> 00:17:28.870 align:start position:0% have allowed tag docs and if I want to figure<00:17:26.959><c> out</c><00:17:27.199><c> how</c><00:17:27.360><c> to</c><00:17:27.600><c> retrieve</c><00:17:28.160><c> many</c><00:17:28.480><c> allowed</c> 00:17:28.870 --> 00:17:28.880 align:start position:0% figure out how to retrieve many allowed 00:17:28.880 --> 00:17:31.430 align:start position:0% figure out how to retrieve many allowed tag<00:17:29.200><c> records,</c><00:17:30.160><c> I</c><00:17:30.400><c> have</c><00:17:30.640><c> a</c><00:17:30.960><c> little</c><00:17:31.120><c> snippet</c> 00:17:31.430 --> 00:17:31.440 align:start position:0% tag records, I have a little snippet 00:17:31.440 --> 00:17:33.750 align:start position:0% tag records, I have a little snippet here,<00:17:32.000><c> API</c><00:17:32.480><c> allowed</c><00:17:32.720><c> tag</c><00:17:32.960><c> find</c><00:17:33.200><c> many.</c><00:17:33.600><c> That's</c> 00:17:33.750 --> 00:17:33.760 align:start position:0% here, API allowed tag find many. That's 00:17:33.760 --> 00:17:35.029 align:start position:0% here, API allowed tag find many. That's exactly<00:17:34.080><c> what</c><00:17:34.240><c> I'm</c><00:17:34.400><c> calling.</c><00:17:34.720><c> I'm</c><00:17:34.880><c> just</c> 00:17:35.029 --> 00:17:35.039 align:start position:0% exactly what I'm calling. I'm just 00:17:35.039 --> 00:17:36.870 align:start position:0% exactly what I'm calling. I'm just passing<00:17:35.280><c> in</c><00:17:35.520><c> the</c><00:17:35.679><c> first</c><00:17:35.919><c> parameter</c><00:17:36.320><c> here</c><00:17:36.480><c> to</c> 00:17:36.870 --> 00:17:36.880 align:start position:0% passing in the first parameter here to 00:17:36.880 --> 00:17:38.950 align:start position:0% passing in the first parameter here to extend<00:17:37.200><c> it</c><00:17:37.440><c> to</c><00:17:37.679><c> 50.</c><00:17:37.919><c> By</c><00:17:38.080><c> default,</c><00:17:38.400><c> it'll</c><00:17:38.720><c> only</c> 00:17:38.950 --> 00:17:38.960 align:start position:0% extend it to 50. By default, it'll only 00:17:38.960 --> 00:17:41.590 align:start position:0% extend it to 50. By default, it'll only return<00:17:39.280><c> 50</c><00:17:39.600><c> results.</c> 00:17:41.590 --> 00:17:41.600 align:start position:0% return 50 results. 00:17:41.600 --> 00:17:43.430 align:start position:0% return 50 results. I'm<00:17:41.840><c> taking</c><00:17:42.080><c> my</c><00:17:42.240><c> pass</c><00:17:42.480><c> in</c><00:17:42.640><c> tags,</c><00:17:42.960><c> just</c><00:17:43.200><c> putting</c> 00:17:43.430 --> 00:17:43.440 align:start position:0% I'm taking my pass in tags, just putting 00:17:43.440 --> 00:17:44.950 align:start position:0% I'm taking my pass in tags, just putting them<00:17:43.520><c> to</c><00:17:43.679><c> a</c><00:17:43.840><c> set.</c><00:17:44.080><c> This</c><00:17:44.240><c> is</c><00:17:44.320><c> just</c><00:17:44.480><c> for</c><00:17:44.640><c> easier</c> 00:17:44.950 --> 00:17:44.960 align:start position:0% them to a set. This is just for easier 00:17:44.960 --> 00:17:46.549 align:start position:0% them to a set. This is just for easier comparison.<00:17:45.760><c> And</c><00:17:45.840><c> then</c><00:17:46.000><c> I'm</c><00:17:46.160><c> doing</c><00:17:46.320><c> my</c> 00:17:46.549 --> 00:17:46.559 align:start position:0% comparison. And then I'm doing my 00:17:46.559 --> 00:17:49.350 align:start position:0% comparison. And then I'm doing my compare.<00:17:47.039><c> So</c><00:17:47.200><c> it's</c><00:17:47.360><c> my</c><00:17:48.000><c> saved</c><00:17:48.400><c> keywords.</c><00:17:49.120><c> I'm</c> 00:17:49.350 --> 00:17:49.360 align:start position:0% compare. So it's my saved keywords. I'm 00:17:49.360 --> 00:17:50.789 align:start position:0% compare. So it's my saved keywords. I'm filtering<00:17:49.760><c> those</c><00:17:49.919><c> and</c><00:17:50.080><c> I'm</c><00:17:50.240><c> checking</c><00:17:50.400><c> to</c><00:17:50.559><c> see</c> 00:17:50.789 --> 00:17:50.799 align:start position:0% filtering those and I'm checking to see 00:17:50.799 --> 00:17:52.150 align:start position:0% filtering those and I'm checking to see is<00:17:51.039><c> there</c><00:17:51.120><c> a</c><00:17:51.280><c> match</c><00:17:51.520><c> with</c><00:17:51.600><c> a</c><00:17:51.760><c> word</c><00:17:51.919><c> in</c><00:17:52.000><c> my</c> 00:17:52.150 --> 00:17:52.160 align:start position:0% is there a match with a word in my 00:17:52.160 --> 00:17:54.150 align:start position:0% is there a match with a word in my product<00:17:52.400><c> description.</c><00:17:52.960><c> and</c><00:17:53.200><c> is</c><00:17:53.440><c> it</c><00:17:53.679><c> already</c> 00:17:54.150 --> 00:17:54.160 align:start position:0% product description. and is it already 00:17:54.160 --> 00:17:57.510 align:start position:0% product description. and is it already not<00:17:54.799><c> in</c><00:17:55.120><c> my</c><00:17:55.919><c> tags?</c><00:17:56.400><c> So,</c><00:17:56.559><c> I</c><00:17:56.720><c> don't</c><00:17:56.880><c> need</c><00:17:56.960><c> to</c> 00:17:57.510 --> 00:17:57.520 align:start position:0% not in my tags? So, I don't need to 00:17:57.520 --> 00:18:00.470 align:start position:0% not in my tags? So, I don't need to write<00:17:57.760><c> back</c><00:17:58.080><c> if</c><00:17:58.400><c> the</c><00:17:58.640><c> tag</c><00:17:58.960><c> already</c><00:17:59.200><c> exists.</c> 00:18:00.470 --> 00:18:00.480 align:start position:0% write back if the tag already exists. 00:18:00.480 --> 00:18:02.390 align:start position:0% write back if the tag already exists. I'm<00:18:00.640><c> using</c><00:18:00.799><c> the</c><00:18:00.960><c> logger</c><00:18:01.440><c> just</c><00:18:01.600><c> to</c><00:18:01.840><c> print</c><00:18:02.080><c> all</c> 00:18:02.390 --> 00:18:02.400 align:start position:0% I'm using the logger just to print all 00:18:02.400 --> 00:18:04.470 align:start position:0% I'm using the logger just to print all of<00:18:02.559><c> this</c><00:18:02.799><c> information</c><00:18:03.360><c> to</c><00:18:03.600><c> my</c><00:18:03.840><c> gadget</c><00:18:04.160><c> logs.</c> 00:18:04.470 --> 00:18:04.480 align:start position:0% of this information to my gadget logs. 00:18:04.480 --> 00:18:07.110 align:start position:0% of this information to my gadget logs. It'll<00:18:04.640><c> just</c><00:18:04.799><c> make</c><00:18:04.880><c> it</c><00:18:05.039><c> easy</c><00:18:05.200><c> to</c><00:18:05.440><c> debug.</c> 00:18:07.110 --> 00:18:07.120 align:start position:0% It'll just make it easy to debug. 00:18:07.120 --> 00:18:09.990 align:start position:0% It'll just make it easy to debug. And<00:18:07.280><c> then</c><00:18:08.000><c> if</c><00:18:08.240><c> there</c><00:18:08.480><c> are</c><00:18:08.720><c> keywords</c><00:18:09.200><c> to</c><00:18:09.440><c> apply,</c> 00:18:09.990 --> 00:18:10.000 align:start position:0% And then if there are keywords to apply, 00:18:10.000 --> 00:18:11.510 align:start position:0% And then if there are keywords to apply, if<00:18:10.240><c> there</c><00:18:10.400><c> are</c><00:18:10.559><c> new</c><00:18:10.720><c> tags</c><00:18:11.039><c> that</c><00:18:11.200><c> I</c><00:18:11.360><c> want</c><00:18:11.440><c> to</c> 00:18:11.510 --> 00:18:11.520 align:start position:0% if there are new tags that I want to 00:18:11.520 --> 00:18:14.630 align:start position:0% if there are new tags that I want to write<00:18:11.760><c> back</c><00:18:11.919><c> to</c><00:18:12.080><c> my</c><00:18:12.240><c> product,</c><00:18:13.600><c> I</c><00:18:13.919><c> go</c><00:18:14.080><c> ahead.</c> 00:18:14.630 --> 00:18:14.640 align:start position:0% write back to my product, I go ahead. 00:18:14.640 --> 00:18:17.110 align:start position:0% write back to my product, I go ahead. Now,<00:18:15.039><c> this</c><00:18:15.280><c> is</c><00:18:15.440><c> seems</c><00:18:15.679><c> like</c><00:18:15.919><c> I've</c><00:18:16.080><c> I've</c><00:18:16.400><c> got</c><00:18:16.559><c> my</c> 00:18:17.110 --> 00:18:17.120 align:start position:0% Now, this is seems like I've I've got my 00:18:17.120 --> 00:18:19.430 align:start position:0% Now, this is seems like I've I've got my arrays.<00:18:18.080><c> Uh</c><00:18:18.320><c> I</c><00:18:18.559><c> I</c><00:18:18.720><c> don't</c><00:18:18.880><c> think</c><00:18:18.960><c> I</c><00:18:19.120><c> need</c><00:18:19.280><c> some</c> 00:18:19.430 --> 00:18:19.440 align:start position:0% arrays. Uh I I don't think I need some 00:18:19.440 --> 00:18:21.029 align:start position:0% arrays. Uh I I don't think I need some of<00:18:19.520><c> this</c><00:18:19.679><c> logic</c><00:18:20.080><c> actually.</c><00:18:20.400><c> I</c><00:18:20.640><c> think</c><00:18:20.720><c> I</c><00:18:20.960><c> can</c> 00:18:21.029 --> 00:18:21.039 align:start position:0% of this logic actually. I think I can 00:18:21.039 --> 00:18:24.150 align:start position:0% of this logic actually. I think I can just 00:18:24.150 --> 00:18:24.160 align:start position:0% 00:18:24.160 --> 00:18:26.310 align:start position:0% do<00:18:24.320><c> this.</c><00:18:24.799><c> Uh,</c><00:18:25.120><c> get</c><00:18:25.280><c> my</c><00:18:25.440><c> keywords</c><00:18:25.919><c> apply,</c> 00:18:26.310 --> 00:18:26.320 align:start position:0% do this. Uh, get my keywords apply, 00:18:26.320 --> 00:18:29.190 align:start position:0% do this. Uh, get my keywords apply, append<00:18:26.720><c> them</c><00:18:26.960><c> to</c><00:18:27.200><c> my</c><00:18:27.520><c> existing</c><00:18:28.000><c> tags,</c><00:18:28.960><c> print</c> 00:18:29.190 --> 00:18:29.200 align:start position:0% append them to my existing tags, print 00:18:29.200 --> 00:18:31.750 align:start position:0% append them to my existing tags, print out<00:18:29.440><c> these</c><00:18:29.840><c> final</c><00:18:30.240><c> tags,</c><00:18:31.120><c> and</c><00:18:31.280><c> then</c><00:18:31.440><c> you</c><00:18:31.600><c> see</c> 00:18:31.750 --> 00:18:31.760 align:start position:0% out these final tags, and then you see 00:18:31.760 --> 00:18:34.549 align:start position:0% out these final tags, and then you see here<00:18:32.000><c> I'm</c><00:18:32.240><c> calling</c><00:18:32.640><c> API.incq.</c> 00:18:34.549 --> 00:18:34.559 align:start position:0% here I'm calling API.incq. 00:18:34.559 --> 00:18:36.950 align:start position:0% here I'm calling API.incq. So,<00:18:35.520><c> because</c><00:18:35.840><c> I'm</c><00:18:36.000><c> writing</c><00:18:36.240><c> back</c><00:18:36.400><c> to</c><00:18:36.480><c> Shopify,</c> 00:18:36.950 --> 00:18:36.960 align:start position:0% So, because I'm writing back to Shopify, 00:18:36.960 --> 00:18:38.710 align:start position:0% So, because I'm writing back to Shopify, Shopify<00:18:37.360><c> has</c><00:18:37.520><c> a</c><00:18:37.600><c> rate</c><00:18:37.840><c> limit</c><00:18:38.160><c> I</c><00:18:38.320><c> need</c><00:18:38.400><c> to</c><00:18:38.559><c> deal</c> 00:18:38.710 --> 00:18:38.720 align:start position:0% Shopify has a rate limit I need to deal 00:18:38.720 --> 00:18:41.110 align:start position:0% Shopify has a rate limit I need to deal with.<00:18:39.280><c> How</c><00:18:39.520><c> I'd</c><00:18:39.679><c> normally</c><00:18:40.000><c> handle</c><00:18:40.320><c> this</c><00:18:40.559><c> is</c><00:18:40.799><c> a</c> 00:18:41.110 --> 00:18:41.120 align:start position:0% with. How I'd normally handle this is a 00:18:41.120 --> 00:18:43.750 align:start position:0% with. How I'd normally handle this is a background<00:18:41.600><c> job</c><00:18:42.000><c> system.</c><00:18:42.400><c> I'd</c><00:18:42.720><c> set</c><00:18:42.880><c> up</c><00:18:43.520><c> Google</c> 00:18:43.750 --> 00:18:43.760 align:start position:0% background job system. I'd set up Google 00:18:43.760 --> 00:18:48.549 align:start position:0% background job system. I'd set up Google Cloud<00:18:44.080><c> Tasks</c><00:18:44.400><c> or</c><00:18:44.559><c> Amazon</c><00:18:45.039><c> SQS.</c><00:18:46.240><c> gadget</c><00:18:47.600><c> has</c> 00:18:48.549 --> 00:18:48.559 align:start position:0% Cloud Tasks or Amazon SQS. gadget has 00:18:48.559 --> 00:18:51.750 align:start position:0% Cloud Tasks or Amazon SQS. gadget has this<00:18:48.799><c> built</c><00:18:49.120><c> in</c><00:18:49.600><c> just</c><00:18:50.480><c> to</c><00:18:50.720><c> our</c><00:18:50.960><c> API.</c><00:18:51.600><c> It's</c> 00:18:51.750 --> 00:18:51.760 align:start position:0% this built in just to our API. It's 00:18:51.760 --> 00:18:54.230 align:start position:0% this built in just to our API. It's actually<00:18:52.000><c> very</c><00:18:52.320><c> simple.</c><00:18:52.799><c> We</c><00:18:52.960><c> can</c><00:18:53.039><c> go</c><00:18:53.200><c> API</c><00:18:53.600><c> on</c><00:18:53.919><c> Q</c> 00:18:54.230 --> 00:18:54.240 align:start position:0% actually very simple. We can go API on Q 00:18:54.240 --> 00:18:56.150 align:start position:0% actually very simple. We can go API on Q to<00:18:54.480><c> spin</c><00:18:54.720><c> up</c><00:18:54.880><c> a</c><00:18:55.120><c> new</c><00:18:55.360><c> background.</c><00:18:55.919><c> We</c><00:18:56.000><c> call</c> 00:18:56.150 --> 00:18:56.160 align:start position:0% to spin up a new background. We call 00:18:56.160 --> 00:18:58.310 align:start position:0% to spin up a new background. We call them<00:18:56.320><c> background</c><00:18:56.720><c> actions.</c> 00:18:58.310 --> 00:18:58.320 align:start position:0% them background actions. 00:18:58.320 --> 00:19:00.390 align:start position:0% them background actions. We're<00:18:58.559><c> going</c><00:18:58.720><c> to</c><00:18:58.799><c> go</c><00:18:58.960><c> ahead</c><00:18:59.440><c> and</c><00:18:59.919><c> run</c><00:19:00.160><c> this</c> 00:19:00.390 --> 00:19:00.400 align:start position:0% We're going to go ahead and run this 00:19:00.400 --> 00:19:02.070 align:start position:0% We're going to go ahead and run this right<00:19:00.640><c> to</c><00:19:00.799><c> Shopify</c><00:19:01.280><c> action.</c><00:19:01.600><c> We</c><00:19:01.840><c> haven't</c> 00:19:02.070 --> 00:19:02.080 align:start position:0% right to Shopify action. We haven't 00:19:02.080 --> 00:19:03.510 align:start position:0% right to Shopify action. We haven't created<00:19:02.320><c> this</c><00:19:02.559><c> yet,</c><00:19:02.720><c> but</c><00:19:02.880><c> we</c><00:19:03.039><c> will</c><00:19:03.200><c> in</c><00:19:03.360><c> a</c> 00:19:03.510 --> 00:19:03.520 align:start position:0% created this yet, but we will in a 00:19:03.520 --> 00:19:05.270 align:start position:0% created this yet, but we will in a minute.<00:19:04.160><c> We're</c><00:19:04.400><c> passing</c><00:19:04.720><c> in</c><00:19:05.039><c> some</c> 00:19:05.270 --> 00:19:05.280 align:start position:0% minute. We're passing in some 00:19:05.280 --> 00:19:07.430 align:start position:0% minute. We're passing in some parameters.<00:19:06.240><c> And</c><00:19:06.400><c> then</c><00:19:06.559><c> there's</c><00:19:06.880><c> some</c> 00:19:07.430 --> 00:19:07.440 align:start position:0% parameters. And then there's some 00:19:07.440 --> 00:19:10.470 align:start position:0% parameters. And then there's some options<00:19:08.080><c> here</c><00:19:08.559><c> to</c><00:19:08.960><c> control</c><00:19:09.679><c> my</c><00:19:10.000><c> background</c> 00:19:10.470 --> 00:19:10.480 align:start position:0% options here to control my background 00:19:10.480 --> 00:19:13.029 align:start position:0% options here to control my background action<00:19:10.960><c> concurrency</c><00:19:11.760><c> in</c><00:19:12.000><c> this</c><00:19:12.160><c> case.</c><00:19:12.799><c> So,</c> 00:19:13.029 --> 00:19:13.039 align:start position:0% action concurrency in this case. So, 00:19:13.039 --> 00:19:15.029 align:start position:0% action concurrency in this case. So, this<00:19:13.280><c> will</c><00:19:13.520><c> help</c><00:19:13.679><c> me</c><00:19:13.919><c> deal</c><00:19:14.160><c> with</c><00:19:14.480><c> Shopify's</c> 00:19:15.029 --> 00:19:15.039 align:start position:0% this will help me deal with Shopify's 00:19:15.039 --> 00:19:16.549 align:start position:0% this will help me deal with Shopify's rate<00:19:15.280><c> limit.</c><00:19:15.440><c> So</c><00:19:15.679><c> this</c><00:19:15.840><c> is</c><00:19:16.080><c> this</c><00:19:16.240><c> is</c><00:19:16.400><c> kind</c><00:19:16.480><c> of</c> 00:19:16.549 --> 00:19:16.559 align:start position:0% rate limit. So this is this is kind of 00:19:16.559 --> 00:19:17.830 align:start position:0% rate limit. So this is this is kind of nice.<00:19:16.720><c> It's</c><00:19:16.880><c> kind</c><00:19:16.960><c> of</c><00:19:17.039><c> easy</c><00:19:17.280><c> instead</c><00:19:17.520><c> of</c><00:19:17.679><c> going</c> 00:19:17.830 --> 00:19:17.840 align:start position:0% nice. It's kind of easy instead of going 00:19:17.840 --> 00:19:19.270 align:start position:0% nice. It's kind of easy instead of going ahead<00:19:18.080><c> and</c><00:19:18.320><c> setting</c><00:19:18.480><c> up</c><00:19:18.559><c> a</c><00:19:18.720><c> cloud</c><00:19:19.039><c> task</c> 00:19:19.270 --> 00:19:19.280 align:start position:0% ahead and setting up a cloud task 00:19:19.280 --> 00:19:21.430 align:start position:0% ahead and setting up a cloud task project.<00:19:20.400><c> It's</c><00:19:20.559><c> just</c><00:19:20.720><c> it's</c><00:19:20.960><c> built</c><00:19:21.200><c> into</c> 00:19:21.430 --> 00:19:21.440 align:start position:0% project. It's just it's built into 00:19:21.440 --> 00:19:24.390 align:start position:0% project. It's just it's built into gadget<00:19:21.919><c> API.NQ</c><00:19:22.880><c> is</c><00:19:23.120><c> powered</c><00:19:23.440><c> by</c><00:19:23.679><c> temporal.</c> 00:19:24.390 --> 00:19:24.400 align:start position:0% gadget API.NQ is powered by temporal. 00:19:24.400 --> 00:19:26.710 align:start position:0% gadget API.NQ is powered by temporal. Let's<00:19:24.640><c> go</c><00:19:24.799><c> ahead</c><00:19:24.960><c> and</c><00:19:26.000><c> create</c><00:19:26.320><c> write</c><00:19:26.559><c> to</c> 00:19:26.710 --> 00:19:26.720 align:start position:0% Let's go ahead and create write to 00:19:26.720 --> 00:19:28.230 align:start position:0% Let's go ahead and create write to Shopify<00:19:27.120><c> and</c><00:19:27.280><c> then</c><00:19:27.440><c> we</c><00:19:27.600><c> can</c><00:19:27.679><c> actually</c><00:19:27.919><c> write</c> 00:19:28.230 --> 00:19:28.240 align:start position:0% Shopify and then we can actually write 00:19:28.240 --> 00:19:29.909 align:start position:0% Shopify and then we can actually write back<00:19:28.400><c> to</c><00:19:28.559><c> Shopify.</c><00:19:29.039><c> Now</c><00:19:29.200><c> this</c><00:19:29.360><c> in</c><00:19:29.520><c> this</c><00:19:29.679><c> case</c> 00:19:29.909 --> 00:19:29.919 align:start position:0% back to Shopify. Now this in this case 00:19:29.919 --> 00:19:32.070 align:start position:0% back to Shopify. Now this in this case because<00:19:30.080><c> there's</c><00:19:30.400><c> you'll</c><00:19:30.640><c> notice</c><00:19:30.799><c> it's</c><00:19:31.039><c> API</c> 00:19:32.070 --> 00:19:32.080 align:start position:0% because there's you'll notice it's API 00:19:32.080 --> 00:19:34.390 align:start position:0% because there's you'll notice it's API write<00:19:32.240><c> to</c><00:19:32.400><c> Shopify.</c><00:19:32.880><c> There's</c><00:19:33.039><c> no</c><00:19:33.600><c> Shopify</c> 00:19:34.390 --> 00:19:34.400 align:start position:0% write to Shopify. There's no Shopify 00:19:34.400 --> 00:19:37.190 align:start position:0% write to Shopify. There's no Shopify product<00:19:34.880><c> in</c><00:19:35.120><c> there.</c><00:19:36.160><c> That</c><00:19:36.320><c> means</c><00:19:36.480><c> I</c><00:19:36.720><c> created</c><00:19:36.960><c> a</c> 00:19:37.190 --> 00:19:37.200 align:start position:0% product in there. That means I created a 00:19:37.200 --> 00:19:38.630 align:start position:0% product in there. That means I created a global<00:19:37.520><c> action.</c><00:19:37.840><c> So,</c><00:19:37.919><c> if</c><00:19:38.080><c> I</c><00:19:38.160><c> just</c><00:19:38.320><c> create</c><00:19:38.480><c> an</c> 00:19:38.630 --> 00:19:38.640 align:start position:0% global action. So, if I just create an 00:19:38.640 --> 00:19:41.990 align:start position:0% global action. So, if I just create an action<00:19:38.880><c> in</c><00:19:39.039><c> this</c><00:19:39.200><c> actions</c><00:19:39.600><c> folder,</c><00:19:40.400><c> write</c><00:19:40.880><c> to</c> 00:19:41.990 --> 00:19:42.000 align:start position:0% action in this actions folder, write to 00:19:42.000 --> 00:19:45.270 align:start position:0% action in this actions folder, write to Shopify. 00:19:45.270 --> 00:19:45.280 align:start position:0% 00:19:45.280 --> 00:19:47.270 align:start position:0% There<00:19:45.440><c> we</c><00:19:45.679><c> go.</c> 00:19:47.270 --> 00:19:47.280 align:start position:0% There we go. 00:19:47.280 --> 00:19:49.990 align:start position:0% There we go. I<00:19:47.520><c> need</c><00:19:47.600><c> to</c><00:19:47.760><c> go</c><00:19:47.919><c> ahead</c><00:19:48.240><c> and</c> 00:19:49.990 --> 00:19:50.000 align:start position:0% I need to go ahead and 00:19:50.000 --> 00:19:51.750 align:start position:0% I need to go ahead and implement<00:19:50.400><c> my</c><00:19:50.720><c> actual</c><00:19:51.039><c> background</c><00:19:51.440><c> action</c> 00:19:51.750 --> 00:19:51.760 align:start position:0% implement my actual background action 00:19:51.760 --> 00:19:52.870 align:start position:0% implement my actual background action here.<00:19:51.919><c> So,</c><00:19:52.080><c> once</c><00:19:52.240><c> again,</c><00:19:52.400><c> I'm</c><00:19:52.559><c> just</c><00:19:52.720><c> going</c><00:19:52.799><c> to</c> 00:19:52.870 --> 00:19:52.880 align:start position:0% here. So, once again, I'm just going to 00:19:52.880 --> 00:19:55.190 align:start position:0% here. So, once again, I'm just going to copy<00:19:53.200><c> paste</c><00:19:53.520><c> code.</c><00:19:54.480><c> I'm</c><00:19:54.640><c> going</c><00:19:54.720><c> to</c><00:19:54.880><c> start</c><00:19:55.039><c> at</c> 00:19:55.190 --> 00:19:55.200 align:start position:0% copy paste code. I'm going to start at 00:19:55.200 --> 00:19:57.110 align:start position:0% copy paste code. I'm going to start at the<00:19:55.360><c> bottom</c><00:19:55.600><c> of</c><00:19:55.760><c> this</c><00:19:56.000><c> one.</c><00:19:56.480><c> So,</c><00:19:56.880><c> you'll</c> 00:19:57.110 --> 00:19:57.120 align:start position:0% the bottom of this one. So, you'll 00:19:57.120 --> 00:19:59.190 align:start position:0% the bottom of this one. So, you'll notice<00:19:57.360><c> a</c><00:19:57.600><c> global</c><00:19:57.840><c> action.</c><00:19:58.480><c> If</c><00:19:58.640><c> I</c><00:19:58.799><c> just</c><00:19:59.039><c> go</c> 00:19:59.190 --> 00:19:59.200 align:start position:0% notice a global action. If I just go 00:19:59.200 --> 00:20:01.830 align:start position:0% notice a global action. If I just go back<00:19:59.440><c> here,</c><00:20:00.000><c> by</c><00:20:00.320><c> default,</c><00:20:00.880><c> our</c><00:20:01.120><c> API</c><00:20:01.440><c> endpoint,</c> 00:20:01.830 --> 00:20:01.840 align:start position:0% back here, by default, our API endpoint, 00:20:01.840 --> 00:20:03.750 align:start position:0% back here, by default, our API endpoint, there<00:20:02.000><c> are</c><00:20:02.080><c> no</c><00:20:02.240><c> parameters.</c><00:20:03.280><c> I</c><00:20:03.440><c> need</c><00:20:03.600><c> to</c><00:20:03.679><c> go</c> 00:20:03.750 --> 00:20:03.760 align:start position:0% there are no parameters. I need to go 00:20:03.760 --> 00:20:05.350 align:start position:0% there are no parameters. I need to go ahead<00:20:03.919><c> and</c><00:20:04.080><c> define</c><00:20:04.480><c> parameters</c><00:20:04.960><c> for</c><00:20:05.200><c> this</c> 00:20:05.350 --> 00:20:05.360 align:start position:0% ahead and define parameters for this 00:20:05.360 --> 00:20:07.190 align:start position:0% ahead and define parameters for this action.<00:20:06.160><c> And</c><00:20:06.400><c> that's</c><00:20:06.559><c> what</c><00:20:06.640><c> I've</c><00:20:06.880><c> done</c><00:20:06.960><c> down</c> 00:20:07.190 --> 00:20:07.200 align:start position:0% action. And that's what I've done down 00:20:07.200 --> 00:20:09.669 align:start position:0% action. And that's what I've done down here.<00:20:07.760><c> So,</c><00:20:08.160><c> I've</c><00:20:08.400><c> got</c><00:20:08.480><c> a</c><00:20:08.720><c> shop</c><00:20:08.960><c> ID,</c><00:20:09.360><c> it's</c><00:20:09.520><c> a</c> 00:20:09.669 --> 00:20:09.679 align:start position:0% here. So, I've got a shop ID, it's a 00:20:09.679 --> 00:20:12.549 align:start position:0% here. So, I've got a shop ID, it's a string,<00:20:10.240><c> product</c><00:20:10.559><c> ID,</c><00:20:11.440><c> it's</c><00:20:11.600><c> a</c><00:20:11.840><c> string,</c><00:20:12.400><c> and</c> 00:20:12.549 --> 00:20:12.559 align:start position:0% string, product ID, it's a string, and 00:20:12.559 --> 00:20:14.950 align:start position:0% string, product ID, it's a string, and then<00:20:12.799><c> an</c><00:20:13.120><c> array</c><00:20:13.440><c> of</c><00:20:13.679><c> strings</c><00:20:14.000><c> for</c><00:20:14.160><c> my</c><00:20:14.320><c> tags.</c> 00:20:14.950 --> 00:20:14.960 align:start position:0% then an array of strings for my tags. 00:20:14.960 --> 00:20:17.270 align:start position:0% then an array of strings for my tags. And<00:20:15.120><c> you</c><00:20:15.280><c> see</c><00:20:15.440><c> that</c><00:20:15.760><c> as</c><00:20:16.000><c> I</c><00:20:16.240><c> as</c><00:20:16.480><c> I</c><00:20:16.559><c> make</c><00:20:16.720><c> edits,</c> 00:20:17.270 --> 00:20:17.280 align:start position:0% And you see that as I as I make edits, 00:20:17.280 --> 00:20:19.990 align:start position:0% And you see that as I as I make edits, my<00:20:17.600><c> my</c><00:20:18.080><c> sample</c><00:20:18.640><c> off</c><00:20:18.880><c> to</c><00:20:19.039><c> the</c><00:20:19.120><c> side</c><00:20:19.360><c> here</c><00:20:19.679><c> also</c> 00:20:19.990 --> 00:20:20.000 align:start position:0% my my sample off to the side here also 00:20:20.000 --> 00:20:21.830 align:start position:0% my my sample off to the side here also updates.<00:20:20.480><c> So,</c><00:20:21.120><c> you</c><00:20:21.280><c> know,</c><00:20:21.360><c> if</c><00:20:21.520><c> I</c><00:20:21.600><c> were</c><00:20:21.760><c> to</c> 00:20:21.830 --> 00:20:21.840 align:start position:0% updates. So, you know, if I were to 00:20:21.840 --> 00:20:23.430 align:start position:0% updates. So, you know, if I were to change<00:20:22.000><c> product</c><00:20:22.640><c> to</c><00:20:22.720><c> a</c><00:20:22.880><c> number,</c><00:20:23.120><c> all</c><00:20:23.280><c> of</c><00:20:23.360><c> a</c> 00:20:23.430 --> 00:20:23.440 align:start position:0% change product to a number, all of a 00:20:23.440 --> 00:20:26.470 align:start position:0% change product to a number, all of a sudden,<00:20:23.600><c> we</c><00:20:23.679><c> get</c><00:20:23.840><c> one,</c><00:20:24.000><c> two,</c><00:20:24.240><c> three.</c><00:20:24.960><c> Nice.</c> 00:20:26.470 --> 00:20:26.480 align:start position:0% sudden, we get one, two, three. Nice. 00:20:26.480 --> 00:20:28.230 align:start position:0% sudden, we get one, two, three. Nice. Now,<00:20:26.720><c> let's</c><00:20:26.960><c> go</c><00:20:27.120><c> to</c><00:20:27.280><c> my</c><00:20:27.520><c> actual</c> 00:20:28.230 --> 00:20:28.240 align:start position:0% Now, let's go to my actual 00:20:28.240 --> 00:20:30.950 align:start position:0% Now, let's go to my actual implementation<00:20:29.200><c> here.</c><00:20:30.320><c> This</c><00:20:30.480><c> is</c><00:20:30.559><c> my</c><00:20:30.720><c> run</c> 00:20:30.950 --> 00:20:30.960 align:start position:0% implementation here. This is my run 00:20:30.960 --> 00:20:32.950 align:start position:0% implementation here. This is my run function.<00:20:31.440><c> I'm</c><00:20:31.679><c> actually</c><00:20:31.919><c> going</c><00:20:32.000><c> to</c><00:20:32.159><c> go</c><00:20:32.559><c> back</c> 00:20:32.950 --> 00:20:32.960 align:start position:0% function. I'm actually going to go back 00:20:32.960 --> 00:20:34.470 align:start position:0% function. I'm actually going to go back a<00:20:33.200><c> little</c><00:20:33.360><c> bit</c><00:20:33.600><c> and</c><00:20:33.919><c> talk</c><00:20:34.080><c> about</c><00:20:34.240><c> the</c> 00:20:34.470 --> 00:20:34.480 align:start position:0% a little bit and talk about the 00:20:34.480 --> 00:20:36.390 align:start position:0% a little bit and talk about the difference<00:20:34.720><c> between</c><00:20:35.039><c> run</c><00:20:35.200><c> and</c><00:20:35.440><c> on</c><00:20:35.679><c> success.</c><00:20:36.159><c> I</c> 00:20:36.390 --> 00:20:36.400 align:start position:0% difference between run and on success. I 00:20:36.400 --> 00:20:38.230 align:start position:0% difference between run and on success. I didn't<00:20:36.559><c> cover</c><00:20:36.720><c> that</c><00:20:36.880><c> before,</c><00:20:37.120><c> but</c><00:20:37.360><c> I</c><00:20:37.520><c> should.</c> 00:20:38.230 --> 00:20:38.240 align:start position:0% didn't cover that before, but I should. 00:20:38.240 --> 00:20:39.750 align:start position:0% didn't cover that before, but I should. But<00:20:38.480><c> let's</c><00:20:38.640><c> focus</c><00:20:38.880><c> on</c><00:20:39.039><c> the</c><00:20:39.280><c> implementation</c> 00:20:39.750 --> 00:20:39.760 align:start position:0% But let's focus on the implementation 00:20:39.760 --> 00:20:41.510 align:start position:0% But let's focus on the implementation here<00:20:39.919><c> first.</c><00:20:40.159><c> So,</c><00:20:40.320><c> I'm</c><00:20:40.480><c> checking</c><00:20:40.720><c> my</c><00:20:40.880><c> params.</c> 00:20:41.510 --> 00:20:41.520 align:start position:0% here first. So, I'm checking my params. 00:20:41.520 --> 00:20:42.950 align:start position:0% here first. So, I'm checking my params. You<00:20:41.679><c> see,</c><00:20:41.840><c> they</c><00:20:42.080><c> are</c><00:20:42.240><c> going</c><00:20:42.400><c> to</c><00:20:42.480><c> be</c><00:20:42.640><c> fully</c> 00:20:42.950 --> 00:20:42.960 align:start position:0% You see, they are going to be fully 00:20:42.960 --> 00:20:45.590 align:start position:0% You see, they are going to be fully typed<00:20:43.200><c> now</c><00:20:43.440><c> because</c><00:20:43.679><c> I've</c><00:20:44.880><c> applied</c><00:20:45.360><c> this</c> 00:20:45.590 --> 00:20:45.600 align:start position:0% typed now because I've applied this 00:20:45.600 --> 00:20:47.510 align:start position:0% typed now because I've applied this params<00:20:46.159><c> definition.</c><00:20:46.960><c> We're</c><00:20:47.200><c> checking</c><00:20:47.280><c> to</c><00:20:47.440><c> see</c> 00:20:47.510 --> 00:20:47.520 align:start position:0% params definition. We're checking to see 00:20:47.520 --> 00:20:49.190 align:start position:0% params definition. We're checking to see if<00:20:47.679><c> we</c><00:20:47.760><c> have</c><00:20:47.840><c> a</c><00:20:48.000><c> shop</c><00:20:48.320><c> ID</c><00:20:48.480><c> and</c><00:20:48.559><c> a</c><00:20:48.720><c> product</c><00:20:48.880><c> ID.</c> 00:20:49.190 --> 00:20:49.200 align:start position:0% if we have a shop ID and a product ID. 00:20:49.200 --> 00:20:51.430 align:start position:0% if we have a shop ID and a product ID. If<00:20:49.280><c> not,</c><00:20:49.440><c> we're</c><00:20:49.600><c> throwing</c><00:20:49.840><c> an</c><00:20:50.159><c> error.</c><00:20:51.280><c> And</c> 00:20:51.430 --> 00:20:51.440 align:start position:0% If not, we're throwing an error. And 00:20:51.440 --> 00:20:53.909 align:start position:0% If not, we're throwing an error. And then<00:20:52.400><c> we're</c><00:20:52.640><c> getting</c><00:20:52.799><c> our</c><00:20:53.120><c> authenticated</c> 00:20:53.909 --> 00:20:53.919 align:start position:0% then we're getting our authenticated 00:20:53.919 --> 00:20:55.430 align:start position:0% then we're getting our authenticated Shopify<00:20:54.400><c> API</c><00:20:54.799><c> clients.</c><00:20:55.200><c> We're</c><00:20:55.280><c> going</c> 00:20:55.430 --> 00:20:55.440 align:start position:0% Shopify API clients. We're going 00:20:55.440 --> 00:20:57.270 align:start position:0% Shopify API clients. We're going connections.shopify.for 00:20:57.270 --> 00:20:57.280 align:start position:0% connections.shopify.for 00:20:57.280 --> 00:21:01.029 align:start position:0% connections.shopify.for ID.<00:20:58.240><c> It's</c><00:20:58.480><c> getting</c><00:20:58.640><c> us</c><00:20:58.880><c> the</c><00:20:59.120><c> client</c><00:20:59.520><c> here.</c><00:21:00.720><c> So</c> 00:21:01.029 --> 00:21:01.039 align:start position:0% ID. It's getting us the client here. So 00:21:01.039 --> 00:21:03.510 align:start position:0% ID. It's getting us the client here. So it<00:21:01.280><c> is</c><00:21:01.440><c> an</c><00:21:01.600><c> authenticated</c><00:21:02.559><c> client</c><00:21:03.120><c> that</c><00:21:03.360><c> is</c> 00:21:03.510 --> 00:21:03.520 align:start position:0% it is an authenticated client that is 00:21:03.520 --> 00:21:05.190 align:start position:0% it is an authenticated client that is ready<00:21:03.679><c> to</c><00:21:03.840><c> write</c><00:21:04.080><c> back</c><00:21:04.240><c> to</c><00:21:04.400><c> the</c><00:21:04.640><c> store.</c><00:21:04.880><c> And</c><00:21:05.039><c> if</c> 00:21:05.190 --> 00:21:05.200 align:start position:0% ready to write back to the store. And if 00:21:05.200 --> 00:21:06.470 align:start position:0% ready to write back to the store. And if I<00:21:05.360><c> actually</c><00:21:05.600><c> check,</c><00:21:05.919><c> remember</c><00:21:06.159><c> this</c><00:21:06.320><c> is</c> 00:21:06.470 --> 00:21:06.480 align:start position:0% I actually check, remember this is 00:21:06.480 --> 00:21:08.390 align:start position:0% I actually check, remember this is serverless<00:21:06.880><c> node.</c><00:21:07.280><c> So</c><00:21:07.360><c> if</c><00:21:07.520><c> I</c><00:21:07.760><c> have</c><00:21:07.840><c> a</c><00:21:08.000><c> package</c> 00:21:08.390 --> 00:21:08.400 align:start position:0% serverless node. So if I have a package 00:21:08.400 --> 00:21:10.630 align:start position:0% serverless node. So if I have a package JSON<00:21:08.799><c> file,</c> 00:21:10.630 --> 00:21:10.640 align:start position:0% JSON file, 00:21:10.640 --> 00:21:12.470 align:start position:0% JSON file, it's<00:21:10.880><c> just</c><00:21:11.120><c> Shopify</c><00:21:11.520><c> API</c><00:21:11.919><c> node.</c><00:21:12.159><c> We're</c><00:21:12.320><c> just</c> 00:21:12.470 --> 00:21:12.480 align:start position:0% it's just Shopify API node. We're just 00:21:12.480 --> 00:21:14.470 align:start position:0% it's just Shopify API node. We're just wrapping<00:21:12.799><c> that</c><00:21:13.039><c> up.</c><00:21:13.600><c> While</c><00:21:13.840><c> I'm</c><00:21:14.080><c> here</c><00:21:14.159><c> in</c><00:21:14.320><c> the</c> 00:21:14.470 --> 00:21:14.480 align:start position:0% wrapping that up. While I'm here in the 00:21:14.480 --> 00:21:17.190 align:start position:0% wrapping that up. While I'm here in the package<00:21:14.720><c> JSON</c><00:21:15.039><c> file,</c><00:21:15.360><c> you</c><00:21:15.520><c> can</c><00:21:15.679><c> add</c><00:21:16.159><c> whatever</c> 00:21:17.190 --> 00:21:17.200 align:start position:0% package JSON file, you can add whatever 00:21:17.200 --> 00:21:19.110 align:start position:0% package JSON file, you can add whatever packages<00:21:17.760><c> you're</c><00:21:18.000><c> used</c><00:21:18.240><c> to</c><00:21:18.480><c> using.</c><00:21:18.880><c> Once</c> 00:21:19.110 --> 00:21:19.120 align:start position:0% packages you're used to using. Once 00:21:19.120 --> 00:21:20.549 align:start position:0% packages you're used to using. Once again,<00:21:19.360><c> it</c><00:21:19.520><c> is</c><00:21:19.600><c> just</c><00:21:19.760><c> notes.</c><00:21:20.080><c> So</c><00:21:20.159><c> if</c><00:21:20.320><c> you</c><00:21:20.400><c> want</c> 00:21:20.549 --> 00:21:20.559 align:start position:0% again, it is just notes. So if you want 00:21:20.559 --> 00:21:23.750 align:start position:0% again, it is just notes. So if you want to<00:21:20.720><c> import</c><00:21:22.159><c> load</c><00:21:22.480><c> dash</c><00:21:22.799><c> to</c><00:21:23.039><c> do</c><00:21:23.200><c> something,</c><00:21:23.600><c> you</c> 00:21:23.750 --> 00:21:23.760 align:start position:0% to import load dash to do something, you 00:21:23.760 --> 00:21:25.909 align:start position:0% to import load dash to do something, you can<00:21:23.840><c> go</c><00:21:23.919><c> ahead</c><00:21:24.080><c> and</c><00:21:24.240><c> do</c><00:21:24.400><c> so.</c> 00:21:25.909 --> 00:21:25.919 align:start position:0% can go ahead and do so. 00:21:25.919 --> 00:21:27.350 align:start position:0% can go ahead and do so. Let's<00:21:26.159><c> go</c><00:21:26.320><c> back</c><00:21:26.400><c> to</c><00:21:26.480><c> our</c><00:21:26.640><c> write</c><00:21:26.880><c> Shopify</c> 00:21:27.350 --> 00:21:27.360 align:start position:0% Let's go back to our write Shopify 00:21:27.360 --> 00:21:29.990 align:start position:0% Let's go back to our write Shopify action.<00:21:28.559><c> We're</c><00:21:28.720><c> just</c><00:21:28.880><c> using</c><00:21:29.120><c> this</c><00:21:29.280><c> API</c><00:21:29.679><c> client</c> 00:21:29.990 --> 00:21:30.000 align:start position:0% action. We're just using this API client 00:21:30.000 --> 00:21:32.230 align:start position:0% action. We're just using this API client to<00:21:30.159><c> go</c><00:21:30.240><c> ahead</c><00:21:30.640><c> Shopify.graphql</c> 00:21:32.230 --> 00:21:32.240 align:start position:0% to go ahead Shopify.graphql 00:21:32.240 --> 00:21:34.390 align:start position:0% to go ahead Shopify.graphql send<00:21:32.480><c> this</c><00:21:32.720><c> mutation</c><00:21:33.360><c> for</c><00:21:33.679><c> this</c><00:21:33.919><c> product,</c> 00:21:34.390 --> 00:21:34.400 align:start position:0% send this mutation for this product, 00:21:34.400 --> 00:21:36.710 align:start position:0% send this mutation for this product, update<00:21:34.799><c> the</c><00:21:34.960><c> tags,</c><00:21:35.440><c> and</c><00:21:35.600><c> we're</c><00:21:35.840><c> good.</c><00:21:36.480><c> Now,</c> 00:21:36.710 --> 00:21:36.720 align:start position:0% update the tags, and we're good. Now, 00:21:36.720 --> 00:21:38.470 align:start position:0% update the tags, and we're good. Now, what's<00:21:37.039><c> nice</c><00:21:37.360><c> about</c><00:21:37.760><c> this</c><00:21:38.000><c> being</c><00:21:38.240><c> a</c> 00:21:38.470 --> 00:21:38.480 align:start position:0% what's nice about this being a 00:21:38.480 --> 00:21:41.110 align:start position:0% what's nice about this being a background<00:21:38.880><c> action</c><00:21:39.520><c> is</c><00:21:39.760><c> that</c><00:21:40.000><c> retries</c><00:21:40.640><c> will</c> 00:21:41.110 --> 00:21:41.120 align:start position:0% background action is that retries will 00:21:41.120 --> 00:21:44.230 align:start position:0% background action is that retries will already<00:21:41.760><c> be</c><00:21:42.000><c> built</c><00:21:42.559><c> in.</c><00:21:43.280><c> So,</c><00:21:43.520><c> when</c><00:21:43.840><c> I</c><00:21:44.000><c> call</c> 00:21:44.230 --> 00:21:44.240 align:start position:0% already be built in. So, when I call 00:21:44.240 --> 00:21:46.470 align:start position:0% already be built in. So, when I call this<00:21:44.400><c> action</c><00:21:44.720><c> with</c><00:21:44.960><c> API.NQ,</c> 00:21:46.470 --> 00:21:46.480 align:start position:0% this action with API.NQ, 00:21:46.480 --> 00:21:47.750 align:start position:0% this action with API.NQ, when<00:21:46.720><c> it's</c><00:21:46.880><c> run,</c><00:21:47.120><c> it's</c><00:21:47.280><c> going</c><00:21:47.360><c> to</c><00:21:47.440><c> be</c><00:21:47.520><c> added</c><00:21:47.679><c> to</c> 00:21:47.750 --> 00:21:47.760 align:start position:0% when it's run, it's going to be added to 00:21:47.760 --> 00:21:50.070 align:start position:0% when it's run, it's going to be added to this<00:21:47.919><c> cues</c><00:21:48.320><c> tab.</c><00:21:48.799><c> And</c><00:21:49.039><c> if</c><00:21:49.280><c> there's</c><00:21:49.520><c> a</c><00:21:49.679><c> failure</c> 00:21:50.070 --> 00:21:50.080 align:start position:0% this cues tab. And if there's a failure 00:21:50.080 --> 00:21:53.430 align:start position:0% this cues tab. And if there's a failure here,<00:21:51.120><c> it</c><00:21:51.360><c> will</c><00:21:51.679><c> automatically</c><00:21:52.400><c> retry</c><00:21:53.120><c> up</c><00:21:53.280><c> to</c> 00:21:53.430 --> 00:21:53.440 align:start position:0% here, it will automatically retry up to 00:21:53.440 --> 00:21:56.549 align:start position:0% here, it will automatically retry up to a<00:21:53.600><c> set</c><00:21:53.840><c> number</c><00:21:54.000><c> of</c><00:21:54.240><c> times.</c><00:21:55.120><c> And</c><00:21:55.280><c> if</c><00:21:55.520><c> not</c> 00:21:56.549 --> 00:21:56.559 align:start position:0% a set number of times. And if not 00:21:56.559 --> 00:21:58.390 align:start position:0% a set number of times. And if not actions<00:21:56.960><c> that</c><00:21:57.200><c> have</c><00:21:57.440><c> determined</c><00:21:57.919><c> to</c><00:21:58.159><c> be</c> 00:21:58.390 --> 00:21:58.400 align:start position:0% actions that have determined to be 00:21:58.400 --> 00:22:00.710 align:start position:0% actions that have determined to be failed<00:21:58.880><c> after</c><00:21:59.200><c> retries</c><00:21:59.760><c> will</c><00:21:59.919><c> be</c><00:22:00.080><c> visible</c><00:22:00.480><c> in</c> 00:22:00.710 --> 00:22:00.720 align:start position:0% failed after retries will be visible in 00:22:00.720 --> 00:22:03.350 align:start position:0% failed after retries will be visible in this<00:22:00.960><c> cues</c><00:22:01.360><c> tab</c><00:22:01.840><c> with</c><00:22:02.240><c> any</c><00:22:02.640><c> stack</c><00:22:02.960><c> trace</c> 00:22:03.350 --> 00:22:03.360 align:start position:0% this cues tab with any stack trace 00:22:03.360 --> 00:22:05.190 align:start position:0% this cues tab with any stack trace information.<00:22:03.840><c> So</c><00:22:03.919><c> you</c><00:22:04.159><c> go</c><00:22:04.320><c> ahead</c><00:22:04.480><c> and</c><00:22:04.720><c> debug.</c> 00:22:05.190 --> 00:22:05.200 align:start position:0% information. So you go ahead and debug. 00:22:05.200 --> 00:22:08.070 align:start position:0% information. So you go ahead and debug. So<00:22:05.360><c> for</c><00:22:05.440><c> example,</c><00:22:05.760><c> if</c><00:22:06.000><c> I</c><00:22:06.080><c> have</c><00:22:06.159><c> an</c><00:22:06.400><c> error</c><00:22:06.880><c> in</c><00:22:07.200><c> my</c> 00:22:08.070 --> 00:22:08.080 align:start position:0% So for example, if I have an error in my 00:22:08.080 --> 00:22:10.230 align:start position:0% So for example, if I have an error in my utils<00:22:08.480><c> function,</c><00:22:08.799><c> my</c><00:22:08.960><c> apply</c><00:22:09.280><c> tags</c><00:22:09.600><c> function</c> 00:22:10.230 --> 00:22:10.240 align:start position:0% utils function, my apply tags function 00:22:10.240 --> 00:22:11.990 align:start position:0% utils function, my apply tags function and<00:22:10.480><c> I'm</c><00:22:10.640><c> missing</c><00:22:10.880><c> a</c><00:22:11.039><c> product</c><00:22:11.360><c> ID</c><00:22:11.520><c> and</c><00:22:11.679><c> I</c><00:22:11.840><c> keep</c> 00:22:11.990 --> 00:22:12.000 align:start position:0% and I'm missing a product ID and I keep 00:22:12.000 --> 00:22:12.950 align:start position:0% and I'm missing a product ID and I keep throwing<00:22:12.240><c> this</c><00:22:12.480><c> error.</c><00:22:12.640><c> I'm</c><00:22:12.799><c> going</c><00:22:12.799><c> to</c><00:22:12.880><c> go</c> 00:22:12.950 --> 00:22:12.960 align:start position:0% throwing this error. I'm going to go 00:22:12.960 --> 00:22:16.549 align:start position:0% throwing this error. I'm going to go ahead<00:22:13.120><c> and</c><00:22:13.280><c> see</c><00:22:13.440><c> that</c><00:22:13.600><c> in</c><00:22:13.840><c> my</c><00:22:14.000><c> logs.</c> 00:22:16.549 --> 00:22:16.559 align:start position:0% ahead and see that in my logs. 00:22:16.559 --> 00:22:18.070 align:start position:0% ahead and see that in my logs. Okay,<00:22:16.880><c> so</c><00:22:17.039><c> that's</c><00:22:17.280><c> my</c><00:22:17.440><c> back</c><00:22:17.600><c> end.</c><00:22:17.919><c> That's</c> 00:22:18.070 --> 00:22:18.080 align:start position:0% Okay, so that's my back end. That's 00:22:18.080 --> 00:22:19.669 align:start position:0% Okay, so that's my back end. That's pretty<00:22:18.320><c> groovy.</c><00:22:18.640><c> I</c><00:22:18.799><c> did</c><00:22:18.960><c> mention</c><00:22:19.200><c> that</c><00:22:19.360><c> I</c><00:22:19.520><c> just</c> 00:22:19.669 --> 00:22:19.679 align:start position:0% pretty groovy. I did mention that I just 00:22:19.679 --> 00:22:21.350 align:start position:0% pretty groovy. I did mention that I just want<00:22:19.840><c> to</c><00:22:20.080><c> flip</c><00:22:20.400><c> back</c><00:22:20.559><c> to</c><00:22:20.640><c> my</c><00:22:20.799><c> create</c><00:22:21.039><c> action.</c> 00:22:21.350 --> 00:22:21.360 align:start position:0% want to flip back to my create action. 00:22:21.360 --> 00:22:23.590 align:start position:0% want to flip back to my create action. So<00:22:21.520><c> I</c><00:22:21.679><c> added</c><00:22:21.919><c> my</c><00:22:22.080><c> custom</c><00:22:22.400><c> code</c><00:22:22.559><c> to</c><00:22:22.720><c> this</c><00:22:23.120><c> on</c> 00:22:23.590 --> 00:22:23.600 align:start position:0% So I added my custom code to this on 00:22:23.600 --> 00:22:28.390 align:start position:0% So I added my custom code to this on success<00:22:24.480><c> function.</c><00:22:25.600><c> On</c><00:22:25.919><c> success</c><00:22:26.720><c> and</c><00:22:27.120><c> run</c> 00:22:28.390 --> 00:22:28.400 align:start position:0% success function. On success and run 00:22:28.400 --> 00:22:30.390 align:start position:0% success function. On success and run exist<00:22:28.720><c> in</c><00:22:28.960><c> our</c><00:22:29.120><c> actions</c><00:22:29.760><c> but</c><00:22:30.000><c> they</c><00:22:30.240><c> have</c> 00:22:30.390 --> 00:22:30.400 align:start position:0% exist in our actions but they have 00:22:30.400 --> 00:22:32.549 align:start position:0% exist in our actions but they have different<00:22:30.640><c> purposes.</c><00:22:31.280><c> Run</c><00:22:31.600><c> is</c><00:22:31.840><c> transactional</c> 00:22:32.549 --> 00:22:32.559 align:start position:0% different purposes. Run is transactional 00:22:32.559 --> 00:22:34.470 align:start position:0% different purposes. Run is transactional which<00:22:32.799><c> means</c><00:22:33.120><c> any</c><00:22:33.440><c> failures</c><00:22:33.919><c> in</c><00:22:34.080><c> my</c><00:22:34.240><c> run</c> 00:22:34.470 --> 00:22:34.480 align:start position:0% which means any failures in my run 00:22:34.480 --> 00:22:37.350 align:start position:0% which means any failures in my run function<00:22:34.799><c> will</c><00:22:35.120><c> roll</c><00:22:35.520><c> back</c><00:22:36.000><c> everything</c><00:22:36.960><c> that</c> 00:22:37.350 --> 00:22:37.360 align:start position:0% function will roll back everything that 00:22:37.360 --> 00:22:40.470 align:start position:0% function will roll back everything that has<00:22:37.760><c> occurred</c><00:22:38.159><c> there.</c><00:22:38.960><c> So</c><00:22:39.200><c> for</c><00:22:39.280><c> example</c><00:22:39.840><c> if</c><00:22:40.159><c> I</c> 00:22:40.470 --> 00:22:40.480 align:start position:0% has occurred there. So for example if I 00:22:40.480 --> 00:22:43.750 align:start position:0% has occurred there. So for example if I am<00:22:40.960><c> saving</c><00:22:41.360><c> something</c><00:22:41.760><c> to</c><00:22:42.000><c> the</c><00:22:42.240><c> database</c><00:22:43.520><c> then</c> 00:22:43.750 --> 00:22:43.760 align:start position:0% am saving something to the database then 00:22:43.760 --> 00:22:46.149 align:start position:0% am saving something to the database then I<00:22:44.000><c> throw</c><00:22:44.240><c> an</c><00:22:44.559><c> error</c><00:22:45.200><c> that</c><00:22:45.440><c> save</c><00:22:45.760><c> will</c><00:22:46.000><c> be</c> 00:22:46.149 --> 00:22:46.159 align:start position:0% I throw an error that save will be 00:22:46.159 --> 00:22:48.470 align:start position:0% I throw an error that save will be rolled<00:22:46.480><c> back.</c><00:22:46.799><c> It</c><00:22:47.039><c> won't</c><00:22:47.280><c> be</c><00:22:47.440><c> persisted</c><00:22:48.000><c> to</c><00:22:48.240><c> my</c> 00:22:48.470 --> 00:22:48.480 align:start position:0% rolled back. It won't be persisted to my 00:22:48.480 --> 00:22:50.390 align:start position:0% rolled back. It won't be persisted to my gadget<00:22:48.880><c> database.</c> 00:22:50.390 --> 00:22:50.400 align:start position:0% gadget database. 00:22:50.400 --> 00:22:53.110 align:start position:0% gadget database. The<00:22:50.720><c> reason</c><00:22:50.960><c> I'm</c><00:22:51.360><c> adding</c><00:22:51.919><c> my</c><00:22:52.240><c> custom</c><00:22:52.720><c> code</c><00:22:52.960><c> to</c> 00:22:53.110 --> 00:22:53.120 align:start position:0% The reason I'm adding my custom code to 00:22:53.120 --> 00:22:55.430 align:start position:0% The reason I'm adding my custom code to my<00:22:53.280><c> on</c><00:22:53.520><c> success</c><00:22:53.919><c> function</c><00:22:54.799><c> is</c><00:22:55.120><c> because</c><00:22:55.280><c> I'm</c> 00:22:55.430 --> 00:22:55.440 align:start position:0% my on success function is because I'm 00:22:55.440 --> 00:22:56.950 align:start position:0% my on success function is because I'm writing<00:22:55.679><c> to</c><00:22:55.840><c> Shopify.</c><00:22:56.320><c> So</c><00:22:56.400><c> if</c><00:22:56.559><c> I</c><00:22:56.640><c> write</c><00:22:56.799><c> to</c> 00:22:56.950 --> 00:22:56.960 align:start position:0% writing to Shopify. So if I write to 00:22:56.960 --> 00:22:59.669 align:start position:0% writing to Shopify. So if I write to Shopify<00:22:57.440><c> and</c><00:22:57.679><c> then</c><00:22:58.000><c> something</c><00:22:58.400><c> fails,</c><00:22:59.440><c> I</c> 00:22:59.669 --> 00:22:59.679 align:start position:0% Shopify and then something fails, I 00:22:59.679 --> 00:23:01.590 align:start position:0% Shopify and then something fails, I can't<00:22:59.840><c> roll</c><00:23:00.080><c> back</c><00:23:00.320><c> that</c><00:23:00.640><c> write.</c><00:23:01.120><c> So</c><00:23:01.280><c> on</c> 00:23:01.590 --> 00:23:01.600 align:start position:0% can't roll back that write. So on 00:23:01.600 --> 00:23:03.990 align:start position:0% can't roll back that write. So on success<00:23:01.919><c> is</c><00:23:02.080><c> good</c><00:23:02.240><c> for</c><00:23:02.400><c> longer</c><00:23:03.039><c> running</c><00:23:03.679><c> side</c> 00:23:03.990 --> 00:23:04.000 align:start position:0% success is good for longer running side 00:23:04.000 --> 00:23:07.669 align:start position:0% success is good for longer running side effects,<00:23:04.880><c> any</c><00:23:05.280><c> sort</c><00:23:05.600><c> of</c><00:23:05.919><c> writes</c><00:23:06.320><c> out.</c><00:23:07.360><c> I</c><00:23:07.600><c> want</c> 00:23:07.669 --> 00:23:07.679 align:start position:0% effects, any sort of writes out. I want 00:23:07.679 --> 00:23:09.190 align:start position:0% effects, any sort of writes out. I want to<00:23:07.760><c> put</c><00:23:07.919><c> my</c><00:23:08.080><c> code</c><00:23:08.240><c> in</c><00:23:08.400><c> on</c><00:23:08.640><c> success.</c><00:23:08.960><c> So</c><00:23:09.039><c> we've</c> 00:23:09.190 --> 00:23:09.200 align:start position:0% to put my code in on success. So we've 00:23:09.200 --> 00:23:10.310 align:start position:0% to put my code in on success. So we've got<00:23:09.360><c> a</c><00:23:09.440><c> lot</c><00:23:09.600><c> more</c><00:23:09.760><c> information</c><00:23:10.000><c> on</c><00:23:10.159><c> the</c> 00:23:10.310 --> 00:23:10.320 align:start position:0% got a lot more information on the 00:23:10.320 --> 00:23:11.669 align:start position:0% got a lot more information on the differences<00:23:10.559><c> between</c><00:23:10.880><c> run</c><00:23:11.200><c> on</c><00:23:11.360><c> success</c><00:23:11.520><c> in</c> 00:23:11.669 --> 00:23:11.679 align:start position:0% differences between run on success in 00:23:11.679 --> 00:23:12.870 align:start position:0% differences between run on success in our<00:23:11.840><c> docs,</c><00:23:12.000><c> but</c><00:23:12.159><c> I</c><00:23:12.320><c> just</c><00:23:12.400><c> want</c><00:23:12.480><c> to</c><00:23:12.640><c> quickly</c> 00:23:12.870 --> 00:23:12.880 align:start position:0% our docs, but I just want to quickly 00:23:12.880 --> 00:23:15.270 align:start position:0% our docs, but I just want to quickly call<00:23:13.120><c> that</c><00:23:13.280><c> out.</c> 00:23:15.270 --> 00:23:15.280 align:start position:0% call that out. 00:23:15.280 --> 00:23:17.270 align:start position:0% call that out. Okay,<00:23:15.760><c> perfect.</c><00:23:16.159><c> The</c><00:23:16.480><c> last</c><00:23:16.559><c> thing</c><00:23:16.720><c> to</c><00:23:16.880><c> do</c><00:23:17.120><c> now</c> 00:23:17.270 --> 00:23:17.280 align:start position:0% Okay, perfect. The last thing to do now 00:23:17.280 --> 00:23:20.230 align:start position:0% Okay, perfect. The last thing to do now is<00:23:17.600><c> build</c><00:23:18.000><c> my</c><00:23:18.720><c> front</c><00:23:18.960><c> end.</c><00:23:19.440><c> So,</c><00:23:19.760><c> let's</c><00:23:20.000><c> go</c><00:23:20.080><c> back</c> 00:23:20.230 --> 00:23:20.240 align:start position:0% is build my front end. So, let's go back 00:23:20.240 --> 00:23:22.230 align:start position:0% is build my front end. So, let's go back to<00:23:20.320><c> our</c><00:23:20.480><c> web</c><00:23:20.720><c> folder.</c> 00:23:22.230 --> 00:23:22.240 align:start position:0% to our web folder. 00:23:22.240 --> 00:23:26.070 align:start position:0% to our web folder. We've<00:23:22.400><c> got</c><00:23:22.559><c> our</c><00:23:22.880><c> app</c><00:23:23.200><c> index</c><00:23:23.679><c> file.</c> 00:23:26.070 --> 00:23:26.080 align:start position:0% We've got our app index file. 00:23:26.080 --> 00:23:27.590 align:start position:0% We've got our app index file. I'm<00:23:26.240><c> just</c><00:23:26.400><c> going</c><00:23:26.480><c> to</c><00:23:26.559><c> copy</c><00:23:26.880><c> paste</c><00:23:27.120><c> some</c><00:23:27.280><c> code</c> 00:23:27.590 --> 00:23:27.600 align:start position:0% I'm just going to copy paste some code 00:23:27.600 --> 00:23:30.390 align:start position:0% I'm just going to copy paste some code once<00:23:27.840><c> again.</c> 00:23:30.390 --> 00:23:30.400 align:start position:0% once again. 00:23:30.400 --> 00:23:33.909 align:start position:0% once again. Now,<00:23:31.039><c> because</c><00:23:31.520><c> Gadget</c><00:23:32.000><c> knows,</c><00:23:33.280><c> there</c><00:23:33.520><c> we</c><00:23:33.600><c> go.</c> 00:23:33.909 --> 00:23:33.919 align:start position:0% Now, because Gadget knows, there we go. 00:23:33.919 --> 00:23:36.149 align:start position:0% Now, because Gadget knows, there we go. Paste<00:23:34.159><c> it</c><00:23:34.320><c> in.</c><00:23:34.880><c> Because</c><00:23:35.200><c> Gadget</c><00:23:35.679><c> knows</c><00:23:35.919><c> the</c> 00:23:36.149 --> 00:23:36.159 align:start position:0% Paste it in. Because Gadget knows the 00:23:36.159 --> 00:23:40.230 align:start position:0% Paste it in. Because Gadget knows the shape<00:23:36.799><c> of</c><00:23:37.120><c> my</c><00:23:37.360><c> APIs</c><00:23:38.159><c> and</c><00:23:38.480><c> my</c><00:23:38.799><c> data</c><00:23:39.039><c> models,</c><00:23:40.000><c> we</c> 00:23:40.230 --> 00:23:40.240 align:start position:0% shape of my APIs and my data models, we 00:23:40.240 --> 00:23:42.630 align:start position:0% shape of my APIs and my data models, we can<00:23:40.320><c> just</c><00:23:40.480><c> use</c><00:23:40.640><c> these</c><00:23:41.039><c> auto</c><00:23:41.520><c> components,</c><00:23:42.400><c> auto</c> 00:23:42.630 --> 00:23:42.640 align:start position:0% can just use these auto components, auto 00:23:42.640 --> 00:23:46.549 align:start position:0% can just use these auto components, auto form<00:23:42.960><c> and</c><00:23:43.120><c> auto</c><00:23:43.440><c> table</c><00:23:44.400><c> to</c><00:23:45.039><c> quickly</c><00:23:45.840><c> build</c> 00:23:46.549 --> 00:23:46.559 align:start position:0% form and auto table to quickly build 00:23:46.559 --> 00:23:48.789 align:start position:0% form and auto table to quickly build front<00:23:46.880><c> end.</c><00:23:47.200><c> So</c><00:23:47.360><c> in</c><00:23:47.520><c> my</c><00:23:47.679><c> case,</c><00:23:48.159><c> I</c><00:23:48.320><c> just</c><00:23:48.480><c> need</c><00:23:48.640><c> a</c> 00:23:48.789 --> 00:23:48.799 align:start position:0% front end. So in my case, I just need a 00:23:48.799 --> 00:23:50.549 align:start position:0% front end. So in my case, I just need a form<00:23:49.360><c> for</c><00:23:49.600><c> merchants</c><00:23:50.000><c> to</c><00:23:50.080><c> enter</c><00:23:50.320><c> these</c> 00:23:50.549 --> 00:23:50.559 align:start position:0% form for merchants to enter these 00:23:50.559 --> 00:23:52.870 align:start position:0% form for merchants to enter these keywords<00:23:51.360><c> and</c><00:23:51.600><c> I</c><00:23:51.760><c> want</c><00:23:51.840><c> a</c><00:23:52.080><c> table</c><00:23:52.320><c> to</c><00:23:52.480><c> display</c> 00:23:52.870 --> 00:23:52.880 align:start position:0% keywords and I want a table to display 00:23:52.880 --> 00:23:54.230 align:start position:0% keywords and I want a table to display entered<00:23:53.120><c> keywords.</c><00:23:53.520><c> So</c><00:23:53.600><c> if</c><00:23:53.760><c> I</c><00:23:53.840><c> go</c><00:23:53.919><c> back</c><00:23:54.000><c> to</c><00:23:54.159><c> my</c> 00:23:54.230 --> 00:23:54.240 align:start position:0% entered keywords. So if I go back to my 00:23:54.240 --> 00:24:00.470 align:start position:0% entered keywords. So if I go back to my app<00:23:54.480><c> here</c><00:23:54.559><c> in</c><00:23:54.799><c> my</c><00:23:54.880><c> admin,</c> 00:24:00.470 --> 00:24:00.480 align:start position:0% 00:24:00.480 --> 00:24:03.510 align:start position:0% it'll<00:24:00.799><c> load</c><00:24:01.039><c> up</c><00:24:01.919><c> and</c><00:24:02.159><c> you</c><00:24:02.320><c> see</c><00:24:02.559><c> I've</c><00:24:02.799><c> got</c><00:24:03.280><c> a</c> 00:24:03.510 --> 00:24:03.520 align:start position:0% it'll load up and you see I've got a 00:24:03.520 --> 00:24:07.110 align:start position:0% it'll load up and you see I've got a form<00:24:04.080><c> and</c><00:24:04.320><c> a</c><00:24:04.559><c> table</c><00:24:05.760><c> and</c><00:24:06.000><c> an</c><00:24:06.320><c> error.</c><00:24:06.720><c> This</c><00:24:06.880><c> is</c><00:24:06.960><c> a</c> 00:24:07.110 --> 00:24:07.120 align:start position:0% form and a table and an error. This is a 00:24:07.120 --> 00:24:08.390 align:start position:0% form and a table and an error. This is a happy<00:24:07.520><c> error</c><00:24:07.679><c> though.</c><00:24:07.919><c> It's</c><00:24:08.080><c> permission</c> 00:24:08.390 --> 00:24:08.400 align:start position:0% happy error though. It's permission 00:24:08.400 --> 00:24:10.470 align:start position:0% happy error though. It's permission denied.<00:24:08.799><c> So</c><00:24:09.039><c> when</c><00:24:09.200><c> I</c><00:24:09.360><c> created</c><00:24:09.600><c> my</c><00:24:09.840><c> allow</c><00:24:10.159><c> tag</c> 00:24:10.470 --> 00:24:10.480 align:start position:0% denied. So when I created my allow tag 00:24:10.480 --> 00:24:12.630 align:start position:0% denied. So when I created my allow tag model,<00:24:11.279><c> remember</c><00:24:11.679><c> gadget</c><00:24:12.080><c> created</c><00:24:12.240><c> my</c><00:24:12.400><c> credit</c> 00:24:12.630 --> 00:24:12.640 align:start position:0% model, remember gadget created my credit 00:24:12.640 --> 00:24:15.190 align:start position:0% model, remember gadget created my credit API<00:24:13.440><c> but</c><00:24:13.679><c> it</c><00:24:13.919><c> didn't</c><00:24:14.159><c> give</c><00:24:14.320><c> merchants</c><00:24:14.880><c> access</c> 00:24:15.190 --> 00:24:15.200 align:start position:0% API but it didn't give merchants access 00:24:15.200 --> 00:24:17.830 align:start position:0% API but it didn't give merchants access to<00:24:15.440><c> that</c><00:24:15.679><c> API</c><00:24:16.159><c> or</c><00:24:16.400><c> permission.</c><00:24:17.120><c> So</c><00:24:17.279><c> if</c><00:24:17.440><c> I</c><00:24:17.520><c> go</c><00:24:17.679><c> to</c> 00:24:17.830 --> 00:24:17.840 align:start position:0% to that API or permission. So if I go to 00:24:17.840 --> 00:24:20.390 align:start position:0% to that API or permission. So if I go to my<00:24:18.000><c> access</c><00:24:18.320><c> control</c><00:24:18.799><c> permissions,</c><00:24:19.919><c> I</c><00:24:20.159><c> can</c><00:24:20.240><c> go</c> 00:24:20.390 --> 00:24:20.400 align:start position:0% my access control permissions, I can go 00:24:20.400 --> 00:24:23.510 align:start position:0% my access control permissions, I can go ahead<00:24:21.440><c> grant</c><00:24:21.919><c> this</c><00:24:22.159><c> Shopify</c><00:24:22.640><c> app</c><00:24:22.799><c> users</c><00:24:23.200><c> role</c> 00:24:23.510 --> 00:24:23.520 align:start position:0% ahead grant this Shopify app users role 00:24:23.520 --> 00:24:25.669 align:start position:0% ahead grant this Shopify app users role which<00:24:23.760><c> is</c><00:24:23.919><c> merchants</c><00:24:24.400><c> in</c><00:24:24.559><c> the</c><00:24:24.720><c> admin,</c><00:24:25.360><c> I</c><00:24:25.600><c> can</c> 00:24:25.669 --> 00:24:25.679 align:start position:0% which is merchants in the admin, I can 00:24:25.679 --> 00:24:28.149 align:start position:0% which is merchants in the admin, I can grant<00:24:25.840><c> them</c><00:24:26.080><c> access</c><00:24:26.320><c> to</c><00:24:26.559><c> read,</c><00:24:27.279><c> create,</c><00:24:27.840><c> and</c> 00:24:28.149 --> 00:24:28.159 align:start position:0% grant them access to read, create, and 00:24:28.159 --> 00:24:29.510 align:start position:0% grant them access to read, create, and delete.<00:24:28.640><c> And</c><00:24:28.799><c> then</c><00:24:28.960><c> if</c><00:24:29.039><c> I</c><00:24:29.200><c> go</c><00:24:29.279><c> ahead</c><00:24:29.440><c> and</c> 00:24:29.510 --> 00:24:29.520 align:start position:0% delete. And then if I go ahead and 00:24:29.520 --> 00:24:31.830 align:start position:0% delete. And then if I go ahead and refresh<00:24:29.840><c> this,</c><00:24:30.799><c> I</c><00:24:31.039><c> shouldn't</c><00:24:31.279><c> see</c><00:24:31.520><c> that</c> 00:24:31.830 --> 00:24:31.840 align:start position:0% refresh this, I shouldn't see that 00:24:31.840 --> 00:24:33.269 align:start position:0% refresh this, I shouldn't see that error.<00:24:32.000><c> In</c><00:24:32.159><c> fact,</c><00:24:32.320><c> I</c><00:24:32.480><c> should</c><00:24:32.559><c> see</c><00:24:32.720><c> my</c><00:24:32.960><c> sweater</c> 00:24:33.269 --> 00:24:33.279 align:start position:0% error. In fact, I should see my sweater 00:24:33.279 --> 00:24:37.269 align:start position:0% error. In fact, I should see my sweater tag. 00:24:37.269 --> 00:24:37.279 align:start position:0% 00:24:37.279 --> 00:24:39.669 align:start position:0% Very<00:24:37.600><c> nice.</c><00:24:37.919><c> cozies</c><00:24:38.559><c> there</c><00:24:39.120><c> and</c><00:24:39.360><c> I</c><00:24:39.520><c> can</c><00:24:39.600><c> go</c> 00:24:39.669 --> 00:24:39.679 align:start position:0% Very nice. cozies there and I can go 00:24:39.679 --> 00:24:41.750 align:start position:0% Very nice. cozies there and I can go ahead<00:24:39.840><c> and</c><00:24:40.000><c> enter</c><00:24:40.320><c> keywords</c><00:24:40.720><c> now.</c><00:24:41.039><c> And</c><00:24:41.360><c> if</c><00:24:41.600><c> I</c> 00:24:41.750 --> 00:24:41.760 align:start position:0% ahead and enter keywords now. And if I 00:24:41.760 --> 00:24:45.750 align:start position:0% ahead and enter keywords now. And if I go<00:24:41.919><c> back</c><00:24:42.080><c> to</c><00:24:42.240><c> my</c><00:24:42.400><c> front-end</c><00:24:42.799><c> code</c><00:24:43.840><c> quickly,</c> 00:24:45.750 --> 00:24:45.760 align:start position:0% go back to my front-end code quickly, 00:24:45.760 --> 00:24:47.510 align:start position:0% go back to my front-end code quickly, I've<00:24:46.000><c> got</c><00:24:46.159><c> my</c><00:24:46.320><c> auto</c><00:24:46.559><c> form.</c><00:24:47.120><c> When</c><00:24:47.360><c> it's</c> 00:24:47.510 --> 00:24:47.520 align:start position:0% I've got my auto form. When it's 00:24:47.520 --> 00:24:49.029 align:start position:0% I've got my auto form. When it's submitted,<00:24:47.919><c> it's</c><00:24:48.159><c> going</c><00:24:48.240><c> to</c><00:24:48.320><c> call</c><00:24:48.480><c> my</c><00:24:48.799><c> create</c> 00:24:49.029 --> 00:24:49.039 align:start position:0% submitted, it's going to call my create 00:24:49.039 --> 00:24:50.630 align:start position:0% submitted, it's going to call my create action.<00:24:49.520><c> And</c><00:24:49.600><c> then</c><00:24:49.760><c> I'm</c><00:24:49.919><c> just</c><00:24:50.080><c> tossing</c><00:24:50.480><c> a</c> 00:24:50.630 --> 00:24:50.640 align:start position:0% action. And then I'm just tossing a 00:24:50.640 --> 00:24:51.830 align:start position:0% action. And then I'm just tossing a title<00:24:50.799><c> on</c><00:24:51.039><c> there.</c><00:24:51.200><c> So,</c><00:24:51.360><c> this</c><00:24:51.520><c> will</c><00:24:51.679><c> just</c> 00:24:51.830 --> 00:24:51.840 align:start position:0% title on there. So, this will just 00:24:51.840 --> 00:24:54.310 align:start position:0% title on there. So, this will just create<00:24:52.080><c> tags</c><00:24:52.400><c> for</c><00:24:52.559><c> me.</c><00:24:53.360><c> I've</c><00:24:53.600><c> got</c><00:24:53.679><c> my</c><00:24:53.919><c> auto</c> 00:24:54.310 --> 00:24:54.320 align:start position:0% create tags for me. I've got my auto 00:24:54.320 --> 00:24:56.870 align:start position:0% create tags for me. I've got my auto table.<00:24:55.200><c> It's</c><00:24:55.360><c> for</c><00:24:55.600><c> my</c><00:24:55.840><c> allowed</c><00:24:56.240><c> tag</c><00:24:56.559><c> model.</c> 00:24:56.870 --> 00:24:56.880 align:start position:0% table. It's for my allowed tag model. 00:24:56.880 --> 00:24:58.310 align:start position:0% table. It's for my allowed tag model. It's<00:24:57.039><c> automatically</c><00:24:57.600><c> going</c><00:24:57.679><c> to</c><00:24:57.840><c> be</c><00:24:57.919><c> hooked</c><00:24:58.159><c> up</c> 00:24:58.310 --> 00:24:58.320 align:start position:0% It's automatically going to be hooked up 00:24:58.320 --> 00:25:00.549 align:start position:0% It's automatically going to be hooked up to<00:24:58.480><c> my</c><00:24:58.720><c> delete</c><00:24:59.120><c> action.</c><00:25:00.080><c> And</c><00:25:00.240><c> I'm</c><00:25:00.400><c> just</c> 00:25:00.549 --> 00:25:00.559 align:start position:0% to my delete action. And I'm just 00:25:00.559 --> 00:25:03.669 align:start position:0% to my delete action. And I'm just showing<00:25:00.799><c> my</c><00:25:00.960><c> keyword</c><00:25:01.360><c> column.</c> 00:25:03.669 --> 00:25:03.679 align:start position:0% showing my keyword column. 00:25:03.679 --> 00:25:06.470 align:start position:0% showing my keyword column. So,<00:25:03.919><c> if</c><00:25:04.080><c> I</c><00:25:04.320><c> go</c><00:25:04.960><c> sweater</c> 00:25:06.470 --> 00:25:06.480 align:start position:0% So, if I go sweater 00:25:06.480 --> 00:25:09.909 align:start position:0% So, if I go sweater or<00:25:06.880><c> warm,</c><00:25:07.919><c> it's</c><00:25:08.159><c> going</c><00:25:08.240><c> to</c><00:25:08.320><c> go</c><00:25:08.480><c> ahead</c><00:25:09.679><c> add</c> 00:25:09.909 --> 00:25:09.919 align:start position:0% or warm, it's going to go ahead add 00:25:09.919 --> 00:25:11.350 align:start position:0% or warm, it's going to go ahead add these<00:25:10.240><c> keywords.</c><00:25:10.799><c> Let's</c><00:25:11.039><c> get</c><00:25:11.120><c> rid</c><00:25:11.279><c> of</c> 00:25:11.350 --> 00:25:11.360 align:start position:0% these keywords. Let's get rid of 00:25:11.360 --> 00:25:14.470 align:start position:0% these keywords. Let's get rid of sweater.<00:25:12.000><c> See,</c><00:25:12.320><c> delete</c><00:25:12.640><c> works.</c><00:25:13.600><c> Run</c><00:25:13.919><c> that.</c> 00:25:14.470 --> 00:25:14.480 align:start position:0% sweater. See, delete works. Run that. 00:25:14.480 --> 00:25:16.390 align:start position:0% sweater. See, delete works. Run that. Delete<00:25:14.880><c> completed.</c> 00:25:16.390 --> 00:25:16.400 align:start position:0% Delete completed. 00:25:16.400 --> 00:25:18.950 align:start position:0% Delete completed. Very<00:25:16.720><c> cool.</c><00:25:17.520><c> Let's</c><00:25:17.760><c> just</c><00:25:17.919><c> go</c><00:25:18.080><c> check</c><00:25:18.400><c> that</c><00:25:18.640><c> in</c> 00:25:18.950 --> 00:25:18.960 align:start position:0% Very cool. Let's just go check that in 00:25:18.960 --> 00:25:21.990 align:start position:0% Very cool. Let's just go check that in gadget.<00:25:20.240><c> I</c><00:25:20.480><c> see</c><00:25:20.720><c> warm</c><00:25:21.279><c> sweater</c><00:25:21.679><c> has</c><00:25:21.919><c> been</c> 00:25:21.990 --> 00:25:22.000 align:start position:0% gadget. I see warm sweater has been 00:25:22.000 --> 00:25:24.710 align:start position:0% gadget. I see warm sweater has been deleted.<00:25:23.279><c> That's</c><00:25:23.440><c> a</c><00:25:23.600><c> very</c><00:25:23.840><c> speedy</c><00:25:24.240><c> way</c><00:25:24.400><c> for</c><00:25:24.640><c> me</c> 00:25:24.710 --> 00:25:24.720 align:start position:0% deleted. That's a very speedy way for me 00:25:24.720 --> 00:25:26.950 align:start position:0% deleted. That's a very speedy way for me to<00:25:24.880><c> build</c><00:25:25.120><c> my</c><00:25:25.279><c> front</c><00:25:25.440><c> ends.</c> 00:25:26.950 --> 00:25:26.960 align:start position:0% to build my front ends. 00:25:26.960 --> 00:25:28.630 align:start position:0% to build my front ends. So,<00:25:27.120><c> that's</c><00:25:27.279><c> kind</c><00:25:27.520><c> of</c><00:25:27.520><c> my</c><00:25:27.679><c> app.</c><00:25:28.080><c> I'm</c><00:25:28.320><c> ready</c><00:25:28.480><c> to</c> 00:25:28.630 --> 00:25:28.640 align:start position:0% So, that's kind of my app. I'm ready to 00:25:28.640 --> 00:25:32.310 align:start position:0% So, that's kind of my app. I'm ready to like<00:25:28.880><c> test</c><00:25:29.039><c> this</c><00:25:29.279><c> out</c><00:25:29.440><c> now.</c><00:25:29.760><c> So</c><00:25:30.799><c> remember</c><00:25:32.080><c> I</c> 00:25:32.310 --> 00:25:32.320 align:start position:0% like test this out now. So remember I 00:25:32.320 --> 00:25:33.909 align:start position:0% like test this out now. So remember I deleted<00:25:32.720><c> my</c><00:25:32.960><c> product</c><00:25:33.200><c> data.</c><00:25:33.600><c> I'm</c><00:25:33.760><c> going</c><00:25:33.840><c> to</c> 00:25:33.909 --> 00:25:33.919 align:start position:0% deleted my product data. I'm going to 00:25:33.919 --> 00:25:35.590 align:start position:0% deleted my product data. I'm going to run<00:25:34.000><c> a</c><00:25:34.159><c> data</c><00:25:34.480><c> sync</c><00:25:34.720><c> which</c><00:25:34.880><c> will</c><00:25:35.039><c> include</c><00:25:35.360><c> that</c> 00:25:35.590 --> 00:25:35.600 align:start position:0% run a data sync which will include that 00:25:35.600 --> 00:25:38.470 align:start position:0% run a data sync which will include that sweater<00:25:36.080><c> and</c><00:25:36.240><c> I</c><00:25:36.480><c> should</c><00:25:36.799><c> get</c><00:25:37.039><c> a</c><00:25:37.279><c> tag.</c><00:25:37.760><c> So</c><00:25:38.080><c> if</c><00:25:38.320><c> I</c> 00:25:38.470 --> 00:25:38.480 align:start position:0% sweater and I should get a tag. So if I 00:25:38.480 --> 00:25:40.710 align:start position:0% sweater and I should get a tag. So if I go<00:25:38.720><c> to</c><00:25:38.880><c> my</c> 00:25:40.710 --> 00:25:40.720 align:start position:0% go to my 00:25:40.720 --> 00:25:42.470 align:start position:0% go to my installs 00:25:42.470 --> 00:25:42.480 align:start position:0% installs 00:25:42.480 --> 00:25:45.510 align:start position:0% installs see<00:25:42.799><c> this</c><00:25:42.960><c> is</c><00:25:43.120><c> my</c><00:25:43.520><c> development</c><00:25:44.000><c> store</c><00:25:45.120><c> hasn't</c> 00:25:45.510 --> 00:25:45.520 align:start position:0% see this is my development store hasn't 00:25:45.520 --> 00:25:46.950 align:start position:0% see this is my development store hasn't been<00:25:45.679><c> synced</c><00:25:46.000><c> yet.</c><00:25:46.240><c> I'm</c><00:25:46.480><c> going</c><00:25:46.559><c> to</c><00:25:46.640><c> go</c><00:25:46.720><c> ahead</c> 00:25:46.950 --> 00:25:46.960 align:start position:0% been synced yet. I'm going to go ahead 00:25:46.960 --> 00:25:49.269 align:start position:0% been synced yet. I'm going to go ahead and<00:25:47.360><c> run</c><00:25:47.679><c> my</c><00:25:48.080><c> historical</c><00:25:48.559><c> data</c><00:25:48.799><c> sync</c><00:25:49.039><c> to</c><00:25:49.120><c> pull</c> 00:25:49.269 --> 00:25:49.279 align:start position:0% and run my historical data sync to pull 00:25:49.279 --> 00:25:52.950 align:start position:0% and run my historical data sync to pull in<00:25:49.440><c> all</c><00:25:49.600><c> of</c><00:25:49.679><c> my</c><00:25:49.840><c> product</c><00:25:50.080><c> data</c><00:25:50.640><c> into</c><00:25:51.039><c> gadget.</c> 00:25:52.950 --> 00:25:52.960 align:start position:0% in all of my product data into gadget. 00:25:52.960 --> 00:25:54.390 align:start position:0% in all of my product data into gadget. There<00:25:53.120><c> we</c><00:25:53.279><c> go.</c><00:25:53.440><c> It</c><00:25:53.600><c> was</c><00:25:53.679><c> completed.</c><00:25:54.080><c> Is</c><00:25:54.240><c> pretty</c> 00:25:54.390 --> 00:25:54.400 align:start position:0% There we go. It was completed. Is pretty 00:25:54.400 --> 00:25:55.830 align:start position:0% There we go. It was completed. Is pretty speedy.<00:25:54.720><c> I</c><00:25:54.880><c> will</c><00:25:54.960><c> also</c><00:25:55.200><c> note</c><00:25:55.360><c> that</c><00:25:55.520><c> there</c><00:25:55.600><c> is</c><00:25:55.679><c> a</c> 00:25:55.830 --> 00:25:55.840 align:start position:0% speedy. I will also note that there is a 00:25:55.840 --> 00:25:57.590 align:start position:0% speedy. I will also note that there is a sync<00:25:56.080><c> API.</c><00:25:56.559><c> Okay,</c><00:25:56.720><c> so</c><00:25:56.880><c> it's</c><00:25:57.039><c> very</c><00:25:57.200><c> common</c><00:25:57.360><c> when</c> 00:25:57.590 --> 00:25:57.600 align:start position:0% sync API. Okay, so it's very common when 00:25:57.600 --> 00:25:59.029 align:start position:0% sync API. Okay, so it's very common when a<00:25:57.760><c> merchant</c><00:25:58.000><c> installs</c><00:25:58.400><c> your</c><00:25:58.640><c> app.</c><00:25:58.880><c> You're</c> 00:25:59.029 --> 00:25:59.039 align:start position:0% a merchant installs your app. You're 00:25:59.039 --> 00:26:00.870 align:start position:0% a merchant installs your app. You're going to<00:25:59.120><c> want</c><00:25:59.200><c> to</c><00:25:59.360><c> sync</c><00:25:59.679><c> right</c><00:25:59.840><c> away.</c><00:26:00.720><c> So</c> 00:26:00.870 --> 00:26:00.880 align:start position:0% going to want to sync right away. So 00:26:00.880 --> 00:26:02.710 align:start position:0% going to want to sync right away. So you've<00:26:01.120><c> got</c><00:26:01.279><c> your</c><00:26:01.520><c> Shopify</c><00:26:02.000><c> shop</c><00:26:02.240><c> model,</c> 00:26:02.710 --> 00:26:02.720 align:start position:0% you've got your Shopify shop model, 00:26:02.720 --> 00:26:04.950 align:start position:0% you've got your Shopify shop model, there's<00:26:03.039><c> an</c><00:26:03.279><c> install</c><00:26:03.679><c> action.</c><00:26:04.400><c> You</c><00:26:04.640><c> can</c><00:26:04.720><c> just</c> 00:26:04.950 --> 00:26:04.960 align:start position:0% there's an install action. You can just 00:26:04.960 --> 00:26:08.230 align:start position:0% there's an install action. You can just go<00:26:05.120><c> ahead</c><00:26:05.600><c> run</c><00:26:05.760><c> a</c><00:26:06.000><c> sync</c><00:26:06.240><c> right</c><00:26:06.480><c> away.</c> 00:26:08.230 --> 00:26:08.240 align:start position:0% go ahead run a sync right away. 00:26:08.240 --> 00:26:10.549 align:start position:0% go ahead run a sync right away. If<00:26:08.400><c> I</c><00:26:08.559><c> take</c><00:26:08.720><c> a</c><00:26:08.880><c> peek</c><00:26:09.039><c> at</c><00:26:09.120><c> my</c><00:26:09.279><c> product</c><00:26:09.520><c> data,</c> 00:26:10.549 --> 00:26:10.559 align:start position:0% If I take a peek at my product data, 00:26:10.559 --> 00:26:12.549 align:start position:0% If I take a peek at my product data, cool.<00:26:11.200><c> It's</c><00:26:11.440><c> all</c><00:26:11.679><c> here.</c><00:26:12.080><c> That's</c><00:26:12.320><c> looking</c> 00:26:12.549 --> 00:26:12.559 align:start position:0% cool. It's all here. That's looking 00:26:12.559 --> 00:26:14.950 align:start position:0% cool. It's all here. That's looking good.<00:26:12.720><c> I</c><00:26:12.960><c> do</c><00:26:13.120><c> see</c><00:26:13.200><c> a</c><00:26:13.440><c> cozy</c><00:26:13.919><c> tag.</c><00:26:14.480><c> So</c><00:26:14.640><c> it</c><00:26:14.799><c> looks</c> 00:26:14.950 --> 00:26:14.960 align:start position:0% good. I do see a cozy tag. So it looks 00:26:14.960 --> 00:26:17.669 align:start position:0% good. I do see a cozy tag. So it looks like<00:26:15.120><c> my</c><00:26:15.279><c> app</c><00:26:15.520><c> worked.</c><00:26:16.720><c> If</c><00:26:16.960><c> I</c><00:26:17.120><c> go</c><00:26:17.279><c> and</c><00:26:17.520><c> check</c> 00:26:17.669 --> 00:26:17.679 align:start position:0% like my app worked. If I go and check 00:26:17.679 --> 00:26:20.310 align:start position:0% like my app worked. If I go and check out<00:26:17.840><c> my</c><00:26:18.080><c> product</c><00:26:18.240><c> in</c><00:26:18.559><c> Shopify,</c><00:26:19.760><c> click</c><00:26:19.919><c> on</c><00:26:20.159><c> my</c> 00:26:20.310 --> 00:26:20.320 align:start position:0% out my product in Shopify, click on my 00:26:20.320 --> 00:26:21.830 align:start position:0% out my product in Shopify, click on my sweater. 00:26:21.830 --> 00:26:21.840 align:start position:0% sweater. 00:26:21.840 --> 00:26:24.070 align:start position:0% sweater. See,<00:26:22.000><c> it's</c><00:26:22.240><c> now</c><00:26:22.480><c> tagged</c><00:26:22.960><c> with</c><00:26:23.279><c> cozy</c><00:26:23.760><c> because</c> 00:26:24.070 --> 00:26:24.080 align:start position:0% See, it's now tagged with cozy because 00:26:24.080 --> 00:26:25.669 align:start position:0% See, it's now tagged with cozy because that<00:26:24.320><c> is</c><00:26:24.480><c> a</c><00:26:24.640><c> word</c><00:26:24.799><c> in</c><00:26:24.880><c> my</c><00:26:25.039><c> product</c><00:26:25.279><c> description</c> 00:26:25.669 --> 00:26:25.679 align:start position:0% that is a word in my product description 00:26:25.679 --> 00:26:27.590 align:start position:0% that is a word in my product description and<00:26:26.000><c> one</c><00:26:26.080><c> of</c><00:26:26.159><c> my</c><00:26:26.640><c> keywords.</c><00:26:27.200><c> So,</c><00:26:27.360><c> that's</c> 00:26:27.590 --> 00:26:27.600 align:start position:0% and one of my keywords. So, that's 00:26:27.600 --> 00:26:30.310 align:start position:0% and one of my keywords. So, that's great.<00:26:27.840><c> My</c><00:26:28.000><c> app</c><00:26:28.159><c> is</c><00:26:28.400><c> working.</c><00:26:29.760><c> Just</c><00:26:30.000><c> to</c><00:26:30.159><c> kind</c> 00:26:30.310 --> 00:26:30.320 align:start position:0% great. My app is working. Just to kind 00:26:30.320 --> 00:26:31.909 align:start position:0% great. My app is working. Just to kind of<00:26:30.400><c> complete</c><00:26:30.640><c> the</c><00:26:30.799><c> loop</c><00:26:31.039><c> here,</c><00:26:31.279><c> if</c><00:26:31.440><c> I</c><00:26:31.520><c> check</c><00:26:31.679><c> my</c> 00:26:31.909 --> 00:26:31.919 align:start position:0% of complete the loop here, if I check my 00:26:31.919 --> 00:26:33.669 align:start position:0% of complete the loop here, if I check my logs,<00:26:32.559><c> remember</c><00:26:32.799><c> we</c><00:26:33.039><c> have</c><00:26:33.120><c> those</c><00:26:33.279><c> logger</c> 00:26:33.669 --> 00:26:33.679 align:start position:0% logs, remember we have those logger 00:26:33.679 --> 00:26:36.230 align:start position:0% logs, remember we have those logger statements.<00:26:34.720><c> We</c><00:26:34.960><c> can</c><00:26:35.039><c> go</c><00:26:35.200><c> ahead</c><00:26:35.360><c> and</c><00:26:35.600><c> see</c> 00:26:36.230 --> 00:26:36.240 align:start position:0% statements. We can go ahead and see 00:26:36.240 --> 00:26:37.990 align:start position:0% statements. We can go ahead and see we've<00:26:36.480><c> got</c><00:26:36.640><c> a</c><00:26:36.799><c> bunch</c><00:26:36.960><c> of</c><00:26:37.120><c> empty</c><00:26:37.440><c> keywords</c><00:26:37.840><c> to</c> 00:26:37.990 --> 00:26:38.000 align:start position:0% we've got a bunch of empty keywords to 00:26:38.000 --> 00:26:39.269 align:start position:0% we've got a bunch of empty keywords to apply.<00:26:38.320><c> These</c><00:26:38.480><c> are</c><00:26:38.559><c> all</c><00:26:38.640><c> my</c><00:26:38.799><c> written</c><00:26:39.039><c> log</c> 00:26:39.269 --> 00:26:39.279 align:start position:0% apply. These are all my written log 00:26:39.279 --> 00:26:40.390 align:start position:0% apply. These are all my written log statements.<00:26:39.520><c> I</c><00:26:39.679><c> can</c><00:26:39.760><c> actually</c><00:26:39.919><c> just</c><00:26:40.080><c> filter</c> 00:26:40.390 --> 00:26:40.400 align:start position:0% statements. I can actually just filter 00:26:40.400 --> 00:26:43.430 align:start position:0% statements. I can actually just filter by<00:26:40.559><c> my</c><00:26:40.799><c> events.</c><00:26:41.679><c> But</c><00:26:42.080><c> I</c><00:26:42.400><c> do</c><00:26:42.640><c> have</c><00:26:42.960><c> one</c><00:26:43.200><c> with</c> 00:26:43.430 --> 00:26:43.440 align:start position:0% by my events. But I do have one with 00:26:43.440 --> 00:26:45.430 align:start position:0% by my events. But I do have one with cozy<00:26:43.840><c> and</c><00:26:44.080><c> then</c><00:26:44.159><c> I'm</c><00:26:44.480><c> applying</c><00:26:44.799><c> that</c><00:26:45.120><c> final</c> 00:26:45.430 --> 00:26:45.440 align:start position:0% cozy and then I'm applying that final 00:26:45.440 --> 00:26:48.070 align:start position:0% cozy and then I'm applying that final tag<00:26:46.080><c> to</c><00:26:46.400><c> this</c><00:26:46.640><c> product.</c><00:26:47.360><c> So,</c><00:26:47.520><c> that's</c><00:26:47.760><c> great.</c><00:26:47.919><c> I</c> 00:26:48.070 --> 00:26:48.080 align:start position:0% tag to this product. So, that's great. I 00:26:48.080 --> 00:26:49.909 align:start position:0% tag to this product. So, that's great. I know<00:26:48.240><c> my</c><00:26:48.400><c> app</c><00:26:48.640><c> is</c><00:26:48.799><c> working.</c><00:26:49.200><c> I'm</c><00:26:49.520><c> ready</c><00:26:49.679><c> to</c> 00:26:49.909 --> 00:26:49.919 align:start position:0% know my app is working. I'm ready to 00:26:49.919 --> 00:26:52.630 align:start position:0% know my app is working. I'm ready to deploy<00:26:50.400><c> to</c><00:26:50.880><c> production.</c><00:26:52.000><c> This</c><00:26:52.159><c> is</c><00:26:52.320><c> the</c><00:26:52.480><c> last</c> 00:26:52.630 --> 00:26:52.640 align:start position:0% deploy to production. This is the last 00:26:52.640 --> 00:26:55.909 align:start position:0% deploy to production. This is the last step.<00:26:52.960><c> And</c><00:26:53.120><c> remember,</c><00:26:54.000><c> I</c><00:26:54.320><c> already</c><00:26:54.640><c> set</c><00:26:54.880><c> up</c><00:26:55.520><c> my</c> 00:26:55.909 --> 00:26:55.919 align:start position:0% step. And remember, I already set up my 00:26:55.919 --> 00:26:58.149 align:start position:0% step. And remember, I already set up my production<00:26:56.240><c> app</c><00:26:56.480><c> in</c><00:26:56.640><c> my</c><00:26:56.799><c> dev</c><00:26:57.120><c> dashboard.</c><00:26:58.000><c> In</c> 00:26:58.149 --> 00:26:58.159 align:start position:0% production app in my dev dashboard. In 00:26:58.159 --> 00:27:00.149 align:start position:0% production app in my dev dashboard. In fact,<00:26:58.960><c> something</c><00:26:59.200><c> I</c><00:26:59.440><c> haven't</c><00:26:59.600><c> clicked</c><00:26:59.840><c> on</c><00:27:00.000><c> yet</c> 00:27:00.149 --> 00:27:00.159 align:start position:0% fact, something I haven't clicked on yet 00:27:00.159 --> 00:27:01.669 align:start position:0% fact, something I haven't clicked on yet is<00:27:00.400><c> our</c><00:27:00.559><c> environment.</c><00:27:01.120><c> So,</c><00:27:01.279><c> right</c><00:27:01.440><c> now,</c><00:27:01.520><c> I'm</c> 00:27:01.669 --> 00:27:01.679 align:start position:0% is our environment. So, right now, I'm 00:27:01.679 --> 00:27:03.269 align:start position:0% is our environment. So, right now, I'm working<00:27:01.840><c> in</c><00:27:02.000><c> my</c><00:27:02.159><c> development</c><00:27:02.480><c> environment.</c> 00:27:03.269 --> 00:27:03.279 align:start position:0% working in my development environment. 00:27:03.279 --> 00:27:04.630 align:start position:0% working in my development environment. You<00:27:03.440><c> can</c><00:27:03.520><c> create</c><00:27:03.760><c> as</c><00:27:04.000><c> many</c><00:27:04.240><c> development</c> 00:27:04.630 --> 00:27:04.640 align:start position:0% You can create as many development 00:27:04.640 --> 00:27:06.390 align:start position:0% You can create as many development environments<00:27:05.120><c> as</c><00:27:05.360><c> you</c><00:27:05.520><c> want.</c><00:27:05.760><c> It's</c><00:27:06.000><c> useful</c><00:27:06.159><c> if</c> 00:27:06.390 --> 00:27:06.400 align:start position:0% environments as you want. It's useful if 00:27:06.400 --> 00:27:07.830 align:start position:0% environments as you want. It's useful if you're<00:27:06.480><c> working</c><00:27:06.640><c> on</c><00:27:06.799><c> a</c><00:27:06.960><c> team</c><00:27:07.120><c> for</c><00:27:07.440><c> every</c><00:27:07.600><c> team</c> 00:27:07.830 --> 00:27:07.840 align:start position:0% you're working on a team for every team 00:27:07.840 --> 00:27:09.110 align:start position:0% you're working on a team for every team member<00:27:08.080><c> to</c><00:27:08.240><c> have</c><00:27:08.400><c> their</c><00:27:08.559><c> own</c><00:27:08.720><c> development</c> 00:27:09.110 --> 00:27:09.120 align:start position:0% member to have their own development 00:27:09.120 --> 00:27:10.950 align:start position:0% member to have their own development environment,<00:27:09.679><c> which</c><00:27:10.000><c> also</c><00:27:10.400><c> requires</c><00:27:10.799><c> your</c> 00:27:10.950 --> 00:27:10.960 align:start position:0% environment, which also requires your 00:27:10.960 --> 00:27:13.190 align:start position:0% environment, which also requires your own<00:27:11.120><c> Shopify</c><00:27:11.600><c> app.</c><00:27:12.159><c> Our</c><00:27:12.480><c> docs</c><00:27:12.880><c> have</c><00:27:13.039><c> more</c> 00:27:13.190 --> 00:27:13.200 align:start position:0% own Shopify app. Our docs have more 00:27:13.200 --> 00:27:15.750 align:start position:0% own Shopify app. Our docs have more details<00:27:13.520><c> on</c><00:27:13.760><c> that,</c><00:27:14.000><c> though.</c><00:27:14.880><c> I</c><00:27:15.120><c> also</c><00:27:15.360><c> have</c><00:27:15.520><c> a</c> 00:27:15.750 --> 00:27:15.760 align:start position:0% details on that, though. I also have a 00:27:15.760 --> 00:27:18.470 align:start position:0% details on that, though. I also have a production<00:27:16.400><c> environment.</c><00:27:17.520><c> So</c><00:27:17.679><c> I</c><00:27:17.919><c> can</c><00:27:18.000><c> see</c><00:27:18.240><c> I</c> 00:27:18.470 --> 00:27:18.480 align:start position:0% production environment. So I can see I 00:27:18.480 --> 00:27:20.149 align:start position:0% production environment. So I can see I need<00:27:18.640><c> to</c><00:27:18.720><c> go</c><00:27:18.799><c> ahead</c><00:27:18.960><c> and</c><00:27:19.120><c> deploy</c><00:27:19.679><c> to</c><00:27:20.000><c> get</c> 00:27:20.149 --> 00:27:20.159 align:start position:0% need to go ahead and deploy to get 00:27:20.159 --> 00:27:23.350 align:start position:0% need to go ahead and deploy to get started.<00:27:20.880><c> So</c><00:27:22.320><c> let's</c><00:27:22.559><c> go</c><00:27:22.640><c> ahead</c><00:27:22.799><c> and</c><00:27:22.960><c> do</c><00:27:23.039><c> that.</c> 00:27:23.350 --> 00:27:23.360 align:start position:0% started. So let's go ahead and do that. 00:27:23.360 --> 00:27:26.070 align:start position:0% started. So let's go ahead and do that. Let's<00:27:23.600><c> click</c><00:27:23.919><c> deploy.</c> 00:27:26.070 --> 00:27:26.080 align:start position:0% Let's click deploy. 00:27:26.080 --> 00:27:29.350 align:start position:0% Let's click deploy. Can<00:27:26.320><c> deploy</c><00:27:26.960><c> my</c><00:27:27.279><c> changes</c><00:27:28.000><c> to</c><00:27:28.320><c> production.</c> 00:27:29.350 --> 00:27:29.360 align:start position:0% Can deploy my changes to production. 00:27:29.360 --> 00:27:31.190 align:start position:0% Can deploy my changes to production. This<00:27:29.520><c> is</c><00:27:29.679><c> going</c><00:27:29.760><c> to</c><00:27:29.919><c> go</c><00:27:30.000><c> ahead.</c><00:27:30.720><c> It's</c><00:27:30.960><c> going</c><00:27:31.039><c> to</c> 00:27:31.190 --> 00:27:31.200 align:start position:0% This is going to go ahead. It's going to 00:27:31.200 --> 00:27:32.710 align:start position:0% This is going to go ahead. It's going to run<00:27:31.360><c> all</c><00:27:31.600><c> the</c><00:27:31.760><c> necessary</c><00:27:32.240><c> database</c> 00:27:32.710 --> 00:27:32.720 align:start position:0% run all the necessary database 00:27:32.720 --> 00:27:34.789 align:start position:0% run all the necessary database migrations.<00:27:33.520><c> It's</c><00:27:33.679><c> going</c><00:27:33.760><c> to</c><00:27:33.919><c> minify</c><00:27:34.480><c> my</c> 00:27:34.789 --> 00:27:34.799 align:start position:0% migrations. It's going to minify my 00:27:34.799 --> 00:27:36.870 align:start position:0% migrations. It's going to minify my front<00:27:35.120><c> end,</c><00:27:35.679><c> update</c><00:27:36.080><c> my</c><00:27:36.240><c> actions,</c><00:27:36.640><c> and</c> 00:27:36.870 --> 00:27:36.880 align:start position:0% front end, update my actions, and 00:27:36.880 --> 00:27:39.990 align:start position:0% front end, update my actions, and restart<00:27:37.200><c> my</c><00:27:37.440><c> app</c><00:27:37.679><c> for</c><00:27:37.840><c> me.</c><00:27:39.039><c> And</c><00:27:39.200><c> once</c><00:27:39.520><c> that</c><00:27:39.760><c> is</c> 00:27:39.990 --> 00:27:40.000 align:start position:0% restart my app for me. And once that is 00:27:40.000 --> 00:27:43.269 align:start position:0% restart my app for me. And once that is finished, 00:27:43.269 --> 00:27:43.279 align:start position:0% 00:27:43.279 --> 00:27:44.789 align:start position:0% I'll<00:27:43.520><c> have</c><00:27:43.679><c> a</c><00:27:43.840><c> production</c><00:27:44.240><c> app</c><00:27:44.400><c> that's</c><00:27:44.720><c> ready</c> 00:27:44.789 --> 00:27:44.799 align:start position:0% I'll have a production app that's ready 00:27:44.799 --> 00:27:46.470 align:start position:0% I'll have a production app that's ready to<00:27:44.960><c> be</c><00:27:45.039><c> installed</c><00:27:45.360><c> on</c><00:27:45.520><c> a</c><00:27:45.679><c> store.</c><00:27:46.159><c> You'll</c> 00:27:46.470 --> 00:27:46.480 align:start position:0% to be installed on a store. You'll 00:27:46.480 --> 00:27:47.750 align:start position:0% to be installed on a store. You'll notice<00:27:46.640><c> if</c><00:27:46.799><c> I</c><00:27:46.880><c> do</c><00:27:47.039><c> go</c><00:27:47.120><c> to</c><00:27:47.279><c> my</c><00:27:47.440><c> production</c> 00:27:47.750 --> 00:27:47.760 align:start position:0% notice if I do go to my production 00:27:47.760 --> 00:27:49.590 align:start position:0% notice if I do go to my production environment<00:27:48.240><c> settings,</c><00:27:48.880><c> if</c><00:27:49.039><c> I</c><00:27:49.200><c> just</c><00:27:49.360><c> go</c><00:27:49.440><c> to</c> 00:27:49.590 --> 00:27:49.600 align:start position:0% environment settings, if I just go to 00:27:49.600 --> 00:27:52.390 align:start position:0% environment settings, if I just go to plugins,<00:27:50.559><c> Shopify,</c><00:27:51.520><c> it</c><00:27:51.760><c> is</c><00:27:52.000><c> already</c> 00:27:52.390 --> 00:27:52.400 align:start position:0% plugins, Shopify, it is already 00:27:52.400 --> 00:27:54.710 align:start position:0% plugins, Shopify, it is already connected<00:27:53.039><c> to</c><00:27:53.440><c> that</c><00:27:53.760><c> production</c><00:27:54.159><c> app</c><00:27:54.399><c> in</c><00:27:54.559><c> my</c> 00:27:54.710 --> 00:27:54.720 align:start position:0% connected to that production app in my 00:27:54.720 --> 00:27:56.630 align:start position:0% connected to that production app in my dev<00:27:54.960><c> dashboard.</c><00:27:55.520><c> So,</c><00:27:55.600><c> I</c><00:27:55.840><c> just</c><00:27:55.919><c> want</c><00:27:56.080><c> to</c> 00:27:56.630 --> 00:27:56.640 align:start position:0% dev dashboard. So, I just want to 00:27:56.640 --> 00:27:59.669 align:start position:0% dev dashboard. So, I just want to highlight<00:27:57.039><c> that</c><00:27:57.360><c> quickly.</c><00:27:58.799><c> So,</c><00:27:59.039><c> here</c><00:27:59.200><c> we</c><00:27:59.360><c> go.</c> 00:27:59.669 --> 00:27:59.679 align:start position:0% highlight that quickly. So, here we go. 00:27:59.679 --> 00:28:01.590 align:start position:0% highlight that quickly. So, here we go. It<00:27:59.840><c> is</c><00:28:00.080><c> deploying.</c><00:28:00.640><c> We'll</c><00:28:00.880><c> just</c><00:28:01.120><c> let</c><00:28:01.279><c> it</c><00:28:01.520><c> do</c> 00:28:01.590 --> 00:28:01.600 align:start position:0% It is deploying. We'll just let it do 00:28:01.600 --> 00:28:03.430 align:start position:0% It is deploying. We'll just let it do its<00:28:01.919><c> thing.</c> 00:28:03.430 --> 00:28:03.440 align:start position:0% its thing. 00:28:03.440 --> 00:28:05.590 align:start position:0% its thing. Once<00:28:03.760><c> this</c><00:28:04.000><c> is</c><00:28:04.159><c> finished,</c><00:28:04.640><c> I</c><00:28:04.960><c> will</c><00:28:05.200><c> have</c><00:28:05.360><c> an</c> 00:28:05.590 --> 00:28:05.600 align:start position:0% Once this is finished, I will have an 00:28:05.600 --> 00:28:07.669 align:start position:0% Once this is finished, I will have an app<00:28:05.840><c> that</c><00:28:06.080><c> I</c><00:28:06.320><c> can</c><00:28:06.559><c> actually</c><00:28:06.880><c> I</c><00:28:07.120><c> can</c><00:28:07.200><c> install</c><00:28:07.520><c> on</c> 00:28:07.669 --> 00:28:07.679 align:start position:0% app that I can actually I can install on 00:28:07.679 --> 00:28:09.750 align:start position:0% app that I can actually I can install on a<00:28:07.840><c> store</c><00:28:08.000><c> if</c><00:28:08.159><c> I</c><00:28:08.320><c> want.</c><00:28:08.640><c> Now,</c><00:28:08.960><c> Shopify</c><00:28:09.520><c> app</c> 00:28:09.750 --> 00:28:09.760 align:start position:0% a store if I want. Now, Shopify app 00:28:09.760 --> 00:28:11.510 align:start position:0% a store if I want. Now, Shopify app deploy<00:28:10.080><c> the</c><00:28:10.240><c> command</c><00:28:10.480><c> it's</c><00:28:10.799><c> running.</c><00:28:11.279><c> This</c> 00:28:11.510 --> 00:28:11.520 align:start position:0% deploy the command it's running. This 00:28:11.520 --> 00:28:13.350 align:start position:0% deploy the command it's running. This will<00:28:11.679><c> help</c><00:28:11.919><c> if</c><00:28:12.159><c> you</c><00:28:12.240><c> do</c><00:28:12.480><c> have</c><00:28:12.559><c> any</c><00:28:12.720><c> Shopify</c> 00:28:13.350 --> 00:28:13.360 align:start position:0% will help if you do have any Shopify 00:28:13.360 --> 00:28:15.350 align:start position:0% will help if you do have any Shopify extension.<00:28:13.919><c> My</c><00:28:14.159><c> app</c><00:28:14.399><c> doesn't,</c><00:28:14.799><c> but</c><00:28:15.039><c> it</c><00:28:15.200><c> will</c> 00:28:15.350 --> 00:28:15.360 align:start position:0% extension. My app doesn't, but it will 00:28:15.360 --> 00:28:17.269 align:start position:0% extension. My app doesn't, but it will deploy<00:28:15.679><c> your</c><00:28:15.919><c> extensions</c><00:28:16.399><c> automatically</c><00:28:17.039><c> as</c> 00:28:17.269 --> 00:28:17.279 align:start position:0% deploy your extensions automatically as 00:28:17.279 --> 00:28:19.510 align:start position:0% deploy your extensions automatically as well.<00:28:18.080><c> My</c><00:28:18.240><c> app</c><00:28:18.399><c> is</c><00:28:18.559><c> being</c><00:28:18.720><c> restarted.</c><00:28:19.279><c> That's</c> 00:28:19.510 --> 00:28:19.520 align:start position:0% well. My app is being restarted. That's 00:28:19.520 --> 00:28:22.470 align:start position:0% well. My app is being restarted. That's good.<00:28:19.919><c> If</c><00:28:20.080><c> I</c><00:28:20.240><c> go</c><00:28:20.399><c> to</c><00:28:20.559><c> production,</c><00:28:21.919><c> go</c><00:28:22.080><c> to</c><00:28:22.240><c> my</c> 00:28:22.470 --> 00:28:22.480 align:start position:0% good. If I go to production, go to my 00:28:22.480 --> 00:28:24.950 align:start position:0% good. If I go to production, go to my files<00:28:22.799><c> now.</c><00:28:23.520><c> So,</c><00:28:23.679><c> you</c><00:28:23.840><c> see</c><00:28:24.080><c> I</c><00:28:24.320><c> do</c><00:28:24.480><c> have</c><00:28:24.640><c> all</c><00:28:24.880><c> of</c> 00:28:24.950 --> 00:28:24.960 align:start position:0% files now. So, you see I do have all of 00:28:24.960 --> 00:28:26.549 align:start position:0% files now. So, you see I do have all of my<00:28:25.200><c> models</c><00:28:25.520><c> here.</c><00:28:25.840><c> I</c><00:28:26.000><c> can</c><00:28:26.159><c> look</c><00:28:26.240><c> at</c><00:28:26.399><c> my</c> 00:28:26.549 --> 00:28:26.559 align:start position:0% my models here. I can look at my 00:28:26.559 --> 00:28:28.789 align:start position:0% my models here. I can look at my production<00:28:26.880><c> data.</c><00:28:27.279><c> I</c><00:28:27.520><c> can't</c><00:28:27.679><c> edit.</c><00:28:28.640><c> You</c> 00:28:28.789 --> 00:28:28.799 align:start position:0% production data. I can't edit. You 00:28:28.799 --> 00:28:31.830 align:start position:0% production data. I can't edit. You notice<00:28:29.120><c> it's</c><00:28:29.679><c> disabled.</c><00:28:30.320><c> I</c><00:28:30.559><c> can't</c><00:28:31.039><c> edit</c><00:28:31.600><c> any</c> 00:28:31.830 --> 00:28:31.840 align:start position:0% notice it's disabled. I can't edit any 00:28:31.840 --> 00:28:33.909 align:start position:0% notice it's disabled. I can't edit any of<00:28:32.000><c> my</c><00:28:32.320><c> production</c><00:28:32.720><c> models</c><00:28:33.120><c> or</c><00:28:33.279><c> code.</c><00:28:33.600><c> This</c><00:28:33.760><c> is</c> 00:28:33.909 --> 00:28:33.919 align:start position:0% of my production models or code. This is 00:28:33.919 --> 00:28:36.870 align:start position:0% of my production models or code. This is just<00:28:34.399><c> read</c><00:28:34.799><c> only</c><00:28:35.039><c> right</c><00:28:35.279><c> now.</c> 00:28:36.870 --> 00:28:36.880 align:start position:0% just read only right now. 00:28:36.880 --> 00:28:39.190 align:start position:0% just read only right now. But<00:28:37.039><c> it</c><00:28:37.200><c> does</c><00:28:37.360><c> allow</c><00:28:37.600><c> me</c><00:28:37.760><c> to</c><00:28:37.919><c> see</c><00:28:38.159><c> what</c><00:28:38.480><c> is</c><00:28:38.799><c> in</c> 00:28:39.190 --> 00:28:39.200 align:start position:0% But it does allow me to see what is in 00:28:39.200 --> 00:28:42.470 align:start position:0% But it does allow me to see what is in production<00:28:39.840><c> currently.</c> 00:28:42.470 --> 00:28:42.480 align:start position:0% production currently. 00:28:42.480 --> 00:28:45.029 align:start position:0% production currently. Now,<00:28:42.799><c> if</c><00:28:43.039><c> I</c><00:28:43.200><c> wanted</c><00:28:43.440><c> to</c><00:28:43.600><c> go</c><00:28:43.760><c> ahead</c><00:28:44.159><c> and</c><00:28:44.640><c> install</c> 00:28:45.029 --> 00:28:45.039 align:start position:0% Now, if I wanted to go ahead and install 00:28:45.039 --> 00:28:47.269 align:start position:0% Now, if I wanted to go ahead and install my<00:28:45.279><c> app</c><00:28:45.600><c> on</c><00:28:45.760><c> a</c><00:28:46.000><c> store,</c><00:28:46.320><c> I</c><00:28:46.480><c> could</c><00:28:46.640><c> go</c><00:28:46.720><c> to</c><00:28:46.880><c> my</c><00:28:46.960><c> dev</c> 00:28:47.269 --> 00:28:47.279 align:start position:0% my app on a store, I could go to my dev 00:28:47.279 --> 00:28:49.669 align:start position:0% my app on a store, I could go to my dev dashboard,<00:28:48.399><c> go</c><00:28:48.720><c> through</c><00:28:49.039><c> selecting</c><00:28:49.440><c> the</c> 00:28:49.669 --> 00:28:49.679 align:start position:0% dashboard, go through selecting the 00:28:49.679 --> 00:28:51.590 align:start position:0% dashboard, go through selecting the custom<00:28:50.080><c> distribution,</c><00:28:50.720><c> and</c><00:28:50.960><c> install</c><00:28:51.200><c> on</c><00:28:51.440><c> a</c> 00:28:51.590 --> 00:28:51.600 align:start position:0% custom distribution, and install on a 00:28:51.600 --> 00:28:55.029 align:start position:0% custom distribution, and install on a store,<00:28:52.000><c> and</c><00:28:52.320><c> I</c><00:28:52.559><c> am</c><00:28:52.960><c> all</c><00:28:53.679><c> good.</c><00:28:54.480><c> So,</c><00:28:54.640><c> that</c><00:28:54.799><c> was</c><00:28:54.880><c> a</c> 00:28:55.029 --> 00:28:55.039 align:start position:0% store, and I am all good. So, that was a 00:28:55.039 --> 00:28:56.389 align:start position:0% store, and I am all good. So, that was a quick<00:28:55.279><c> run</c><00:28:55.440><c> through</c><00:28:55.600><c> of</c><00:28:55.760><c> building</c><00:28:56.000><c> a</c><00:28:56.159><c> full</c> 00:28:56.389 --> 00:28:56.399 align:start position:0% quick run through of building a full 00:28:56.399 --> 00:28:59.190 align:start position:0% quick run through of building a full stack<00:28:56.720><c> Shopify</c><00:28:57.279><c> app</c><00:28:57.520><c> on</c><00:28:58.000><c> Gadget.</c><00:28:58.960><c> You'll</c> 00:28:59.190 --> 00:28:59.200 align:start position:0% stack Shopify app on Gadget. You'll 00:28:59.200 --> 00:29:00.470 align:start position:0% stack Shopify app on Gadget. You'll notice<00:28:59.520><c> we</c><00:28:59.679><c> didn't</c><00:28:59.840><c> have</c><00:28:59.919><c> to</c><00:29:00.080><c> do</c><00:29:00.240><c> any</c> 00:29:00.470 --> 00:29:00.480 align:start position:0% notice we didn't have to do any 00:29:00.480 --> 00:29:02.870 align:start position:0% notice we didn't have to do any infrastructure<00:29:01.120><c> work</c><00:29:01.360><c> when</c><00:29:01.600><c> we</c><00:29:01.760><c> deployed</c><00:29:02.240><c> to</c> 00:29:02.870 --> 00:29:02.880 align:start position:0% infrastructure work when we deployed to 00:29:02.880 --> 00:29:04.789 align:start position:0% infrastructure work when we deployed to production<00:29:03.760><c> or</c><00:29:04.000><c> set</c><00:29:04.159><c> up</c><00:29:04.320><c> our</c><00:29:04.480><c> development</c> 00:29:04.789 --> 00:29:04.799 align:start position:0% production or set up our development 00:29:04.799 --> 00:29:06.470 align:start position:0% production or set up our development environment.<00:29:05.279><c> Everything</c><00:29:05.600><c> is</c><00:29:05.840><c> automatically</c> 00:29:06.470 --> 00:29:06.480 align:start position:0% environment. Everything is automatically 00:29:06.480 --> 00:29:08.710 align:start position:0% environment. Everything is automatically stitched<00:29:06.880><c> together</c><00:29:07.520><c> and</c><00:29:07.919><c> powered</c><00:29:08.399><c> by</c> 00:29:08.710 --> 00:29:08.720 align:start position:0% stitched together and powered by 00:29:08.720 --> 00:29:10.630 align:start position:0% stitched together and powered by autogenerated<00:29:09.520><c> APIs,</c><00:29:10.080><c> including</c><00:29:10.399><c> that</c> 00:29:10.630 --> 00:29:10.640 align:start position:0% autogenerated APIs, including that 00:29:10.640 --> 00:29:12.789 align:start position:0% autogenerated APIs, including that background<00:29:11.200><c> job</c><00:29:11.520><c> system,</c><00:29:11.919><c> which</c><00:29:12.159><c> is</c><00:29:12.399><c> really</c> 00:29:12.789 --> 00:29:12.799 align:start position:0% background job system, which is really 00:29:12.799 --> 00:29:15.269 align:start position:0% background job system, which is really handy.<00:29:13.360><c> Makes</c><00:29:13.679><c> development</c><00:29:14.159><c> much</c><00:29:14.399><c> quicker.</c> 00:29:15.269 --> 00:29:15.279 align:start position:0% handy. Makes development much quicker. 00:29:15.279 --> 00:29:17.510 align:start position:0% handy. Makes development much quicker. If<00:29:15.520><c> you</c><00:29:15.679><c> have</c><00:29:15.840><c> any</c><00:29:16.159><c> questions</c><00:29:16.720><c> about</c><00:29:17.120><c> building</c> 00:29:17.510 --> 00:29:17.520 align:start position:0% If you have any questions about building 00:29:17.520 --> 00:29:19.350 align:start position:0% If you have any questions about building on<00:29:17.679><c> gadget,</c><00:29:18.240><c> there's</c><00:29:18.480><c> a</c><00:29:18.640><c> lot</c><00:29:18.799><c> more</c><00:29:19.039><c> to</c><00:29:19.200><c> go</c> 00:29:19.350 --> 00:29:19.360 align:start position:0% on gadget, there's a lot more to go 00:29:19.360 --> 00:29:21.909 align:start position:0% on gadget, there's a lot more to go through.<00:29:19.840><c> Check</c><00:29:20.080><c> out</c><00:29:20.240><c> our</c><00:29:20.399><c> documentation</c><00:29:21.520><c> or</c> 00:29:21.909 --> 00:29:21.919 align:start position:0% through. Check out our documentation or 00:29:21.919 --> 00:29:25.269 align:start position:0% through. Check out our documentation or ask<00:29:22.159><c> us</c><00:29:22.399><c> in</c><00:29:22.640><c> our</c><00:29:23.039><c> developer</c><00:29:23.760><c> Discord.</c><00:29:24.960><c> Until</c> 00:29:25.269 --> 00:29:25.279 align:start position:0% ask us in our developer Discord. Until 00:29:25.279 --> 00:29:27.110 align:start position:0% ask us in our developer Discord. Until next<00:29:25.520><c> time,</c><00:29:26.000><c> I</c><00:29:26.240><c> hope</c><00:29:26.320><c> you</c><00:29:26.480><c> keep</c><00:29:26.640><c> building</c><00:29:26.880><c> more</c> 00:29:27.110 --> 00:29:27.120 align:start position:0% next time, I hope you keep building more 00:29:27.120 --> 00:29:31.000 align:start position:0% next time, I hope you keep building more and<00:29:27.200><c> coding</c><00:29:27.520><c> less</c><00:29:27.840><c> with</c><00:29:28.000><c> Gadget.</c>