Coding with Jan - Shopify Developer
내용
[subtitle-meta] lang=en auto=True
all right guys so today fastest way to
build a shopify app from scratch
which at this point might also be the
best way to start your own
system as a service business or a sas
business because
it's actually way easier to build a
profitable shopify app
than would be to let's say create the
next profitable android
or ios app and that's mainly because
your main target audience
is purely merchants who have money to
invest in their business
and if your app solves a problem for
them you can justify a higher price
point
now before we get there i absolutely
need to understand
what you're getting into here because
app development
is quite advanced and it's not even
remotely as beginner friendly as
freelancing for example
and that's why i put together this
extremely important comparison
just to give you a better overview and
some more realistic expectations
so here we are in the powerpoint of
truth and justice where we have apps
versus freelancing and we're going to
start with freelancing because there's a
little less to cover
and if you want to get into that you
would need to learn html css and
javascript
which is basically the web development
stack and then you would also need to
learn
shopify liquid as shopify's back-end
templating language
and on top of that you would also need
to learn all the ins and outs
of shopify as a platform so that is to
say
configuring all the settings like taxes
shipping creating stores from scratch
setting up good looking or professional
looking front ends
knowing about the best themes you can
use knowing about different apps for
different use cases
or delivering services like store speed
optimization
migrations code customizations and theme
customizations
so then you would need to learn about
theme files shopify sections all these
kinds of things
but once you become good at all of these
you're pretty much ready
to hit the market and from there you
would need to learn how to find clients
how to talk to them how to position
yourself
how to send a good proposal how to price
your services
which can be a bit tricky or
overwhelming especially in the beginning
but i believe if you commit to learning
all of these
that's one of the fastest ways how you
can get to a sustainable income online
okay now how does this compare to apps
on this side the first thing you would
need
is a good idea or to be more precise you
need to solve an
in-demand problem because otherwise your
app won't be in demand
and you also don't want to be guessing
what the market wants
uh you need some sort of data or
reference on this
and there are actually different ways to
accumulate that but honestly one of the
easiest ways
would be that you have worked with real
world clients before
because then you see or you get to
experience first hand
what merchants struggle with and if you
notice the same issue across multiple
clients
then it's very likely that there's like
a bigger audience or a bigger pool of
people
having the same issue and that would be
the easiest market
to tap into okay now given that you have
a good idea
then follows the technical
implementation and
you would need to learn html css and
javascript as well
although i would say you need to learn
javascript in much greater detail but it
depends a bit on the type of application
you build
and then you would also need to learn
about shopify as a platform
not as much in detail as with
freelancing but you want to learn about
theme files different features and the
different apis
and then you would also need to learn
one back-end technology or back-end
language
and this could either be nodejs or ruby
on rails
basically it could be any back-end
technology could also be php or
something
but these two are the most popular in
the shopify space
so i would recommend picking one of
these and then you might also want to
learn
a front-end framework like react because
that helps to build the interface of
your app
and then you also need graphql in order
to make api calls
so then you can communicate with the
shopify system
and update or fetch data and speaking of
data
your app also might need a database if
you need to store customer data for
example
but then you also want to get into the
basics of security
because you don't want to publicly
expose that data or
leak customer data and then lastly you
would need to figure out your own
hosting
because your app has to run on a
dedicated server
so all of this is pretty much the
technical implementation
and from there you can hit the market so
then your main tasks become
marketing you want to get your app in
front of as many people as you can
you need to do customer support as soon
as you get the first few installs
and it's going to be a little less if
your app solely acts on the back end
and it's going to be a bit more if it
also works on the front end
because then it has to seamlessly
integrate with a lot of different themes
and eventually later down the road you
can build a team to outsource that or
automate that or have something like a
first or second level support
but in the beginning you're going to do
it all by yourself
and then you will have maintenance like
fixing smaller bugs
or you might also want to deploy new
features yeah so that's it for apps
so as you can see this whole apps topic
is quite complex
and that's also why inside free mode we
focus on the right half side of things
because
there we can get your results much more
consistent and predictable
and i mean we literally guarantee that
we have a 30-day money-back guarantee in
place
if anything feels off you get your money
back so there's like zero incentive for
me
to sell you something that doesn't work
so keep an eye on that
and with that i think we've accomplished
the longest intro in the history of this
channel
but i think it was super important so
let's get started
[Music]
hey jan here codingthen.com let's get
straight to the meta at hand
here's the infrastructure of what we're
building today so we're going to have
the shopify site
we're going to have our local pc and we
will have a dedicated
server where our app runs so for example
this could be
myapp.com and yes you can imagine this
to be just a regular website
and the only thing special about it is
that only shopify sites can log in here
and once they do so they get to their
dashboard which contains all the
functions and numbers and whatnot
and even though this might look similar
to the shopify admin dashboard
we always have to keep in mind it's not
it's myapp.com and it's a completely
detached website
and it only looks similar to create this
cohesive design experience
and like the best user experience and
when someone goes to the admin dashboard
and clicks on apps and then opens our
demo app
what really happens behind the scenes is
all this authentication process
and then shopify just embeds our website
myapp.com
into their website with an iframe
so they just display our website inside
their website
and that way as a user we can kind of
interact with both
and we will get more into the technical
details but for now this will be good
enough to get started
okay now besides that we also need to
prepare a couple of things in advance
and one thing is your shopify partner
account you can sign
up for free and then you also want to
create
a development store that's a store where
you can test your app
mine is called how to write an app and
as you can see
i currently don't have any apps
installed and then the last thing we're
going to need
is the shopify app cli that's an
additional piece of software
that helps to prototype these kinds of
apps and here you can find the
installation process and the
requirements
so for example you need to have ruby
installed on your pc
and don't get confused here we are not
building a ruby on rails app
we are building a node.js and react app
but the app cli is just built on ruby
so in order for us to use that we gotta
have ruby installed
and then you can just follow the
installation process for your operating
system
and just like with every other
installation there are certain things
that can go wrong
certain warnings certain error messages
but then you would just have to research
these
because with every project there's a
certain amount of research involved
and you really have to get into this
problem-solving
engineering type of mindset that's super
important or actually it's a minimum
requirement
and then you're also going to need a
local code editor you can use pretty
much anything except windows notepad
so i'm using visual studio code which is
pretty much industry standard
okay so now with all of that in place i
have a new folder on my desktop
and now i'm gonna open that with visual
studio code this has the main benefit
that as soon as i bring up the terminal
the working directory will be set to my
new folder
so let me show you that so you could
either hit ctrl shift and p
or you could also click on this little
gear icon command palette
and then i want to view the integrated
terminal
so you can see my working directory is
set to desktop slash app
and then as a first command we want to
type shopify
create we want to build a node.js app
now we have to enter an app name so
maybe we could just go with demo app for
now
you can decide whether you want to build
a custom or public app
we will go with public app
now it gives you this url to authorize
with your partner account so let's
follow that
so now i just log into my partner
account
authenticated successful we can now
close this page let's do it
and then you can select the specific
partner account because i have two in
here
so for all the youtube videos it will be
coding with yun and then you want to
select the demo store
so for me that's how to write an
app.myshopify.com
and now we just have to wait for all of
that to finish can take a couple seconds
or even minutes
so i'll see you then and now it already
registered the app
inside our partner dashboard but not
inside our development store yet
so what i want to do next is type
shopify serve
that brings up
ah sorry we have to navigate into our
demo app folder first
so let's do cd demo app
and then let's run shopify server again
so this looks a lot better and what i
was about to explain is
that shopify serve brings up our app
server
and the only difference is that for now
we don't have this myapp.com domain
and we're actually hosting it on our
local pc
but once you deploy the app you want to
push it to heroku
or any other web hoster and here it's
asking us
to create a tunnel to our local pc
because we don't have the public web
server yet so let's hit yes
so now our server is running and we can
install our app by clicking this link
here
and actually this angry url is our
myapp.com domain only looks a bit
different
and you got to use your imagination but
yeah that's the tunnel to your local pc
so let's click on that
so here it redirected me to our
development store and let's go ahead and
install that app
so there we have it our very first
shopify app with node and react
first how cool is that second i could
also show you the iframe
so let's go to inspect and there we have
it
an iframe pointing to our local pc
through the ngrok tunnel and let me also
show you what happens when you try to
bring up this url
outside of a shopify store so let's get
a new incognito
and try to visit that then you would
immediately see
shop undefined and then it can't access
the site
okay so far so good pretty cool but
what's next
you may be asking excellent question and
it really depends on
what you want to do next so
[Music]
if you never used node.js before i
highly recommend checking out my video
on automated testing frameworks because
there i have like a small introduction
to node and mpm i could tell you more
about the different packages used here
we can talk more about the shopify app
bridge which is used
to enable communication between this
frame and the mainframe
because usually iframes can't easily
communicate with each other
or we could talk about graphql like
making graphql calls with the apollo
client
we could talk about routing with next js
we could talk more about react like how
we can modify the content of this page
so you could add a little test here
and then it would appear right here we
can talk more about polaris which is a
collection of different
react components that will help you to
build these shopify looking interfaces
and elements
or we could also talk more about react
in general
or i could tell you more about the
server side of things
we could set up our own routes and maybe
even build our own api we could talk
about web hooks
so there are a thousand different things
that we could cover and just let me know
what you want to learn next
i also have a few other videos planned
but we can have an app video
in between every now and then would
actually be a lot of fun and then i
would say this was a pretty good start
and i hope that was something and
helpful
if you're looking to become a freelancer
keep an eye on free mode for a more
structured and guided format
and then i also found this very
insightful article on
how to like a youtube video and i don't
think we need this part here
so make sure to check that out and then
i'll see you in the next bye
원문 자막 펼치기
WEBVTT Kind: captions Language: en 00:00:00.399 --> 00:00:02.790 align:start position:0% all<00:00:00.480><c> right</c><00:00:00.640><c> guys</c><00:00:01.120><c> so</c><00:00:01.360><c> today</c><00:00:02.000><c> fastest</c><00:00:02.399><c> way</c><00:00:02.639><c> to</c> 00:00:02.790 --> 00:00:02.800 align:start position:0% all right guys so today fastest way to 00:00:02.800 --> 00:00:04.630 align:start position:0% all right guys so today fastest way to build<00:00:03.040><c> a</c><00:00:03.120><c> shopify</c><00:00:03.520><c> app</c><00:00:03.760><c> from</c><00:00:03.919><c> scratch</c> 00:00:04.630 --> 00:00:04.640 align:start position:0% build a shopify app from scratch 00:00:04.640 --> 00:00:06.309 align:start position:0% build a shopify app from scratch which<00:00:04.880><c> at</c><00:00:04.960><c> this</c><00:00:05.200><c> point</c><00:00:05.600><c> might</c><00:00:05.839><c> also</c><00:00:06.080><c> be</c><00:00:06.240><c> the</c> 00:00:06.309 --> 00:00:06.319 align:start position:0% which at this point might also be the 00:00:06.319 --> 00:00:08.070 align:start position:0% which at this point might also be the best<00:00:06.640><c> way</c><00:00:07.040><c> to</c><00:00:07.200><c> start</c><00:00:07.520><c> your</c><00:00:07.759><c> own</c> 00:00:08.070 --> 00:00:08.080 align:start position:0% best way to start your own 00:00:08.080 --> 00:00:09.990 align:start position:0% best way to start your own system<00:00:08.480><c> as</c><00:00:08.639><c> a</c><00:00:08.720><c> service</c><00:00:09.120><c> business</c><00:00:09.360><c> or</c><00:00:09.519><c> a</c><00:00:09.679><c> sas</c> 00:00:09.990 --> 00:00:10.000 align:start position:0% system as a service business or a sas 00:00:10.000 --> 00:00:11.350 align:start position:0% system as a service business or a sas business<00:00:10.800><c> because</c> 00:00:11.350 --> 00:00:11.360 align:start position:0% business because 00:00:11.360 --> 00:00:13.350 align:start position:0% business because it's<00:00:11.679><c> actually</c><00:00:12.080><c> way</c><00:00:12.320><c> easier</c><00:00:12.880><c> to</c><00:00:13.040><c> build</c><00:00:13.280><c> a</c> 00:00:13.350 --> 00:00:13.360 align:start position:0% it's actually way easier to build a 00:00:13.360 --> 00:00:14.950 align:start position:0% it's actually way easier to build a profitable<00:00:13.920><c> shopify</c><00:00:14.400><c> app</c> 00:00:14.950 --> 00:00:14.960 align:start position:0% profitable shopify app 00:00:14.960 --> 00:00:16.790 align:start position:0% profitable shopify app than<00:00:15.120><c> would</c><00:00:15.360><c> be</c><00:00:15.839><c> to</c><00:00:16.000><c> let's</c><00:00:16.160><c> say</c><00:00:16.400><c> create</c><00:00:16.720><c> the</c> 00:00:16.790 --> 00:00:16.800 align:start position:0% than would be to let's say create the 00:00:16.800 --> 00:00:18.550 align:start position:0% than would be to let's say create the next<00:00:17.119><c> profitable</c><00:00:17.920><c> android</c> 00:00:18.550 --> 00:00:18.560 align:start position:0% next profitable android 00:00:18.560 --> 00:00:21.510 align:start position:0% next profitable android or<00:00:19.199><c> ios</c><00:00:19.760><c> app</c><00:00:20.400><c> and</c><00:00:20.480><c> that's</c><00:00:20.720><c> mainly</c><00:00:21.039><c> because</c> 00:00:21.510 --> 00:00:21.520 align:start position:0% or ios app and that's mainly because 00:00:21.520 --> 00:00:23.189 align:start position:0% or ios app and that's mainly because your<00:00:21.760><c> main</c><00:00:22.000><c> target</c><00:00:22.400><c> audience</c> 00:00:23.189 --> 00:00:23.199 align:start position:0% your main target audience 00:00:23.199 --> 00:00:25.509 align:start position:0% your main target audience is<00:00:23.519><c> purely</c><00:00:24.000><c> merchants</c><00:00:24.800><c> who</c><00:00:24.960><c> have</c><00:00:25.119><c> money</c><00:00:25.359><c> to</c> 00:00:25.509 --> 00:00:25.519 align:start position:0% is purely merchants who have money to 00:00:25.519 --> 00:00:27.109 align:start position:0% is purely merchants who have money to invest<00:00:25.920><c> in</c><00:00:26.000><c> their</c><00:00:26.240><c> business</c> 00:00:27.109 --> 00:00:27.119 align:start position:0% invest in their business 00:00:27.119 --> 00:00:28.870 align:start position:0% invest in their business and<00:00:27.359><c> if</c><00:00:27.519><c> your</c><00:00:27.760><c> app</c><00:00:28.000><c> solves</c><00:00:28.320><c> a</c><00:00:28.400><c> problem</c><00:00:28.720><c> for</c> 00:00:28.870 --> 00:00:28.880 align:start position:0% and if your app solves a problem for 00:00:28.880 --> 00:00:30.870 align:start position:0% and if your app solves a problem for them<00:00:29.359><c> you</c><00:00:29.439><c> can</c><00:00:29.679><c> justify</c><00:00:30.240><c> a</c><00:00:30.320><c> higher</c><00:00:30.640><c> price</c> 00:00:30.870 --> 00:00:30.880 align:start position:0% them you can justify a higher price 00:00:30.880 --> 00:00:31.509 align:start position:0% them you can justify a higher price point 00:00:31.509 --> 00:00:31.519 align:start position:0% point 00:00:31.519 --> 00:00:33.590 align:start position:0% point now<00:00:31.679><c> before</c><00:00:32.000><c> we</c><00:00:32.079><c> get</c><00:00:32.320><c> there</c><00:00:32.640><c> i</c><00:00:33.040><c> absolutely</c> 00:00:33.590 --> 00:00:33.600 align:start position:0% now before we get there i absolutely 00:00:33.600 --> 00:00:34.549 align:start position:0% now before we get there i absolutely need<00:00:33.840><c> to</c><00:00:33.920><c> understand</c> 00:00:34.549 --> 00:00:34.559 align:start position:0% need to understand 00:00:34.559 --> 00:00:36.709 align:start position:0% need to understand what<00:00:34.719><c> you're</c><00:00:34.880><c> getting</c><00:00:35.200><c> into</c><00:00:35.440><c> here</c><00:00:36.079><c> because</c> 00:00:36.709 --> 00:00:36.719 align:start position:0% what you're getting into here because 00:00:36.719 --> 00:00:37.830 align:start position:0% what you're getting into here because app<00:00:36.960><c> development</c> 00:00:37.830 --> 00:00:37.840 align:start position:0% app development 00:00:37.840 --> 00:00:40.150 align:start position:0% app development is<00:00:38.079><c> quite</c><00:00:38.320><c> advanced</c><00:00:39.200><c> and</c><00:00:39.440><c> it's</c><00:00:39.520><c> not</c><00:00:39.760><c> even</c> 00:00:40.150 --> 00:00:40.160 align:start position:0% is quite advanced and it's not even 00:00:40.160 --> 00:00:41.990 align:start position:0% is quite advanced and it's not even remotely<00:00:40.719><c> as</c><00:00:40.879><c> beginner</c><00:00:41.280><c> friendly</c><00:00:41.760><c> as</c> 00:00:41.990 --> 00:00:42.000 align:start position:0% remotely as beginner friendly as 00:00:42.000 --> 00:00:43.350 align:start position:0% remotely as beginner friendly as freelancing<00:00:42.480><c> for</c><00:00:42.640><c> example</c> 00:00:43.350 --> 00:00:43.360 align:start position:0% freelancing for example 00:00:43.360 --> 00:00:44.869 align:start position:0% freelancing for example and<00:00:43.520><c> that's</c><00:00:43.680><c> why</c><00:00:43.840><c> i</c><00:00:43.920><c> put</c><00:00:44.079><c> together</c><00:00:44.640><c> this</c> 00:00:44.869 --> 00:00:44.879 align:start position:0% and that's why i put together this 00:00:44.879 --> 00:00:46.630 align:start position:0% and that's why i put together this extremely<00:00:45.360><c> important</c><00:00:45.680><c> comparison</c> 00:00:46.630 --> 00:00:46.640 align:start position:0% extremely important comparison 00:00:46.640 --> 00:00:48.470 align:start position:0% extremely important comparison just<00:00:46.879><c> to</c><00:00:46.960><c> give</c><00:00:47.120><c> you</c><00:00:47.200><c> a</c><00:00:47.280><c> better</c><00:00:47.520><c> overview</c><00:00:48.239><c> and</c> 00:00:48.470 --> 00:00:48.480 align:start position:0% just to give you a better overview and 00:00:48.480 --> 00:00:50.229 align:start position:0% just to give you a better overview and some<00:00:48.640><c> more</c><00:00:48.800><c> realistic</c><00:00:49.360><c> expectations</c> 00:00:50.229 --> 00:00:50.239 align:start position:0% some more realistic expectations 00:00:50.239 --> 00:00:52.150 align:start position:0% some more realistic expectations so<00:00:50.399><c> here</c><00:00:50.559><c> we</c><00:00:50.800><c> are</c><00:00:51.039><c> in</c><00:00:51.199><c> the</c><00:00:51.280><c> powerpoint</c><00:00:51.920><c> of</c> 00:00:52.150 --> 00:00:52.160 align:start position:0% so here we are in the powerpoint of 00:00:52.160 --> 00:00:54.069 align:start position:0% so here we are in the powerpoint of truth<00:00:52.480><c> and</c><00:00:52.559><c> justice</c><00:00:53.039><c> where</c><00:00:53.199><c> we</c><00:00:53.360><c> have</c><00:00:53.600><c> apps</c> 00:00:54.069 --> 00:00:54.079 align:start position:0% truth and justice where we have apps 00:00:54.079 --> 00:00:56.150 align:start position:0% truth and justice where we have apps versus<00:00:54.559><c> freelancing</c><00:00:55.600><c> and</c><00:00:55.760><c> we're</c><00:00:55.920><c> going</c><00:00:56.079><c> to</c> 00:00:56.150 --> 00:00:56.160 align:start position:0% versus freelancing and we're going to 00:00:56.160 --> 00:00:57.670 align:start position:0% versus freelancing and we're going to start<00:00:56.320><c> with</c><00:00:56.559><c> freelancing</c><00:00:57.199><c> because</c><00:00:57.360><c> there's</c><00:00:57.600><c> a</c> 00:00:57.670 --> 00:00:57.680 align:start position:0% start with freelancing because there's a 00:00:57.680 --> 00:00:59.029 align:start position:0% start with freelancing because there's a little<00:00:57.840><c> less</c><00:00:58.079><c> to</c><00:00:58.239><c> cover</c> 00:00:59.029 --> 00:00:59.039 align:start position:0% little less to cover 00:00:59.039 --> 00:01:00.549 align:start position:0% little less to cover and<00:00:59.199><c> if</c><00:00:59.359><c> you</c><00:00:59.440><c> want</c><00:00:59.520><c> to</c><00:00:59.600><c> get</c><00:00:59.760><c> into</c><00:01:00.000><c> that</c><00:01:00.399><c> you</c> 00:01:00.549 --> 00:01:00.559 align:start position:0% and if you want to get into that you 00:01:00.559 --> 00:01:02.869 align:start position:0% and if you want to get into that you would<00:01:00.719><c> need</c><00:01:00.879><c> to</c><00:01:01.039><c> learn</c><00:01:01.520><c> html</c><00:01:02.239><c> css</c><00:01:02.800><c> and</c> 00:01:02.869 --> 00:01:02.879 align:start position:0% would need to learn html css and 00:01:02.879 --> 00:01:03.750 align:start position:0% would need to learn html css and javascript 00:01:03.750 --> 00:01:03.760 align:start position:0% javascript 00:01:03.760 --> 00:01:05.750 align:start position:0% javascript which<00:01:04.000><c> is</c><00:01:04.159><c> basically</c><00:01:04.879><c> the</c><00:01:05.040><c> web</c><00:01:05.280><c> development</c> 00:01:05.750 --> 00:01:05.760 align:start position:0% which is basically the web development 00:01:05.760 --> 00:01:07.670 align:start position:0% which is basically the web development stack<00:01:06.560><c> and</c><00:01:06.720><c> then</c><00:01:06.880><c> you</c><00:01:06.960><c> would</c><00:01:07.119><c> also</c><00:01:07.360><c> need</c><00:01:07.520><c> to</c> 00:01:07.670 --> 00:01:07.680 align:start position:0% stack and then you would also need to 00:01:07.680 --> 00:01:08.070 align:start position:0% stack and then you would also need to learn 00:01:08.070 --> 00:01:08.080 align:start position:0% learn 00:01:08.080 --> 00:01:10.870 align:start position:0% learn shopify<00:01:08.560><c> liquid</c><00:01:09.200><c> as</c><00:01:09.600><c> shopify's</c><00:01:10.400><c> back-end</c> 00:01:10.870 --> 00:01:10.880 align:start position:0% shopify liquid as shopify's back-end 00:01:10.880 --> 00:01:12.310 align:start position:0% shopify liquid as shopify's back-end templating<00:01:11.439><c> language</c> 00:01:12.310 --> 00:01:12.320 align:start position:0% templating language 00:01:12.320 --> 00:01:13.830 align:start position:0% templating language and<00:01:12.560><c> on</c><00:01:12.720><c> top</c><00:01:12.880><c> of</c><00:01:12.960><c> that</c><00:01:13.200><c> you</c><00:01:13.280><c> would</c><00:01:13.439><c> also</c><00:01:13.680><c> need</c> 00:01:13.830 --> 00:01:13.840 align:start position:0% and on top of that you would also need 00:01:13.840 --> 00:01:15.670 align:start position:0% and on top of that you would also need to<00:01:14.000><c> learn</c><00:01:14.479><c> all</c><00:01:14.720><c> the</c><00:01:14.880><c> ins</c><00:01:15.040><c> and</c><00:01:15.200><c> outs</c> 00:01:15.670 --> 00:01:15.680 align:start position:0% to learn all the ins and outs 00:01:15.680 --> 00:01:18.390 align:start position:0% to learn all the ins and outs of<00:01:15.920><c> shopify</c><00:01:16.479><c> as</c><00:01:16.640><c> a</c><00:01:16.799><c> platform</c><00:01:17.680><c> so</c><00:01:17.920><c> that</c><00:01:18.080><c> is</c><00:01:18.159><c> to</c> 00:01:18.390 --> 00:01:18.400 align:start position:0% of shopify as a platform so that is to 00:01:18.400 --> 00:01:18.950 align:start position:0% of shopify as a platform so that is to say 00:01:18.950 --> 00:01:18.960 align:start position:0% say 00:01:18.960 --> 00:01:21.270 align:start position:0% say configuring<00:01:19.520><c> all</c><00:01:19.680><c> the</c><00:01:19.840><c> settings</c><00:01:20.320><c> like</c><00:01:20.640><c> taxes</c> 00:01:21.270 --> 00:01:21.280 align:start position:0% configuring all the settings like taxes 00:01:21.280 --> 00:01:23.510 align:start position:0% configuring all the settings like taxes shipping<00:01:21.920><c> creating</c><00:01:22.240><c> stores</c><00:01:22.560><c> from</c><00:01:22.720><c> scratch</c> 00:01:23.510 --> 00:01:23.520 align:start position:0% shipping creating stores from scratch 00:01:23.520 --> 00:01:25.270 align:start position:0% shipping creating stores from scratch setting<00:01:23.840><c> up</c><00:01:24.080><c> good</c><00:01:24.320><c> looking</c><00:01:24.640><c> or</c><00:01:24.799><c> professional</c> 00:01:25.270 --> 00:01:25.280 align:start position:0% setting up good looking or professional 00:01:25.280 --> 00:01:26.630 align:start position:0% setting up good looking or professional looking<00:01:25.600><c> front</c><00:01:25.920><c> ends</c> 00:01:26.630 --> 00:01:26.640 align:start position:0% looking front ends 00:01:26.640 --> 00:01:28.390 align:start position:0% looking front ends knowing<00:01:26.880><c> about</c><00:01:27.360><c> the</c><00:01:27.520><c> best</c><00:01:27.840><c> themes</c><00:01:28.080><c> you</c><00:01:28.159><c> can</c> 00:01:28.390 --> 00:01:28.400 align:start position:0% knowing about the best themes you can 00:01:28.400 --> 00:01:30.710 align:start position:0% knowing about the best themes you can use<00:01:28.799><c> knowing</c><00:01:29.119><c> about</c><00:01:29.600><c> different</c><00:01:30.000><c> apps</c><00:01:30.400><c> for</c> 00:01:30.710 --> 00:01:30.720 align:start position:0% use knowing about different apps for 00:01:30.720 --> 00:01:32.149 align:start position:0% use knowing about different apps for different<00:01:31.119><c> use</c><00:01:31.439><c> cases</c> 00:01:32.149 --> 00:01:32.159 align:start position:0% different use cases 00:01:32.159 --> 00:01:34.469 align:start position:0% different use cases or<00:01:32.400><c> delivering</c><00:01:32.960><c> services</c><00:01:33.600><c> like</c><00:01:33.920><c> store</c><00:01:34.159><c> speed</c> 00:01:34.469 --> 00:01:34.479 align:start position:0% or delivering services like store speed 00:01:34.479 --> 00:01:35.270 align:start position:0% or delivering services like store speed optimization 00:01:35.270 --> 00:01:35.280 align:start position:0% optimization 00:01:35.280 --> 00:01:38.310 align:start position:0% optimization migrations<00:01:36.720><c> code</c><00:01:37.040><c> customizations</c><00:01:37.920><c> and</c><00:01:38.079><c> theme</c> 00:01:38.310 --> 00:01:38.320 align:start position:0% migrations code customizations and theme 00:01:38.320 --> 00:01:39.429 align:start position:0% migrations code customizations and theme customizations 00:01:39.429 --> 00:01:39.439 align:start position:0% customizations 00:01:39.439 --> 00:01:40.710 align:start position:0% customizations so<00:01:39.600><c> then</c><00:01:39.759><c> you</c><00:01:39.840><c> would</c><00:01:40.000><c> need</c><00:01:40.079><c> to</c><00:01:40.159><c> learn</c><00:01:40.400><c> about</c> 00:01:40.710 --> 00:01:40.720 align:start position:0% so then you would need to learn about 00:01:40.720 --> 00:01:42.789 align:start position:0% so then you would need to learn about theme<00:01:40.960><c> files</c><00:01:41.360><c> shopify</c><00:01:41.840><c> sections</c><00:01:42.399><c> all</c><00:01:42.560><c> these</c> 00:01:42.789 --> 00:01:42.799 align:start position:0% theme files shopify sections all these 00:01:42.799 --> 00:01:43.830 align:start position:0% theme files shopify sections all these kinds<00:01:42.960><c> of</c><00:01:43.119><c> things</c> 00:01:43.830 --> 00:01:43.840 align:start position:0% kinds of things 00:01:43.840 --> 00:01:45.830 align:start position:0% kinds of things but<00:01:44.000><c> once</c><00:01:44.240><c> you</c><00:01:44.399><c> become</c><00:01:44.720><c> good</c><00:01:44.880><c> at</c><00:01:45.040><c> all</c><00:01:45.119><c> of</c><00:01:45.280><c> these</c> 00:01:45.830 --> 00:01:45.840 align:start position:0% but once you become good at all of these 00:01:45.840 --> 00:01:47.109 align:start position:0% but once you become good at all of these you're<00:01:46.159><c> pretty</c><00:01:46.320><c> much</c><00:01:46.560><c> ready</c> 00:01:47.109 --> 00:01:47.119 align:start position:0% you're pretty much ready 00:01:47.119 --> 00:01:49.109 align:start position:0% you're pretty much ready to<00:01:47.280><c> hit</c><00:01:47.520><c> the</c><00:01:47.680><c> market</c><00:01:48.479><c> and</c><00:01:48.640><c> from</c><00:01:48.799><c> there</c><00:01:49.040><c> you</c> 00:01:49.109 --> 00:01:49.119 align:start position:0% to hit the market and from there you 00:01:49.119 --> 00:01:50.950 align:start position:0% to hit the market and from there you would<00:01:49.280><c> need</c><00:01:49.439><c> to</c><00:01:49.520><c> learn</c><00:01:49.840><c> how</c><00:01:50.000><c> to</c><00:01:50.159><c> find</c><00:01:50.399><c> clients</c> 00:01:50.950 --> 00:01:50.960 align:start position:0% would need to learn how to find clients 00:01:50.960 --> 00:01:52.550 align:start position:0% would need to learn how to find clients how<00:01:51.119><c> to</c><00:01:51.280><c> talk</c><00:01:51.439><c> to</c><00:01:51.600><c> them</c><00:01:51.840><c> how</c><00:01:52.000><c> to</c><00:01:52.159><c> position</c> 00:01:52.550 --> 00:01:52.560 align:start position:0% how to talk to them how to position 00:01:52.560 --> 00:01:53.270 align:start position:0% how to talk to them how to position yourself 00:01:53.270 --> 00:01:53.280 align:start position:0% yourself 00:01:53.280 --> 00:01:55.510 align:start position:0% yourself how<00:01:53.520><c> to</c><00:01:53.600><c> send</c><00:01:53.840><c> a</c><00:01:53.920><c> good</c><00:01:54.079><c> proposal</c><00:01:54.880><c> how</c><00:01:55.040><c> to</c><00:01:55.200><c> price</c> 00:01:55.510 --> 00:01:55.520 align:start position:0% how to send a good proposal how to price 00:01:55.520 --> 00:01:57.030 align:start position:0% how to send a good proposal how to price your<00:01:55.680><c> services</c> 00:01:57.030 --> 00:01:57.040 align:start position:0% your services 00:01:57.040 --> 00:01:59.109 align:start position:0% your services which<00:01:57.520><c> can</c><00:01:57.759><c> be</c><00:01:57.840><c> a</c><00:01:57.920><c> bit</c><00:01:58.159><c> tricky</c><00:01:58.880><c> or</c> 00:01:59.109 --> 00:01:59.119 align:start position:0% which can be a bit tricky or 00:01:59.119 --> 00:02:01.109 align:start position:0% which can be a bit tricky or overwhelming<00:01:59.759><c> especially</c><00:02:00.159><c> in</c><00:02:00.240><c> the</c><00:02:00.320><c> beginning</c> 00:02:01.109 --> 00:02:01.119 align:start position:0% overwhelming especially in the beginning 00:02:01.119 --> 00:02:03.190 align:start position:0% overwhelming especially in the beginning but<00:02:01.360><c> i</c><00:02:01.439><c> believe</c><00:02:01.840><c> if</c><00:02:02.000><c> you</c><00:02:02.159><c> commit</c><00:02:02.640><c> to</c><00:02:02.880><c> learning</c> 00:02:03.190 --> 00:02:03.200 align:start position:0% but i believe if you commit to learning 00:02:03.200 --> 00:02:04.230 align:start position:0% but i believe if you commit to learning all<00:02:03.360><c> of</c><00:02:03.600><c> these</c> 00:02:04.230 --> 00:02:04.240 align:start position:0% all of these 00:02:04.240 --> 00:02:06.230 align:start position:0% all of these that's<00:02:04.479><c> one</c><00:02:04.640><c> of</c><00:02:04.799><c> the</c><00:02:05.040><c> fastest</c><00:02:05.439><c> ways</c><00:02:05.920><c> how</c><00:02:06.159><c> you</c> 00:02:06.230 --> 00:02:06.240 align:start position:0% that's one of the fastest ways how you 00:02:06.240 --> 00:02:08.630 align:start position:0% that's one of the fastest ways how you can<00:02:06.399><c> get</c><00:02:06.560><c> to</c><00:02:06.719><c> a</c><00:02:06.799><c> sustainable</c><00:02:07.439><c> income</c><00:02:07.759><c> online</c> 00:02:08.630 --> 00:02:08.640 align:start position:0% can get to a sustainable income online 00:02:08.640 --> 00:02:10.630 align:start position:0% can get to a sustainable income online okay<00:02:08.879><c> now</c><00:02:09.039><c> how</c><00:02:09.200><c> does</c><00:02:09.360><c> this</c><00:02:09.440><c> compare</c><00:02:09.759><c> to</c><00:02:10.000><c> apps</c> 00:02:10.630 --> 00:02:10.640 align:start position:0% okay now how does this compare to apps 00:02:10.640 --> 00:02:12.309 align:start position:0% okay now how does this compare to apps on<00:02:10.879><c> this</c><00:02:11.120><c> side</c><00:02:11.520><c> the</c><00:02:11.680><c> first</c><00:02:11.920><c> thing</c><00:02:12.080><c> you</c><00:02:12.160><c> would</c> 00:02:12.309 --> 00:02:12.319 align:start position:0% on this side the first thing you would 00:02:12.319 --> 00:02:12.710 align:start position:0% on this side the first thing you would need 00:02:12.710 --> 00:02:12.720 align:start position:0% need 00:02:12.720 --> 00:02:15.430 align:start position:0% need is<00:02:12.879><c> a</c><00:02:12.959><c> good</c><00:02:13.200><c> idea</c><00:02:14.000><c> or</c><00:02:14.160><c> to</c><00:02:14.319><c> be</c><00:02:14.480><c> more</c><00:02:14.640><c> precise</c><00:02:15.280><c> you</c> 00:02:15.430 --> 00:02:15.440 align:start position:0% is a good idea or to be more precise you 00:02:15.440 --> 00:02:16.390 align:start position:0% is a good idea or to be more precise you need<00:02:15.599><c> to</c><00:02:15.760><c> solve</c><00:02:16.080><c> an</c> 00:02:16.390 --> 00:02:16.400 align:start position:0% need to solve an 00:02:16.400 --> 00:02:19.270 align:start position:0% need to solve an in-demand<00:02:17.120><c> problem</c><00:02:17.840><c> because</c><00:02:18.160><c> otherwise</c><00:02:18.959><c> your</c> 00:02:19.270 --> 00:02:19.280 align:start position:0% in-demand problem because otherwise your 00:02:19.280 --> 00:02:21.030 align:start position:0% in-demand problem because otherwise your app<00:02:19.599><c> won't</c><00:02:19.840><c> be</c><00:02:20.000><c> in</c><00:02:20.160><c> demand</c> 00:02:21.030 --> 00:02:21.040 align:start position:0% app won't be in demand 00:02:21.040 --> 00:02:22.949 align:start position:0% app won't be in demand and<00:02:21.280><c> you</c><00:02:21.440><c> also</c><00:02:21.599><c> don't</c><00:02:21.840><c> want</c><00:02:22.000><c> to</c><00:02:22.080><c> be</c><00:02:22.400><c> guessing</c> 00:02:22.949 --> 00:02:22.959 align:start position:0% and you also don't want to be guessing 00:02:22.959 --> 00:02:24.470 align:start position:0% and you also don't want to be guessing what<00:02:23.120><c> the</c><00:02:23.280><c> market</c><00:02:23.760><c> wants</c> 00:02:24.470 --> 00:02:24.480 align:start position:0% what the market wants 00:02:24.480 --> 00:02:26.630 align:start position:0% what the market wants uh<00:02:24.720><c> you</c><00:02:24.879><c> need</c><00:02:25.120><c> some</c><00:02:25.360><c> sort</c><00:02:25.680><c> of</c><00:02:26.080><c> data</c><00:02:26.480><c> or</c> 00:02:26.630 --> 00:02:26.640 align:start position:0% uh you need some sort of data or 00:02:26.640 --> 00:02:27.670 align:start position:0% uh you need some sort of data or reference<00:02:27.120><c> on</c><00:02:27.200><c> this</c> 00:02:27.670 --> 00:02:27.680 align:start position:0% reference on this 00:02:27.680 --> 00:02:29.190 align:start position:0% reference on this and<00:02:27.760><c> there</c><00:02:27.920><c> are</c><00:02:28.080><c> actually</c><00:02:28.319><c> different</c><00:02:28.640><c> ways</c><00:02:29.040><c> to</c> 00:02:29.190 --> 00:02:29.200 align:start position:0% and there are actually different ways to 00:02:29.200 --> 00:02:31.589 align:start position:0% and there are actually different ways to accumulate<00:02:29.680><c> that</c><00:02:30.319><c> but</c><00:02:30.480><c> honestly</c><00:02:31.040><c> one</c><00:02:31.280><c> of</c><00:02:31.360><c> the</c> 00:02:31.589 --> 00:02:31.599 align:start position:0% accumulate that but honestly one of the 00:02:31.599 --> 00:02:32.630 align:start position:0% accumulate that but honestly one of the easiest<00:02:32.080><c> ways</c> 00:02:32.630 --> 00:02:32.640 align:start position:0% easiest ways 00:02:32.640 --> 00:02:34.710 align:start position:0% easiest ways would<00:02:32.879><c> be</c><00:02:33.200><c> that</c><00:02:33.360><c> you</c><00:02:33.599><c> have</c><00:02:33.760><c> worked</c><00:02:34.080><c> with</c><00:02:34.400><c> real</c> 00:02:34.710 --> 00:02:34.720 align:start position:0% would be that you have worked with real 00:02:34.720 --> 00:02:36.309 align:start position:0% would be that you have worked with real world<00:02:35.040><c> clients</c><00:02:35.440><c> before</c> 00:02:36.309 --> 00:02:36.319 align:start position:0% world clients before 00:02:36.319 --> 00:02:37.910 align:start position:0% world clients before because<00:02:36.640><c> then</c><00:02:36.800><c> you</c><00:02:36.959><c> see</c><00:02:37.280><c> or</c><00:02:37.519><c> you</c><00:02:37.599><c> get</c><00:02:37.760><c> to</c> 00:02:37.910 --> 00:02:37.920 align:start position:0% because then you see or you get to 00:02:37.920 --> 00:02:39.750 align:start position:0% because then you see or you get to experience<00:02:38.560><c> first</c><00:02:38.959><c> hand</c> 00:02:39.750 --> 00:02:39.760 align:start position:0% experience first hand 00:02:39.760 --> 00:02:42.070 align:start position:0% experience first hand what<00:02:40.000><c> merchants</c><00:02:40.480><c> struggle</c><00:02:40.959><c> with</c><00:02:41.599><c> and</c><00:02:41.760><c> if</c><00:02:41.920><c> you</c> 00:02:42.070 --> 00:02:42.080 align:start position:0% what merchants struggle with and if you 00:02:42.080 --> 00:02:44.150 align:start position:0% what merchants struggle with and if you notice<00:02:42.400><c> the</c><00:02:42.560><c> same</c><00:02:42.879><c> issue</c><00:02:43.360><c> across</c><00:02:43.760><c> multiple</c> 00:02:44.150 --> 00:02:44.160 align:start position:0% notice the same issue across multiple 00:02:44.160 --> 00:02:44.949 align:start position:0% notice the same issue across multiple clients 00:02:44.949 --> 00:02:44.959 align:start position:0% clients 00:02:44.959 --> 00:02:46.790 align:start position:0% clients then<00:02:45.120><c> it's</c><00:02:45.280><c> very</c><00:02:45.599><c> likely</c><00:02:46.239><c> that</c><00:02:46.400><c> there's</c><00:02:46.640><c> like</c> 00:02:46.790 --> 00:02:46.800 align:start position:0% then it's very likely that there's like 00:02:46.800 --> 00:02:48.470 align:start position:0% then it's very likely that there's like a<00:02:46.879><c> bigger</c><00:02:47.200><c> audience</c><00:02:47.680><c> or</c><00:02:47.760><c> a</c><00:02:47.840><c> bigger</c><00:02:48.160><c> pool</c><00:02:48.400><c> of</c> 00:02:48.470 --> 00:02:48.480 align:start position:0% a bigger audience or a bigger pool of 00:02:48.480 --> 00:02:49.190 align:start position:0% a bigger audience or a bigger pool of people 00:02:49.190 --> 00:02:49.200 align:start position:0% people 00:02:49.200 --> 00:02:51.270 align:start position:0% people having<00:02:49.519><c> the</c><00:02:49.599><c> same</c><00:02:49.920><c> issue</c><00:02:50.720><c> and</c><00:02:50.879><c> that</c><00:02:51.040><c> would</c><00:02:51.200><c> be</c> 00:02:51.270 --> 00:02:51.280 align:start position:0% having the same issue and that would be 00:02:51.280 --> 00:02:52.309 align:start position:0% having the same issue and that would be the<00:02:51.440><c> easiest</c><00:02:51.840><c> market</c> 00:02:52.309 --> 00:02:52.319 align:start position:0% the easiest market 00:02:52.319 --> 00:02:54.550 align:start position:0% the easiest market to<00:02:52.480><c> tap</c><00:02:52.720><c> into</c><00:02:53.440><c> okay</c><00:02:53.760><c> now</c><00:02:53.920><c> given</c><00:02:54.239><c> that</c><00:02:54.319><c> you</c><00:02:54.400><c> have</c> 00:02:54.550 --> 00:02:54.560 align:start position:0% to tap into okay now given that you have 00:02:54.560 --> 00:02:55.670 align:start position:0% to tap into okay now given that you have a<00:02:54.640><c> good</c><00:02:54.800><c> idea</c> 00:02:55.670 --> 00:02:55.680 align:start position:0% a good idea 00:02:55.680 --> 00:02:57.190 align:start position:0% a good idea then<00:02:56.000><c> follows</c><00:02:56.560><c> the</c><00:02:56.720><c> technical</c> 00:02:57.190 --> 00:02:57.200 align:start position:0% then follows the technical 00:02:57.200 --> 00:02:58.869 align:start position:0% then follows the technical implementation<00:02:58.400><c> and</c> 00:02:58.869 --> 00:02:58.879 align:start position:0% implementation and 00:02:58.879 --> 00:03:00.869 align:start position:0% implementation and you<00:02:59.040><c> would</c><00:02:59.200><c> need</c><00:02:59.360><c> to</c><00:02:59.440><c> learn</c><00:02:59.680><c> html</c><00:03:00.319><c> css</c><00:03:00.800><c> and</c> 00:03:00.869 --> 00:03:00.879 align:start position:0% you would need to learn html css and 00:03:00.879 --> 00:03:02.710 align:start position:0% you would need to learn html css and javascript<00:03:01.519><c> as</c><00:03:01.760><c> well</c> 00:03:02.710 --> 00:03:02.720 align:start position:0% javascript as well 00:03:02.720 --> 00:03:04.390 align:start position:0% javascript as well although<00:03:03.040><c> i</c><00:03:03.120><c> would</c><00:03:03.360><c> say</c><00:03:03.760><c> you</c><00:03:03.920><c> need</c><00:03:04.080><c> to</c><00:03:04.159><c> learn</c> 00:03:04.390 --> 00:03:04.400 align:start position:0% although i would say you need to learn 00:03:04.400 --> 00:03:07.030 align:start position:0% although i would say you need to learn javascript<00:03:05.280><c> in</c><00:03:05.599><c> much</c><00:03:05.840><c> greater</c><00:03:06.159><c> detail</c><00:03:06.720><c> but</c><00:03:06.959><c> it</c> 00:03:07.030 --> 00:03:07.040 align:start position:0% javascript in much greater detail but it 00:03:07.040 --> 00:03:08.790 align:start position:0% javascript in much greater detail but it depends<00:03:07.360><c> a</c><00:03:07.519><c> bit</c><00:03:07.680><c> on</c><00:03:07.840><c> the</c><00:03:08.000><c> type</c><00:03:08.159><c> of</c><00:03:08.319><c> application</c> 00:03:08.790 --> 00:03:08.800 align:start position:0% depends a bit on the type of application 00:03:08.800 --> 00:03:09.830 align:start position:0% depends a bit on the type of application you<00:03:08.959><c> build</c> 00:03:09.830 --> 00:03:09.840 align:start position:0% you build 00:03:09.840 --> 00:03:11.190 align:start position:0% you build and<00:03:10.159><c> then</c><00:03:10.319><c> you</c><00:03:10.400><c> would</c><00:03:10.560><c> also</c><00:03:10.720><c> need</c><00:03:10.879><c> to</c><00:03:10.959><c> learn</c> 00:03:11.190 --> 00:03:11.200 align:start position:0% and then you would also need to learn 00:03:11.200 --> 00:03:13.110 align:start position:0% and then you would also need to learn about<00:03:11.440><c> shopify</c><00:03:11.920><c> as</c><00:03:12.080><c> a</c><00:03:12.159><c> platform</c> 00:03:13.110 --> 00:03:13.120 align:start position:0% about shopify as a platform 00:03:13.120 --> 00:03:15.270 align:start position:0% about shopify as a platform not<00:03:13.360><c> as</c><00:03:13.599><c> much</c><00:03:13.840><c> in</c><00:03:14.000><c> detail</c><00:03:14.720><c> as</c><00:03:15.040><c> with</c> 00:03:15.270 --> 00:03:15.280 align:start position:0% not as much in detail as with 00:03:15.280 --> 00:03:17.670 align:start position:0% not as much in detail as with freelancing<00:03:15.920><c> but</c><00:03:16.080><c> you</c><00:03:16.239><c> want</c><00:03:16.400><c> to</c><00:03:16.480><c> learn</c><00:03:16.720><c> about</c> 00:03:17.670 --> 00:03:17.680 align:start position:0% freelancing but you want to learn about 00:03:17.680 --> 00:03:20.229 align:start position:0% freelancing but you want to learn about theme<00:03:18.000><c> files</c><00:03:18.480><c> different</c><00:03:18.800><c> features</c><00:03:19.519><c> and</c><00:03:20.080><c> the</c> 00:03:20.229 --> 00:03:20.239 align:start position:0% theme files different features and the 00:03:20.239 --> 00:03:21.509 align:start position:0% theme files different features and the different<00:03:20.560><c> apis</c> 00:03:21.509 --> 00:03:21.519 align:start position:0% different apis 00:03:21.519 --> 00:03:22.949 align:start position:0% different apis and<00:03:21.680><c> then</c><00:03:21.840><c> you</c><00:03:21.920><c> would</c><00:03:22.080><c> also</c><00:03:22.319><c> need</c><00:03:22.400><c> to</c><00:03:22.560><c> learn</c> 00:03:22.949 --> 00:03:22.959 align:start position:0% and then you would also need to learn 00:03:22.959 --> 00:03:24.869 align:start position:0% and then you would also need to learn one<00:03:23.200><c> back-end</c><00:03:23.599><c> technology</c><00:03:24.239><c> or</c><00:03:24.480><c> back-end</c> 00:03:24.869 --> 00:03:24.879 align:start position:0% one back-end technology or back-end 00:03:24.879 --> 00:03:25.589 align:start position:0% one back-end technology or back-end language 00:03:25.589 --> 00:03:25.599 align:start position:0% language 00:03:25.599 --> 00:03:28.229 align:start position:0% language and<00:03:25.760><c> this</c><00:03:25.920><c> could</c><00:03:26.159><c> either</c><00:03:26.400><c> be</c><00:03:26.879><c> nodejs</c><00:03:27.680><c> or</c><00:03:27.920><c> ruby</c> 00:03:28.229 --> 00:03:28.239 align:start position:0% and this could either be nodejs or ruby 00:03:28.239 --> 00:03:29.030 align:start position:0% and this could either be nodejs or ruby on<00:03:28.400><c> rails</c> 00:03:29.030 --> 00:03:29.040 align:start position:0% on rails 00:03:29.040 --> 00:03:30.630 align:start position:0% on rails basically<00:03:29.519><c> it</c><00:03:29.599><c> could</c><00:03:29.760><c> be</c><00:03:30.000><c> any</c><00:03:30.239><c> back-end</c> 00:03:30.630 --> 00:03:30.640 align:start position:0% basically it could be any back-end 00:03:30.640 --> 00:03:32.309 align:start position:0% basically it could be any back-end technology<00:03:31.200><c> could</c><00:03:31.360><c> also</c><00:03:31.519><c> be</c><00:03:31.680><c> php</c><00:03:32.239><c> or</c> 00:03:32.309 --> 00:03:32.319 align:start position:0% technology could also be php or 00:03:32.319 --> 00:03:33.110 align:start position:0% technology could also be php or something 00:03:33.110 --> 00:03:33.120 align:start position:0% something 00:03:33.120 --> 00:03:35.430 align:start position:0% something but<00:03:33.440><c> these</c><00:03:33.680><c> two</c><00:03:33.920><c> are</c><00:03:34.080><c> the</c><00:03:34.159><c> most</c><00:03:34.480><c> popular</c><00:03:35.280><c> in</c> 00:03:35.430 --> 00:03:35.440 align:start position:0% but these two are the most popular in 00:03:35.440 --> 00:03:36.550 align:start position:0% but these two are the most popular in the<00:03:35.519><c> shopify</c><00:03:36.000><c> space</c> 00:03:36.550 --> 00:03:36.560 align:start position:0% the shopify space 00:03:36.560 --> 00:03:38.229 align:start position:0% the shopify space so<00:03:36.799><c> i</c><00:03:36.879><c> would</c><00:03:37.040><c> recommend</c><00:03:37.599><c> picking</c><00:03:37.920><c> one</c><00:03:38.080><c> of</c> 00:03:38.229 --> 00:03:38.239 align:start position:0% so i would recommend picking one of 00:03:38.239 --> 00:03:39.990 align:start position:0% so i would recommend picking one of these<00:03:38.879><c> and</c><00:03:38.959><c> then</c><00:03:39.120><c> you</c><00:03:39.200><c> might</c><00:03:39.440><c> also</c><00:03:39.680><c> want</c><00:03:39.840><c> to</c> 00:03:39.990 --> 00:03:40.000 align:start position:0% these and then you might also want to 00:03:40.000 --> 00:03:40.309 align:start position:0% these and then you might also want to learn 00:03:40.309 --> 00:03:40.319 align:start position:0% learn 00:03:40.319 --> 00:03:42.710 align:start position:0% learn a<00:03:40.560><c> front-end</c><00:03:41.120><c> framework</c><00:03:41.599><c> like</c><00:03:41.840><c> react</c><00:03:42.480><c> because</c> 00:03:42.710 --> 00:03:42.720 align:start position:0% a front-end framework like react because 00:03:42.720 --> 00:03:44.470 align:start position:0% a front-end framework like react because that<00:03:42.959><c> helps</c><00:03:43.280><c> to</c><00:03:43.440><c> build</c><00:03:43.760><c> the</c><00:03:43.920><c> interface</c><00:03:44.400><c> of</c> 00:03:44.470 --> 00:03:44.480 align:start position:0% that helps to build the interface of 00:03:44.480 --> 00:03:45.350 align:start position:0% that helps to build the interface of your<00:03:44.640><c> app</c> 00:03:45.350 --> 00:03:45.360 align:start position:0% your app 00:03:45.360 --> 00:03:47.430 align:start position:0% your app and<00:03:45.440><c> then</c><00:03:45.599><c> you</c><00:03:45.680><c> also</c><00:03:46.000><c> need</c><00:03:46.159><c> graphql</c><00:03:47.120><c> in</c><00:03:47.200><c> order</c> 00:03:47.430 --> 00:03:47.440 align:start position:0% and then you also need graphql in order 00:03:47.440 --> 00:03:49.110 align:start position:0% and then you also need graphql in order to<00:03:47.599><c> make</c><00:03:47.840><c> api</c><00:03:48.319><c> calls</c> 00:03:49.110 --> 00:03:49.120 align:start position:0% to make api calls 00:03:49.120 --> 00:03:51.030 align:start position:0% to make api calls so<00:03:49.440><c> then</c><00:03:49.599><c> you</c><00:03:49.680><c> can</c><00:03:49.920><c> communicate</c><00:03:50.640><c> with</c><00:03:50.879><c> the</c> 00:03:51.030 --> 00:03:51.040 align:start position:0% so then you can communicate with the 00:03:51.040 --> 00:03:52.390 align:start position:0% so then you can communicate with the shopify<00:03:51.599><c> system</c> 00:03:52.390 --> 00:03:52.400 align:start position:0% shopify system 00:03:52.400 --> 00:03:55.350 align:start position:0% shopify system and<00:03:52.879><c> update</c><00:03:53.280><c> or</c><00:03:53.519><c> fetch</c><00:03:53.840><c> data</c><00:03:54.640><c> and</c><00:03:54.799><c> speaking</c><00:03:55.200><c> of</c> 00:03:55.350 --> 00:03:55.360 align:start position:0% and update or fetch data and speaking of 00:03:55.360 --> 00:03:55.910 align:start position:0% and update or fetch data and speaking of data 00:03:55.910 --> 00:03:55.920 align:start position:0% data 00:03:55.920 --> 00:03:58.470 align:start position:0% data your<00:03:56.159><c> app</c><00:03:56.480><c> also</c><00:03:56.799><c> might</c><00:03:57.120><c> need</c><00:03:57.360><c> a</c><00:03:57.519><c> database</c><00:03:58.319><c> if</c> 00:03:58.470 --> 00:03:58.480 align:start position:0% your app also might need a database if 00:03:58.480 --> 00:04:00.630 align:start position:0% your app also might need a database if you<00:03:58.560><c> need</c><00:03:58.640><c> to</c><00:03:58.840><c> store</c><00:03:59.760><c> customer</c><00:04:00.239><c> data</c><00:04:00.480><c> for</c> 00:04:00.630 --> 00:04:00.640 align:start position:0% you need to store customer data for 00:04:00.640 --> 00:04:01.750 align:start position:0% you need to store customer data for example 00:04:01.750 --> 00:04:01.760 align:start position:0% example 00:04:01.760 --> 00:04:03.270 align:start position:0% example but<00:04:01.920><c> then</c><00:04:02.080><c> you</c><00:04:02.239><c> also</c><00:04:02.400><c> want</c><00:04:02.560><c> to</c><00:04:02.640><c> get</c><00:04:02.959><c> into</c><00:04:03.200><c> the</c> 00:04:03.270 --> 00:04:03.280 align:start position:0% but then you also want to get into the 00:04:03.280 --> 00:04:04.869 align:start position:0% but then you also want to get into the basics<00:04:03.840><c> of</c><00:04:04.080><c> security</c> 00:04:04.869 --> 00:04:04.879 align:start position:0% basics of security 00:04:04.879 --> 00:04:06.390 align:start position:0% basics of security because<00:04:05.200><c> you</c><00:04:05.360><c> don't</c><00:04:05.439><c> want</c><00:04:05.599><c> to</c><00:04:05.760><c> publicly</c> 00:04:06.390 --> 00:04:06.400 align:start position:0% because you don't want to publicly 00:04:06.400 --> 00:04:07.910 align:start position:0% because you don't want to publicly expose<00:04:06.959><c> that</c><00:04:07.200><c> data</c><00:04:07.599><c> or</c> 00:04:07.910 --> 00:04:07.920 align:start position:0% expose that data or 00:04:07.920 --> 00:04:10.710 align:start position:0% expose that data or leak<00:04:08.239><c> customer</c><00:04:08.720><c> data</c><00:04:09.680><c> and</c><00:04:09.760><c> then</c><00:04:10.000><c> lastly</c><00:04:10.560><c> you</c> 00:04:10.710 --> 00:04:10.720 align:start position:0% leak customer data and then lastly you 00:04:10.720 --> 00:04:11.990 align:start position:0% leak customer data and then lastly you would<00:04:10.799><c> need</c><00:04:10.959><c> to</c><00:04:11.040><c> figure</c><00:04:11.360><c> out</c><00:04:11.599><c> your</c><00:04:11.760><c> own</c> 00:04:11.990 --> 00:04:12.000 align:start position:0% would need to figure out your own 00:04:12.000 --> 00:04:12.710 align:start position:0% would need to figure out your own hosting 00:04:12.710 --> 00:04:12.720 align:start position:0% hosting 00:04:12.720 --> 00:04:14.789 align:start position:0% hosting because<00:04:13.040><c> your</c><00:04:13.280><c> app</c><00:04:13.519><c> has</c><00:04:13.760><c> to</c><00:04:14.000><c> run</c><00:04:14.560><c> on</c><00:04:14.720><c> a</c> 00:04:14.789 --> 00:04:14.799 align:start position:0% because your app has to run on a 00:04:14.799 --> 00:04:16.229 align:start position:0% because your app has to run on a dedicated<00:04:15.360><c> server</c> 00:04:16.229 --> 00:04:16.239 align:start position:0% dedicated server 00:04:16.239 --> 00:04:18.390 align:start position:0% dedicated server so<00:04:16.639><c> all</c><00:04:16.880><c> of</c><00:04:17.040><c> this</c><00:04:17.359><c> is</c><00:04:17.600><c> pretty</c><00:04:17.840><c> much</c><00:04:18.239><c> the</c> 00:04:18.390 --> 00:04:18.400 align:start position:0% so all of this is pretty much the 00:04:18.400 --> 00:04:19.830 align:start position:0% so all of this is pretty much the technical<00:04:18.880><c> implementation</c> 00:04:19.830 --> 00:04:19.840 align:start position:0% technical implementation 00:04:19.840 --> 00:04:22.629 align:start position:0% technical implementation and<00:04:20.079><c> from</c><00:04:20.320><c> there</c><00:04:20.799><c> you</c><00:04:20.880><c> can</c><00:04:21.040><c> hit</c><00:04:21.280><c> the</c><00:04:21.440><c> market</c><00:04:22.320><c> so</c> 00:04:22.629 --> 00:04:22.639 align:start position:0% and from there you can hit the market so 00:04:22.639 --> 00:04:24.390 align:start position:0% and from there you can hit the market so then<00:04:22.800><c> your</c><00:04:22.960><c> main</c><00:04:23.280><c> tasks</c><00:04:23.840><c> become</c> 00:04:24.390 --> 00:04:24.400 align:start position:0% then your main tasks become 00:04:24.400 --> 00:04:26.230 align:start position:0% then your main tasks become marketing<00:04:25.040><c> you</c><00:04:25.199><c> want</c><00:04:25.360><c> to</c><00:04:25.440><c> get</c><00:04:25.600><c> your</c><00:04:25.759><c> app</c><00:04:26.080><c> in</c> 00:04:26.230 --> 00:04:26.240 align:start position:0% marketing you want to get your app in 00:04:26.240 --> 00:04:28.469 align:start position:0% marketing you want to get your app in front<00:04:26.400><c> of</c><00:04:26.639><c> as</c><00:04:26.800><c> many</c><00:04:27.040><c> people</c><00:04:27.360><c> as</c><00:04:27.520><c> you</c><00:04:27.600><c> can</c> 00:04:28.469 --> 00:04:28.479 align:start position:0% front of as many people as you can 00:04:28.479 --> 00:04:30.310 align:start position:0% front of as many people as you can you<00:04:28.639><c> need</c><00:04:28.800><c> to</c><00:04:28.880><c> do</c><00:04:29.040><c> customer</c><00:04:29.440><c> support</c><00:04:29.919><c> as</c><00:04:30.080><c> soon</c> 00:04:30.310 --> 00:04:30.320 align:start position:0% you need to do customer support as soon 00:04:30.320 --> 00:04:32.390 align:start position:0% you need to do customer support as soon as<00:04:30.400><c> you</c><00:04:30.479><c> get</c><00:04:30.639><c> the</c><00:04:30.720><c> first</c><00:04:31.040><c> few</c><00:04:31.280><c> installs</c> 00:04:32.390 --> 00:04:32.400 align:start position:0% as you get the first few installs 00:04:32.400 --> 00:04:34.150 align:start position:0% as you get the first few installs and<00:04:32.880><c> it's</c><00:04:33.120><c> going</c><00:04:33.199><c> to</c><00:04:33.280><c> be</c><00:04:33.440><c> a</c><00:04:33.520><c> little</c><00:04:33.680><c> less</c><00:04:34.080><c> if</c> 00:04:34.150 --> 00:04:34.160 align:start position:0% and it's going to be a little less if 00:04:34.160 --> 00:04:36.310 align:start position:0% and it's going to be a little less if your<00:04:34.400><c> app</c><00:04:34.720><c> solely</c><00:04:35.120><c> acts</c><00:04:35.440><c> on</c><00:04:35.520><c> the</c><00:04:35.680><c> back</c><00:04:35.919><c> end</c> 00:04:36.310 --> 00:04:36.320 align:start position:0% your app solely acts on the back end 00:04:36.320 --> 00:04:38.390 align:start position:0% your app solely acts on the back end and<00:04:36.400><c> it's</c><00:04:36.560><c> going</c><00:04:36.720><c> to</c><00:04:36.800><c> be</c><00:04:36.880><c> a</c><00:04:36.960><c> bit</c><00:04:37.199><c> more</c><00:04:38.000><c> if</c><00:04:38.240><c> it</c> 00:04:38.390 --> 00:04:38.400 align:start position:0% and it's going to be a bit more if it 00:04:38.400 --> 00:04:40.150 align:start position:0% and it's going to be a bit more if it also<00:04:38.720><c> works</c><00:04:39.199><c> on</c><00:04:39.280><c> the</c><00:04:39.520><c> front</c><00:04:39.840><c> end</c> 00:04:40.150 --> 00:04:40.160 align:start position:0% also works on the front end 00:04:40.160 --> 00:04:41.909 align:start position:0% also works on the front end because<00:04:40.479><c> then</c><00:04:40.720><c> it</c><00:04:40.960><c> has</c><00:04:41.120><c> to</c><00:04:41.360><c> seamlessly</c> 00:04:41.909 --> 00:04:41.919 align:start position:0% because then it has to seamlessly 00:04:41.919 --> 00:04:44.230 align:start position:0% because then it has to seamlessly integrate<00:04:42.400><c> with</c><00:04:42.639><c> a</c><00:04:42.639><c> lot</c><00:04:42.800><c> of</c><00:04:42.880><c> different</c><00:04:43.280><c> themes</c> 00:04:44.230 --> 00:04:44.240 align:start position:0% integrate with a lot of different themes 00:04:44.240 --> 00:04:45.830 align:start position:0% integrate with a lot of different themes and<00:04:44.400><c> eventually</c><00:04:44.800><c> later</c><00:04:45.040><c> down</c><00:04:45.199><c> the</c><00:04:45.360><c> road</c><00:04:45.680><c> you</c> 00:04:45.830 --> 00:04:45.840 align:start position:0% and eventually later down the road you 00:04:45.840 --> 00:04:47.909 align:start position:0% and eventually later down the road you can<00:04:46.000><c> build</c><00:04:46.240><c> a</c><00:04:46.400><c> team</c><00:04:46.720><c> to</c><00:04:46.960><c> outsource</c><00:04:47.520><c> that</c><00:04:47.759><c> or</c> 00:04:47.909 --> 00:04:47.919 align:start position:0% can build a team to outsource that or 00:04:47.919 --> 00:04:49.590 align:start position:0% can build a team to outsource that or automate<00:04:48.320><c> that</c><00:04:48.639><c> or</c><00:04:48.800><c> have</c><00:04:48.960><c> something</c><00:04:49.280><c> like</c><00:04:49.520><c> a</c> 00:04:49.590 --> 00:04:49.600 align:start position:0% automate that or have something like a 00:04:49.600 --> 00:04:51.430 align:start position:0% automate that or have something like a first<00:04:49.840><c> or</c><00:04:50.000><c> second</c><00:04:50.240><c> level</c><00:04:50.479><c> support</c> 00:04:51.430 --> 00:04:51.440 align:start position:0% first or second level support 00:04:51.440 --> 00:04:53.189 align:start position:0% first or second level support but<00:04:51.600><c> in</c><00:04:51.759><c> the</c><00:04:51.840><c> beginning</c><00:04:52.720><c> you're</c><00:04:52.880><c> going</c><00:04:52.960><c> to</c><00:04:53.040><c> do</c> 00:04:53.189 --> 00:04:53.199 align:start position:0% but in the beginning you're going to do 00:04:53.199 --> 00:04:54.550 align:start position:0% but in the beginning you're going to do it<00:04:53.360><c> all</c><00:04:53.520><c> by</c><00:04:53.680><c> yourself</c> 00:04:54.550 --> 00:04:54.560 align:start position:0% it all by yourself 00:04:54.560 --> 00:04:56.390 align:start position:0% it all by yourself and<00:04:54.720><c> then</c><00:04:54.880><c> you</c><00:04:55.040><c> will</c><00:04:55.120><c> have</c><00:04:55.360><c> maintenance</c><00:04:56.160><c> like</c> 00:04:56.390 --> 00:04:56.400 align:start position:0% and then you will have maintenance like 00:04:56.400 --> 00:04:57.830 align:start position:0% and then you will have maintenance like fixing<00:04:56.720><c> smaller</c><00:04:57.120><c> bugs</c> 00:04:57.830 --> 00:04:57.840 align:start position:0% fixing smaller bugs 00:04:57.840 --> 00:04:59.590 align:start position:0% fixing smaller bugs or<00:04:58.000><c> you</c><00:04:58.160><c> might</c><00:04:58.320><c> also</c><00:04:58.560><c> want</c><00:04:58.720><c> to</c><00:04:58.800><c> deploy</c><00:04:59.360><c> new</c> 00:04:59.590 --> 00:04:59.600 align:start position:0% or you might also want to deploy new 00:04:59.600 --> 00:05:02.150 align:start position:0% or you might also want to deploy new features<00:05:00.080><c> yeah</c><00:05:00.320><c> so</c><00:05:00.479><c> that's</c><00:05:00.800><c> it</c><00:05:00.960><c> for</c><00:05:01.199><c> apps</c> 00:05:02.150 --> 00:05:02.160 align:start position:0% features yeah so that's it for apps 00:05:02.160 --> 00:05:04.230 align:start position:0% features yeah so that's it for apps so<00:05:02.400><c> as</c><00:05:02.560><c> you</c><00:05:02.639><c> can</c><00:05:02.800><c> see</c><00:05:03.039><c> this</c><00:05:03.280><c> whole</c><00:05:03.520><c> apps</c><00:05:03.759><c> topic</c> 00:05:04.230 --> 00:05:04.240 align:start position:0% so as you can see this whole apps topic 00:05:04.240 --> 00:05:05.749 align:start position:0% so as you can see this whole apps topic is<00:05:04.560><c> quite</c><00:05:04.800><c> complex</c> 00:05:05.749 --> 00:05:05.759 align:start position:0% is quite complex 00:05:05.759 --> 00:05:07.830 align:start position:0% is quite complex and<00:05:05.919><c> that's</c><00:05:06.160><c> also</c><00:05:06.479><c> why</c><00:05:06.720><c> inside</c><00:05:07.120><c> free</c><00:05:07.280><c> mode</c><00:05:07.680><c> we</c> 00:05:07.830 --> 00:05:07.840 align:start position:0% and that's also why inside free mode we 00:05:07.840 --> 00:05:09.909 align:start position:0% and that's also why inside free mode we focus<00:05:08.240><c> on</c><00:05:08.320><c> the</c><00:05:08.400><c> right</c><00:05:08.560><c> half</c><00:05:08.800><c> side</c><00:05:09.039><c> of</c><00:05:09.199><c> things</c> 00:05:09.909 --> 00:05:09.919 align:start position:0% focus on the right half side of things 00:05:09.919 --> 00:05:10.390 align:start position:0% focus on the right half side of things because 00:05:10.390 --> 00:05:10.400 align:start position:0% because 00:05:10.400 --> 00:05:12.310 align:start position:0% because there<00:05:10.639><c> we</c><00:05:10.720><c> can</c><00:05:10.880><c> get</c><00:05:10.960><c> your</c><00:05:11.120><c> results</c><00:05:11.840><c> much</c><00:05:12.080><c> more</c> 00:05:12.310 --> 00:05:12.320 align:start position:0% there we can get your results much more 00:05:12.320 --> 00:05:14.230 align:start position:0% there we can get your results much more consistent<00:05:13.039><c> and</c><00:05:13.280><c> predictable</c> 00:05:14.230 --> 00:05:14.240 align:start position:0% consistent and predictable 00:05:14.240 --> 00:05:16.230 align:start position:0% consistent and predictable and<00:05:14.400><c> i</c><00:05:14.479><c> mean</c><00:05:14.720><c> we</c><00:05:15.039><c> literally</c><00:05:15.440><c> guarantee</c><00:05:16.000><c> that</c> 00:05:16.230 --> 00:05:16.240 align:start position:0% and i mean we literally guarantee that 00:05:16.240 --> 00:05:17.990 align:start position:0% and i mean we literally guarantee that we<00:05:16.400><c> have</c><00:05:16.560><c> a</c><00:05:16.639><c> 30-day</c><00:05:17.039><c> money-back</c><00:05:17.440><c> guarantee</c><00:05:17.919><c> in</c> 00:05:17.990 --> 00:05:18.000 align:start position:0% we have a 30-day money-back guarantee in 00:05:18.000 --> 00:05:18.629 align:start position:0% we have a 30-day money-back guarantee in place 00:05:18.629 --> 00:05:18.639 align:start position:0% place 00:05:18.639 --> 00:05:20.469 align:start position:0% place if<00:05:18.880><c> anything</c><00:05:19.280><c> feels</c><00:05:19.600><c> off</c><00:05:19.840><c> you</c><00:05:19.919><c> get</c><00:05:20.080><c> your</c><00:05:20.240><c> money</c> 00:05:20.469 --> 00:05:20.479 align:start position:0% if anything feels off you get your money 00:05:20.479 --> 00:05:22.550 align:start position:0% if anything feels off you get your money back<00:05:20.800><c> so</c><00:05:21.039><c> there's</c><00:05:21.280><c> like</c><00:05:21.600><c> zero</c><00:05:21.919><c> incentive</c><00:05:22.400><c> for</c> 00:05:22.550 --> 00:05:22.560 align:start position:0% back so there's like zero incentive for 00:05:22.560 --> 00:05:23.110 align:start position:0% back so there's like zero incentive for me 00:05:23.110 --> 00:05:23.120 align:start position:0% me 00:05:23.120 --> 00:05:25.189 align:start position:0% me to<00:05:23.440><c> sell</c><00:05:23.680><c> you</c><00:05:23.840><c> something</c><00:05:24.160><c> that</c><00:05:24.240><c> doesn't</c><00:05:24.639><c> work</c> 00:05:25.189 --> 00:05:25.199 align:start position:0% to sell you something that doesn't work 00:05:25.199 --> 00:05:26.710 align:start position:0% to sell you something that doesn't work so<00:05:25.360><c> keep</c><00:05:25.600><c> an</c><00:05:25.759><c> eye</c><00:05:25.919><c> on</c><00:05:26.000><c> that</c> 00:05:26.710 --> 00:05:26.720 align:start position:0% so keep an eye on that 00:05:26.720 --> 00:05:29.110 align:start position:0% so keep an eye on that and<00:05:27.039><c> with</c><00:05:27.199><c> that</c><00:05:27.520><c> i</c><00:05:27.680><c> think</c><00:05:28.160><c> we've</c><00:05:28.400><c> accomplished</c> 00:05:29.110 --> 00:05:29.120 align:start position:0% and with that i think we've accomplished 00:05:29.120 --> 00:05:30.870 align:start position:0% and with that i think we've accomplished the<00:05:29.280><c> longest</c><00:05:29.680><c> intro</c><00:05:30.080><c> in</c><00:05:30.160><c> the</c><00:05:30.240><c> history</c><00:05:30.639><c> of</c><00:05:30.720><c> this</c> 00:05:30.870 --> 00:05:30.880 align:start position:0% the longest intro in the history of this 00:05:30.880 --> 00:05:31.430 align:start position:0% the longest intro in the history of this channel 00:05:31.430 --> 00:05:31.440 align:start position:0% channel 00:05:31.440 --> 00:05:33.110 align:start position:0% channel but<00:05:31.600><c> i</c><00:05:31.680><c> think</c><00:05:31.840><c> it</c><00:05:31.919><c> was</c><00:05:32.080><c> super</c><00:05:32.400><c> important</c><00:05:32.960><c> so</c> 00:05:33.110 --> 00:05:33.120 align:start position:0% but i think it was super important so 00:05:33.120 --> 00:05:38.340 align:start position:0% but i think it was super important so let's<00:05:33.360><c> get</c><00:05:36.840><c> started</c> 00:05:38.340 --> 00:05:38.350 align:start position:0% let's get started 00:05:38.350 --> 00:05:39.990 align:start position:0% let's get started [Music] 00:05:39.990 --> 00:05:40.000 align:start position:0% [Music] 00:05:40.000 --> 00:05:42.390 align:start position:0% [Music] hey<00:05:40.240><c> jan</c><00:05:40.479><c> here</c><00:05:40.840><c> codingthen.com</c><00:05:42.000><c> let's</c><00:05:42.240><c> get</c> 00:05:42.390 --> 00:05:42.400 align:start position:0% hey jan here codingthen.com let's get 00:05:42.400 --> 00:05:43.830 align:start position:0% hey jan here codingthen.com let's get straight<00:05:42.639><c> to</c><00:05:42.720><c> the</c><00:05:42.800><c> meta</c><00:05:43.120><c> at</c><00:05:43.199><c> hand</c> 00:05:43.830 --> 00:05:43.840 align:start position:0% straight to the meta at hand 00:05:43.840 --> 00:05:45.749 align:start position:0% straight to the meta at hand here's<00:05:44.080><c> the</c><00:05:44.240><c> infrastructure</c><00:05:45.199><c> of</c><00:05:45.360><c> what</c><00:05:45.520><c> we're</c> 00:05:45.749 --> 00:05:45.759 align:start position:0% here's the infrastructure of what we're 00:05:45.759 --> 00:05:47.590 align:start position:0% here's the infrastructure of what we're building<00:05:46.000><c> today</c><00:05:46.720><c> so</c><00:05:46.960><c> we're</c><00:05:47.120><c> going</c><00:05:47.280><c> to</c><00:05:47.360><c> have</c> 00:05:47.590 --> 00:05:47.600 align:start position:0% building today so we're going to have 00:05:47.600 --> 00:05:48.870 align:start position:0% building today so we're going to have the<00:05:47.759><c> shopify</c><00:05:48.320><c> site</c> 00:05:48.870 --> 00:05:48.880 align:start position:0% the shopify site 00:05:48.880 --> 00:05:51.189 align:start position:0% the shopify site we're<00:05:49.039><c> going</c><00:05:49.199><c> to</c><00:05:49.280><c> have</c><00:05:49.440><c> our</c><00:05:49.680><c> local</c><00:05:50.000><c> pc</c><00:05:50.880><c> and</c><00:05:51.039><c> we</c> 00:05:51.189 --> 00:05:51.199 align:start position:0% we're going to have our local pc and we 00:05:51.199 --> 00:05:52.150 align:start position:0% we're going to have our local pc and we will<00:05:51.280><c> have</c><00:05:51.440><c> a</c><00:05:51.520><c> dedicated</c> 00:05:52.150 --> 00:05:52.160 align:start position:0% will have a dedicated 00:05:52.160 --> 00:05:55.350 align:start position:0% will have a dedicated server<00:05:52.720><c> where</c><00:05:52.960><c> our</c><00:05:53.199><c> app</c><00:05:53.440><c> runs</c><00:05:54.320><c> so</c><00:05:54.800><c> for</c><00:05:54.960><c> example</c> 00:05:55.350 --> 00:05:55.360 align:start position:0% server where our app runs so for example 00:05:55.360 --> 00:05:56.150 align:start position:0% server where our app runs so for example this<00:05:55.520><c> could</c><00:05:55.759><c> be</c> 00:05:56.150 --> 00:05:56.160 align:start position:0% this could be 00:05:56.160 --> 00:05:59.029 align:start position:0% this could be myapp.com<00:05:57.440><c> and</c><00:05:57.600><c> yes</c><00:05:57.840><c> you</c><00:05:58.000><c> can</c><00:05:58.160><c> imagine</c><00:05:58.560><c> this</c> 00:05:59.029 --> 00:05:59.039 align:start position:0% myapp.com and yes you can imagine this 00:05:59.039 --> 00:06:01.029 align:start position:0% myapp.com and yes you can imagine this to<00:05:59.199><c> be</c><00:05:59.360><c> just</c><00:05:59.600><c> a</c><00:05:59.759><c> regular</c><00:06:00.080><c> website</c> 00:06:01.029 --> 00:06:01.039 align:start position:0% to be just a regular website 00:06:01.039 --> 00:06:03.110 align:start position:0% to be just a regular website and<00:06:01.199><c> the</c><00:06:01.360><c> only</c><00:06:01.600><c> thing</c><00:06:01.840><c> special</c><00:06:02.160><c> about</c><00:06:02.400><c> it</c><00:06:02.560><c> is</c> 00:06:03.110 --> 00:06:03.120 align:start position:0% and the only thing special about it is 00:06:03.120 --> 00:06:05.990 align:start position:0% and the only thing special about it is that<00:06:03.440><c> only</c><00:06:03.759><c> shopify</c><00:06:04.319><c> sites</c><00:06:04.639><c> can</c><00:06:04.880><c> log</c><00:06:05.120><c> in</c><00:06:05.199><c> here</c> 00:06:05.990 --> 00:06:06.000 align:start position:0% that only shopify sites can log in here 00:06:06.000 --> 00:06:08.390 align:start position:0% that only shopify sites can log in here and<00:06:06.160><c> once</c><00:06:06.400><c> they</c><00:06:06.639><c> do</c><00:06:06.800><c> so</c><00:06:07.440><c> they</c><00:06:07.600><c> get</c><00:06:07.840><c> to</c><00:06:08.000><c> their</c> 00:06:08.390 --> 00:06:08.400 align:start position:0% and once they do so they get to their 00:06:08.400 --> 00:06:09.990 align:start position:0% and once they do so they get to their dashboard<00:06:09.039><c> which</c><00:06:09.280><c> contains</c><00:06:09.680><c> all</c><00:06:09.919><c> the</c> 00:06:09.990 --> 00:06:10.000 align:start position:0% dashboard which contains all the 00:06:10.000 --> 00:06:11.749 align:start position:0% dashboard which contains all the functions<00:06:10.479><c> and</c><00:06:10.560><c> numbers</c><00:06:10.880><c> and</c><00:06:10.960><c> whatnot</c> 00:06:11.749 --> 00:06:11.759 align:start position:0% functions and numbers and whatnot 00:06:11.759 --> 00:06:13.590 align:start position:0% functions and numbers and whatnot and<00:06:11.919><c> even</c><00:06:12.160><c> though</c><00:06:12.479><c> this</c><00:06:12.720><c> might</c><00:06:12.960><c> look</c><00:06:13.199><c> similar</c> 00:06:13.590 --> 00:06:13.600 align:start position:0% and even though this might look similar 00:06:13.600 --> 00:06:15.510 align:start position:0% and even though this might look similar to<00:06:13.759><c> the</c><00:06:13.840><c> shopify</c><00:06:14.479><c> admin</c><00:06:14.800><c> dashboard</c> 00:06:15.510 --> 00:06:15.520 align:start position:0% to the shopify admin dashboard 00:06:15.520 --> 00:06:17.830 align:start position:0% to the shopify admin dashboard we<00:06:15.759><c> always</c><00:06:16.000><c> have</c><00:06:16.160><c> to</c><00:06:16.240><c> keep</c><00:06:16.479><c> in</c><00:06:16.560><c> mind</c><00:06:16.960><c> it's</c><00:06:17.199><c> not</c> 00:06:17.830 --> 00:06:17.840 align:start position:0% we always have to keep in mind it's not 00:06:17.840 --> 00:06:20.230 align:start position:0% we always have to keep in mind it's not it's<00:06:18.199><c> myapp.com</c><00:06:19.280><c> and</c><00:06:19.440><c> it's</c><00:06:19.600><c> a</c><00:06:19.680><c> completely</c> 00:06:20.230 --> 00:06:20.240 align:start position:0% it's myapp.com and it's a completely 00:06:20.240 --> 00:06:21.909 align:start position:0% it's myapp.com and it's a completely detached<00:06:20.880><c> website</c> 00:06:21.909 --> 00:06:21.919 align:start position:0% detached website 00:06:21.919 --> 00:06:24.710 align:start position:0% detached website and<00:06:22.080><c> it</c><00:06:22.240><c> only</c><00:06:22.560><c> looks</c><00:06:22.880><c> similar</c><00:06:23.600><c> to</c><00:06:24.160><c> create</c><00:06:24.560><c> this</c> 00:06:24.710 --> 00:06:24.720 align:start position:0% and it only looks similar to create this 00:06:24.720 --> 00:06:26.469 align:start position:0% and it only looks similar to create this cohesive<00:06:25.360><c> design</c><00:06:25.680><c> experience</c> 00:06:26.469 --> 00:06:26.479 align:start position:0% cohesive design experience 00:06:26.479 --> 00:06:28.950 align:start position:0% cohesive design experience and<00:06:26.560><c> like</c><00:06:26.800><c> the</c><00:06:26.880><c> best</c><00:06:27.199><c> user</c><00:06:27.520><c> experience</c><00:06:28.639><c> and</c> 00:06:28.950 --> 00:06:28.960 align:start position:0% and like the best user experience and 00:06:28.960 --> 00:06:30.790 align:start position:0% and like the best user experience and when<00:06:29.120><c> someone</c><00:06:29.440><c> goes</c><00:06:29.600><c> to</c><00:06:29.759><c> the</c><00:06:29.919><c> admin</c><00:06:30.240><c> dashboard</c> 00:06:30.790 --> 00:06:30.800 align:start position:0% when someone goes to the admin dashboard 00:06:30.800 --> 00:06:32.629 align:start position:0% when someone goes to the admin dashboard and<00:06:30.880><c> clicks</c><00:06:31.199><c> on</c><00:06:31.360><c> apps</c><00:06:31.759><c> and</c><00:06:31.840><c> then</c><00:06:32.080><c> opens</c><00:06:32.400><c> our</c> 00:06:32.629 --> 00:06:32.639 align:start position:0% and clicks on apps and then opens our 00:06:32.639 --> 00:06:33.670 align:start position:0% and clicks on apps and then opens our demo<00:06:33.039><c> app</c> 00:06:33.670 --> 00:06:33.680 align:start position:0% demo app 00:06:33.680 --> 00:06:35.909 align:start position:0% demo app what<00:06:33.919><c> really</c><00:06:34.160><c> happens</c><00:06:34.479><c> behind</c><00:06:34.800><c> the</c><00:06:34.960><c> scenes</c><00:06:35.360><c> is</c> 00:06:35.909 --> 00:06:35.919 align:start position:0% what really happens behind the scenes is 00:06:35.919 --> 00:06:38.150 align:start position:0% what really happens behind the scenes is all<00:06:36.240><c> this</c><00:06:36.479><c> authentication</c><00:06:37.280><c> process</c> 00:06:38.150 --> 00:06:38.160 align:start position:0% all this authentication process 00:06:38.160 --> 00:06:41.110 align:start position:0% all this authentication process and<00:06:38.240><c> then</c><00:06:38.400><c> shopify</c><00:06:39.039><c> just</c><00:06:39.440><c> embeds</c><00:06:40.080><c> our</c><00:06:40.319><c> website</c> 00:06:41.110 --> 00:06:41.120 align:start position:0% and then shopify just embeds our website 00:06:41.120 --> 00:06:42.390 align:start position:0% and then shopify just embeds our website myapp.com 00:06:42.390 --> 00:06:42.400 align:start position:0% myapp.com 00:06:42.400 --> 00:06:45.430 align:start position:0% myapp.com into<00:06:42.800><c> their</c><00:06:43.039><c> website</c><00:06:44.000><c> with</c><00:06:44.240><c> an</c><00:06:44.400><c> iframe</c> 00:06:45.430 --> 00:06:45.440 align:start position:0% into their website with an iframe 00:06:45.440 --> 00:06:47.990 align:start position:0% into their website with an iframe so<00:06:45.680><c> they</c><00:06:45.919><c> just</c><00:06:46.160><c> display</c><00:06:46.639><c> our</c><00:06:46.880><c> website</c><00:06:47.520><c> inside</c> 00:06:47.990 --> 00:06:48.000 align:start position:0% so they just display our website inside 00:06:48.000 --> 00:06:49.110 align:start position:0% so they just display our website inside their<00:06:48.240><c> website</c> 00:06:49.110 --> 00:06:49.120 align:start position:0% their website 00:06:49.120 --> 00:06:51.270 align:start position:0% their website and<00:06:49.199><c> that</c><00:06:49.440><c> way</c><00:06:49.759><c> as</c><00:06:49.919><c> a</c><00:06:50.000><c> user</c><00:06:50.560><c> we</c><00:06:50.720><c> can</c><00:06:50.880><c> kind</c><00:06:51.120><c> of</c> 00:06:51.270 --> 00:06:51.280 align:start position:0% and that way as a user we can kind of 00:06:51.280 --> 00:06:52.230 align:start position:0% and that way as a user we can kind of interact<00:06:51.599><c> with</c><00:06:51.759><c> both</c> 00:06:52.230 --> 00:06:52.240 align:start position:0% interact with both 00:06:52.240 --> 00:06:53.830 align:start position:0% interact with both and<00:06:52.400><c> we</c><00:06:52.560><c> will</c><00:06:52.720><c> get</c><00:06:52.880><c> more</c><00:06:53.120><c> into</c><00:06:53.360><c> the</c><00:06:53.440><c> technical</c> 00:06:53.830 --> 00:06:53.840 align:start position:0% and we will get more into the technical 00:06:53.840 --> 00:06:55.909 align:start position:0% and we will get more into the technical details<00:06:54.639><c> but</c><00:06:54.880><c> for</c><00:06:55.039><c> now</c><00:06:55.280><c> this</c><00:06:55.440><c> will</c><00:06:55.599><c> be</c><00:06:55.759><c> good</c> 00:06:55.909 --> 00:06:55.919 align:start position:0% details but for now this will be good 00:06:55.919 --> 00:06:57.270 align:start position:0% details but for now this will be good enough<00:06:56.240><c> to</c><00:06:56.319><c> get</c><00:06:56.479><c> started</c> 00:06:57.270 --> 00:06:57.280 align:start position:0% enough to get started 00:06:57.280 --> 00:06:59.110 align:start position:0% enough to get started okay<00:06:57.599><c> now</c><00:06:57.759><c> besides</c><00:06:58.240><c> that</c><00:06:58.479><c> we</c><00:06:58.639><c> also</c><00:06:58.880><c> need</c><00:06:59.039><c> to</c> 00:06:59.110 --> 00:06:59.120 align:start position:0% okay now besides that we also need to 00:06:59.120 --> 00:07:01.270 align:start position:0% okay now besides that we also need to prepare<00:06:59.599><c> a</c><00:06:59.680><c> couple</c><00:06:59.919><c> of</c><00:07:00.000><c> things</c><00:07:00.240><c> in</c><00:07:00.319><c> advance</c> 00:07:01.270 --> 00:07:01.280 align:start position:0% prepare a couple of things in advance 00:07:01.280 --> 00:07:03.189 align:start position:0% prepare a couple of things in advance and<00:07:01.520><c> one</c><00:07:01.759><c> thing</c><00:07:02.000><c> is</c><00:07:02.160><c> your</c><00:07:02.319><c> shopify</c><00:07:02.800><c> partner</c> 00:07:03.189 --> 00:07:03.199 align:start position:0% and one thing is your shopify partner 00:07:03.199 --> 00:07:04.469 align:start position:0% and one thing is your shopify partner account<00:07:03.759><c> you</c><00:07:03.919><c> can</c><00:07:04.080><c> sign</c> 00:07:04.469 --> 00:07:04.479 align:start position:0% account you can sign 00:07:04.479 --> 00:07:06.550 align:start position:0% account you can sign up<00:07:04.720><c> for</c><00:07:04.960><c> free</c><00:07:05.680><c> and</c><00:07:05.759><c> then</c><00:07:05.919><c> you</c><00:07:06.080><c> also</c><00:07:06.319><c> want</c><00:07:06.479><c> to</c> 00:07:06.550 --> 00:07:06.560 align:start position:0% up for free and then you also want to 00:07:06.560 --> 00:07:07.510 align:start position:0% up for free and then you also want to create 00:07:07.510 --> 00:07:07.520 align:start position:0% create 00:07:07.520 --> 00:07:09.830 align:start position:0% create a<00:07:07.680><c> development</c><00:07:08.240><c> store</c><00:07:09.039><c> that's</c><00:07:09.360><c> a</c><00:07:09.440><c> store</c><00:07:09.680><c> where</c> 00:07:09.830 --> 00:07:09.840 align:start position:0% a development store that's a store where 00:07:09.840 --> 00:07:10.950 align:start position:0% a development store that's a store where you<00:07:10.000><c> can</c><00:07:10.080><c> test</c><00:07:10.400><c> your</c><00:07:10.560><c> app</c> 00:07:10.950 --> 00:07:10.960 align:start position:0% you can test your app 00:07:10.960 --> 00:07:13.270 align:start position:0% you can test your app mine<00:07:11.199><c> is</c><00:07:11.360><c> called</c><00:07:11.759><c> how</c><00:07:11.919><c> to</c><00:07:12.080><c> write</c><00:07:12.240><c> an</c><00:07:12.479><c> app</c><00:07:13.039><c> and</c> 00:07:13.270 --> 00:07:13.280 align:start position:0% mine is called how to write an app and 00:07:13.280 --> 00:07:14.309 align:start position:0% mine is called how to write an app and as<00:07:13.440><c> you</c><00:07:13.520><c> can</c><00:07:13.759><c> see</c> 00:07:14.309 --> 00:07:14.319 align:start position:0% as you can see 00:07:14.319 --> 00:07:15.990 align:start position:0% as you can see i<00:07:14.720><c> currently</c><00:07:15.039><c> don't</c><00:07:15.280><c> have</c><00:07:15.440><c> any</c><00:07:15.680><c> apps</c> 00:07:15.990 --> 00:07:16.000 align:start position:0% i currently don't have any apps 00:07:16.000 --> 00:07:18.150 align:start position:0% i currently don't have any apps installed<00:07:17.280><c> and</c><00:07:17.360><c> then</c><00:07:17.520><c> the</c><00:07:17.680><c> last</c><00:07:17.919><c> thing</c><00:07:18.080><c> we're</c> 00:07:18.150 --> 00:07:18.160 align:start position:0% installed and then the last thing we're 00:07:18.160 --> 00:07:18.870 align:start position:0% installed and then the last thing we're going<00:07:18.319><c> to</c><00:07:18.400><c> need</c> 00:07:18.870 --> 00:07:18.880 align:start position:0% going to need 00:07:18.880 --> 00:07:21.589 align:start position:0% going to need is<00:07:19.199><c> the</c><00:07:19.360><c> shopify</c><00:07:20.080><c> app</c><00:07:20.319><c> cli</c><00:07:21.280><c> that's</c><00:07:21.520><c> an</c> 00:07:21.589 --> 00:07:21.599 align:start position:0% is the shopify app cli that's an 00:07:21.599 --> 00:07:23.350 align:start position:0% is the shopify app cli that's an additional<00:07:22.000><c> piece</c><00:07:22.240><c> of</c><00:07:22.400><c> software</c> 00:07:23.350 --> 00:07:23.360 align:start position:0% additional piece of software 00:07:23.360 --> 00:07:25.110 align:start position:0% additional piece of software that<00:07:23.520><c> helps</c><00:07:23.840><c> to</c><00:07:24.080><c> prototype</c><00:07:24.639><c> these</c><00:07:24.800><c> kinds</c><00:07:24.960><c> of</c> 00:07:25.110 --> 00:07:25.120 align:start position:0% that helps to prototype these kinds of 00:07:25.120 --> 00:07:27.029 align:start position:0% that helps to prototype these kinds of apps<00:07:25.919><c> and</c><00:07:26.080><c> here</c><00:07:26.240><c> you</c><00:07:26.319><c> can</c><00:07:26.560><c> find</c><00:07:26.880><c> the</c> 00:07:27.029 --> 00:07:27.039 align:start position:0% apps and here you can find the 00:07:27.039 --> 00:07:28.309 align:start position:0% apps and here you can find the installation<00:07:27.599><c> process</c><00:07:28.080><c> and</c><00:07:28.240><c> the</c> 00:07:28.309 --> 00:07:28.319 align:start position:0% installation process and the 00:07:28.319 --> 00:07:29.350 align:start position:0% installation process and the requirements 00:07:29.350 --> 00:07:29.360 align:start position:0% requirements 00:07:29.360 --> 00:07:31.189 align:start position:0% requirements so<00:07:29.520><c> for</c><00:07:29.680><c> example</c><00:07:30.240><c> you</c><00:07:30.400><c> need</c><00:07:30.560><c> to</c><00:07:30.639><c> have</c><00:07:30.880><c> ruby</c> 00:07:31.189 --> 00:07:31.199 align:start position:0% so for example you need to have ruby 00:07:31.199 --> 00:07:32.790 align:start position:0% so for example you need to have ruby installed<00:07:31.599><c> on</c><00:07:31.680><c> your</c><00:07:31.840><c> pc</c> 00:07:32.790 --> 00:07:32.800 align:start position:0% installed on your pc 00:07:32.800 --> 00:07:34.550 align:start position:0% installed on your pc and<00:07:32.960><c> don't</c><00:07:33.199><c> get</c><00:07:33.360><c> confused</c><00:07:33.840><c> here</c><00:07:34.080><c> we</c><00:07:34.240><c> are</c><00:07:34.319><c> not</c> 00:07:34.550 --> 00:07:34.560 align:start position:0% and don't get confused here we are not 00:07:34.560 --> 00:07:36.150 align:start position:0% and don't get confused here we are not building<00:07:34.800><c> a</c><00:07:34.880><c> ruby</c><00:07:35.199><c> on</c><00:07:35.280><c> rails</c><00:07:35.680><c> app</c> 00:07:36.150 --> 00:07:36.160 align:start position:0% building a ruby on rails app 00:07:36.160 --> 00:07:38.710 align:start position:0% building a ruby on rails app we<00:07:36.319><c> are</c><00:07:36.400><c> building</c><00:07:36.720><c> a</c><00:07:36.880><c> node.js</c><00:07:37.599><c> and</c><00:07:37.680><c> react</c><00:07:38.160><c> app</c> 00:07:38.710 --> 00:07:38.720 align:start position:0% we are building a node.js and react app 00:07:38.720 --> 00:07:41.029 align:start position:0% we are building a node.js and react app but<00:07:38.960><c> the</c><00:07:39.120><c> app</c><00:07:39.280><c> cli</c><00:07:39.840><c> is</c><00:07:39.919><c> just</c><00:07:40.160><c> built</c><00:07:40.400><c> on</c><00:07:40.560><c> ruby</c> 00:07:41.029 --> 00:07:41.039 align:start position:0% but the app cli is just built on ruby 00:07:41.039 --> 00:07:43.029 align:start position:0% but the app cli is just built on ruby so<00:07:41.280><c> in</c><00:07:41.440><c> order</c><00:07:41.599><c> for</c><00:07:41.840><c> us</c><00:07:41.919><c> to</c><00:07:42.080><c> use</c><00:07:42.319><c> that</c><00:07:42.639><c> we</c><00:07:42.800><c> gotta</c> 00:07:43.029 --> 00:07:43.039 align:start position:0% so in order for us to use that we gotta 00:07:43.039 --> 00:07:44.469 align:start position:0% so in order for us to use that we gotta have<00:07:43.199><c> ruby</c><00:07:43.599><c> installed</c> 00:07:44.469 --> 00:07:44.479 align:start position:0% have ruby installed 00:07:44.479 --> 00:07:45.909 align:start position:0% have ruby installed and<00:07:44.639><c> then</c><00:07:44.800><c> you</c><00:07:44.879><c> can</c><00:07:45.039><c> just</c><00:07:45.280><c> follow</c><00:07:45.759><c> the</c> 00:07:45.909 --> 00:07:45.919 align:start position:0% and then you can just follow the 00:07:45.919 --> 00:07:48.390 align:start position:0% and then you can just follow the installation<00:07:46.479><c> process</c><00:07:47.280><c> for</c><00:07:47.680><c> your</c><00:07:47.919><c> operating</c> 00:07:48.390 --> 00:07:48.400 align:start position:0% installation process for your operating 00:07:48.400 --> 00:07:49.110 align:start position:0% installation process for your operating system 00:07:49.110 --> 00:07:49.120 align:start position:0% system 00:07:49.120 --> 00:07:50.230 align:start position:0% system and<00:07:49.280><c> just</c><00:07:49.520><c> like</c><00:07:49.680><c> with</c><00:07:49.840><c> every</c><00:07:50.080><c> other</c> 00:07:50.230 --> 00:07:50.240 align:start position:0% and just like with every other 00:07:50.240 --> 00:07:51.749 align:start position:0% and just like with every other installation<00:07:50.879><c> there</c><00:07:51.120><c> are</c><00:07:51.199><c> certain</c><00:07:51.520><c> things</c> 00:07:51.749 --> 00:07:51.759 align:start position:0% installation there are certain things 00:07:51.759 --> 00:07:52.790 align:start position:0% installation there are certain things that<00:07:51.919><c> can</c><00:07:52.160><c> go</c><00:07:52.319><c> wrong</c> 00:07:52.790 --> 00:07:52.800 align:start position:0% that can go wrong 00:07:52.800 --> 00:07:55.350 align:start position:0% that can go wrong certain<00:07:53.199><c> warnings</c><00:07:53.840><c> certain</c><00:07:54.240><c> error</c><00:07:54.479><c> messages</c> 00:07:55.350 --> 00:07:55.360 align:start position:0% certain warnings certain error messages 00:07:55.360 --> 00:07:57.029 align:start position:0% certain warnings certain error messages but<00:07:55.520><c> then</c><00:07:55.680><c> you</c><00:07:55.759><c> would</c><00:07:55.919><c> just</c><00:07:56.160><c> have</c><00:07:56.319><c> to</c><00:07:56.479><c> research</c> 00:07:57.029 --> 00:07:57.039 align:start position:0% but then you would just have to research 00:07:57.039 --> 00:07:57.510 align:start position:0% but then you would just have to research these 00:07:57.510 --> 00:07:57.520 align:start position:0% these 00:07:57.520 --> 00:07:59.189 align:start position:0% these because<00:07:57.840><c> with</c><00:07:58.080><c> every</c><00:07:58.319><c> project</c><00:07:58.879><c> there's</c><00:07:59.120><c> a</c> 00:07:59.189 --> 00:07:59.199 align:start position:0% because with every project there's a 00:07:59.199 --> 00:08:01.189 align:start position:0% because with every project there's a certain<00:07:59.520><c> amount</c><00:07:59.759><c> of</c><00:07:59.919><c> research</c><00:08:00.400><c> involved</c> 00:08:01.189 --> 00:08:01.199 align:start position:0% certain amount of research involved 00:08:01.199 --> 00:08:03.510 align:start position:0% certain amount of research involved and<00:08:01.360><c> you</c><00:08:01.520><c> really</c><00:08:01.759><c> have</c><00:08:01.919><c> to</c><00:08:02.000><c> get</c><00:08:02.240><c> into</c><00:08:02.479><c> this</c> 00:08:03.510 --> 00:08:03.520 align:start position:0% and you really have to get into this 00:08:03.520 --> 00:08:04.710 align:start position:0% and you really have to get into this problem-solving 00:08:04.710 --> 00:08:04.720 align:start position:0% problem-solving 00:08:04.720 --> 00:08:06.629 align:start position:0% problem-solving engineering<00:08:05.280><c> type</c><00:08:05.440><c> of</c><00:08:05.599><c> mindset</c><00:08:06.160><c> that's</c><00:08:06.319><c> super</c> 00:08:06.629 --> 00:08:06.639 align:start position:0% engineering type of mindset that's super 00:08:06.639 --> 00:08:08.790 align:start position:0% engineering type of mindset that's super important<00:08:07.440><c> or</c><00:08:07.840><c> actually</c><00:08:08.160><c> it's</c><00:08:08.319><c> a</c><00:08:08.400><c> minimum</c> 00:08:08.790 --> 00:08:08.800 align:start position:0% important or actually it's a minimum 00:08:08.800 --> 00:08:09.990 align:start position:0% important or actually it's a minimum requirement 00:08:09.990 --> 00:08:10.000 align:start position:0% requirement 00:08:10.000 --> 00:08:11.029 align:start position:0% requirement and<00:08:10.080><c> then</c><00:08:10.240><c> you're</c><00:08:10.319><c> also</c><00:08:10.560><c> going</c><00:08:10.639><c> to</c><00:08:10.720><c> need</c><00:08:10.960><c> a</c> 00:08:11.029 --> 00:08:11.039 align:start position:0% and then you're also going to need a 00:08:11.039 --> 00:08:12.950 align:start position:0% and then you're also going to need a local<00:08:11.360><c> code</c><00:08:11.599><c> editor</c><00:08:12.160><c> you</c><00:08:12.319><c> can</c><00:08:12.560><c> use</c><00:08:12.800><c> pretty</c> 00:08:12.950 --> 00:08:12.960 align:start position:0% local code editor you can use pretty 00:08:12.960 --> 00:08:15.270 align:start position:0% local code editor you can use pretty much<00:08:13.199><c> anything</c><00:08:13.599><c> except</c><00:08:14.000><c> windows</c><00:08:14.400><c> notepad</c> 00:08:15.270 --> 00:08:15.280 align:start position:0% much anything except windows notepad 00:08:15.280 --> 00:08:17.510 align:start position:0% much anything except windows notepad so<00:08:15.520><c> i'm</c><00:08:15.680><c> using</c><00:08:16.000><c> visual</c><00:08:16.319><c> studio</c><00:08:16.639><c> code</c><00:08:17.120><c> which</c><00:08:17.360><c> is</c> 00:08:17.510 --> 00:08:17.520 align:start position:0% so i'm using visual studio code which is 00:08:17.520 --> 00:08:19.430 align:start position:0% so i'm using visual studio code which is pretty<00:08:17.680><c> much</c><00:08:17.919><c> industry</c><00:08:18.400><c> standard</c> 00:08:19.430 --> 00:08:19.440 align:start position:0% pretty much industry standard 00:08:19.440 --> 00:08:21.350 align:start position:0% pretty much industry standard okay<00:08:19.680><c> so</c><00:08:19.840><c> now</c><00:08:20.000><c> with</c><00:08:20.160><c> all</c><00:08:20.319><c> of</c><00:08:20.400><c> that</c><00:08:20.639><c> in</c><00:08:20.800><c> place</c><00:08:21.199><c> i</c> 00:08:21.350 --> 00:08:21.360 align:start position:0% okay so now with all of that in place i 00:08:21.360 --> 00:08:23.670 align:start position:0% okay so now with all of that in place i have<00:08:21.520><c> a</c><00:08:21.599><c> new</c><00:08:21.840><c> folder</c><00:08:22.319><c> on</c><00:08:22.479><c> my</c><00:08:22.720><c> desktop</c> 00:08:23.670 --> 00:08:23.680 align:start position:0% have a new folder on my desktop 00:08:23.680 --> 00:08:25.350 align:start position:0% have a new folder on my desktop and<00:08:23.759><c> now</c><00:08:23.919><c> i'm</c><00:08:24.000><c> gonna</c><00:08:24.240><c> open</c><00:08:24.479><c> that</c><00:08:24.800><c> with</c><00:08:25.039><c> visual</c> 00:08:25.350 --> 00:08:25.360 align:start position:0% and now i'm gonna open that with visual 00:08:25.360 --> 00:08:27.830 align:start position:0% and now i'm gonna open that with visual studio<00:08:25.680><c> code</c><00:08:26.560><c> this</c><00:08:26.720><c> has</c><00:08:26.879><c> the</c><00:08:26.960><c> main</c><00:08:27.199><c> benefit</c> 00:08:27.830 --> 00:08:27.840 align:start position:0% studio code this has the main benefit 00:08:27.840 --> 00:08:30.150 align:start position:0% studio code this has the main benefit that<00:08:28.080><c> as</c><00:08:28.319><c> soon</c><00:08:28.560><c> as</c><00:08:28.720><c> i</c><00:08:28.800><c> bring</c><00:08:28.960><c> up</c><00:08:29.039><c> the</c><00:08:29.199><c> terminal</c> 00:08:30.150 --> 00:08:30.160 align:start position:0% that as soon as i bring up the terminal 00:08:30.160 --> 00:08:32.389 align:start position:0% that as soon as i bring up the terminal the<00:08:30.400><c> working</c><00:08:30.720><c> directory</c><00:08:31.440><c> will</c><00:08:31.680><c> be</c><00:08:31.840><c> set</c><00:08:32.080><c> to</c><00:08:32.240><c> my</c> 00:08:32.389 --> 00:08:32.399 align:start position:0% the working directory will be set to my 00:08:32.399 --> 00:08:33.589 align:start position:0% the working directory will be set to my new<00:08:32.640><c> folder</c> 00:08:33.589 --> 00:08:33.599 align:start position:0% new folder 00:08:33.599 --> 00:08:34.790 align:start position:0% new folder so<00:08:33.760><c> let</c><00:08:33.919><c> me</c><00:08:34.000><c> show</c><00:08:34.159><c> you</c><00:08:34.240><c> that</c><00:08:34.479><c> so</c><00:08:34.640><c> you</c><00:08:34.719><c> could</c> 00:08:34.790 --> 00:08:34.800 align:start position:0% so let me show you that so you could 00:08:34.800 --> 00:08:37.110 align:start position:0% so let me show you that so you could either<00:08:35.039><c> hit</c><00:08:35.279><c> ctrl</c><00:08:35.760><c> shift</c><00:08:36.159><c> and</c><00:08:36.399><c> p</c> 00:08:37.110 --> 00:08:37.120 align:start position:0% either hit ctrl shift and p 00:08:37.120 --> 00:08:38.389 align:start position:0% either hit ctrl shift and p or<00:08:37.279><c> you</c><00:08:37.360><c> could</c><00:08:37.519><c> also</c><00:08:37.760><c> click</c><00:08:37.919><c> on</c><00:08:38.000><c> this</c><00:08:38.159><c> little</c> 00:08:38.389 --> 00:08:38.399 align:start position:0% or you could also click on this little 00:08:38.399 --> 00:08:40.709 align:start position:0% or you could also click on this little gear<00:08:38.719><c> icon</c><00:08:39.279><c> command</c><00:08:39.760><c> palette</c> 00:08:40.709 --> 00:08:40.719 align:start position:0% gear icon command palette 00:08:40.719 --> 00:08:43.029 align:start position:0% gear icon command palette and<00:08:40.800><c> then</c><00:08:40.959><c> i</c><00:08:41.039><c> want</c><00:08:41.200><c> to</c><00:08:41.279><c> view</c><00:08:42.159><c> the</c><00:08:42.479><c> integrated</c> 00:08:43.029 --> 00:08:43.039 align:start position:0% and then i want to view the integrated 00:08:43.039 --> 00:08:44.550 align:start position:0% and then i want to view the integrated terminal 00:08:44.550 --> 00:08:44.560 align:start position:0% terminal 00:08:44.560 --> 00:08:46.710 align:start position:0% terminal so<00:08:44.720><c> you</c><00:08:44.880><c> can</c><00:08:45.040><c> see</c><00:08:45.279><c> my</c><00:08:45.680><c> working</c><00:08:46.000><c> directory</c><00:08:46.640><c> is</c> 00:08:46.710 --> 00:08:46.720 align:start position:0% so you can see my working directory is 00:08:46.720 --> 00:08:49.030 align:start position:0% so you can see my working directory is set<00:08:46.959><c> to</c><00:08:47.200><c> desktop</c><00:08:47.760><c> slash</c><00:08:48.080><c> app</c> 00:08:49.030 --> 00:08:49.040 align:start position:0% set to desktop slash app 00:08:49.040 --> 00:08:50.790 align:start position:0% set to desktop slash app and<00:08:49.120><c> then</c><00:08:49.360><c> as</c><00:08:49.519><c> a</c><00:08:49.600><c> first</c><00:08:49.920><c> command</c><00:08:50.399><c> we</c><00:08:50.560><c> want</c><00:08:50.720><c> to</c> 00:08:50.790 --> 00:08:50.800 align:start position:0% and then as a first command we want to 00:08:50.800 --> 00:08:52.829 align:start position:0% and then as a first command we want to type<00:08:51.200><c> shopify</c> 00:08:52.829 --> 00:08:52.839 align:start position:0% type shopify 00:08:52.839 --> 00:08:57.190 align:start position:0% type shopify create<00:08:54.000><c> we</c><00:08:54.160><c> want</c><00:08:54.320><c> to</c><00:08:54.399><c> build</c><00:08:54.640><c> a</c><00:08:54.720><c> node.js</c><00:08:55.519><c> app</c> 00:08:57.190 --> 00:08:57.200 align:start position:0% create we want to build a node.js app 00:08:57.200 --> 00:08:58.949 align:start position:0% create we want to build a node.js app now<00:08:57.360><c> we</c><00:08:57.440><c> have</c><00:08:57.600><c> to</c><00:08:57.760><c> enter</c><00:08:58.080><c> an</c><00:08:58.320><c> app</c><00:08:58.560><c> name</c><00:08:58.800><c> so</c> 00:08:58.949 --> 00:08:58.959 align:start position:0% now we have to enter an app name so 00:08:58.959 --> 00:09:00.710 align:start position:0% now we have to enter an app name so maybe<00:08:59.200><c> we</c><00:08:59.279><c> could</c><00:08:59.440><c> just</c><00:08:59.680><c> go</c><00:08:59.839><c> with</c><00:09:00.000><c> demo</c><00:09:00.320><c> app</c><00:09:00.560><c> for</c> 00:09:00.710 --> 00:09:00.720 align:start position:0% maybe we could just go with demo app for 00:09:00.720 --> 00:09:02.389 align:start position:0% maybe we could just go with demo app for now 00:09:02.389 --> 00:09:02.399 align:start position:0% now 00:09:02.399 --> 00:09:03.910 align:start position:0% now you<00:09:02.560><c> can</c><00:09:02.720><c> decide</c><00:09:03.120><c> whether</c><00:09:03.360><c> you</c><00:09:03.440><c> want</c><00:09:03.600><c> to</c><00:09:03.680><c> build</c> 00:09:03.910 --> 00:09:03.920 align:start position:0% you can decide whether you want to build 00:09:03.920 --> 00:09:05.590 align:start position:0% you can decide whether you want to build a<00:09:04.000><c> custom</c><00:09:04.480><c> or</c><00:09:04.720><c> public</c><00:09:05.120><c> app</c> 00:09:05.590 --> 00:09:05.600 align:start position:0% a custom or public app 00:09:05.600 --> 00:09:09.030 align:start position:0% a custom or public app we<00:09:05.760><c> will</c><00:09:05.920><c> go</c><00:09:06.080><c> with</c><00:09:06.240><c> public</c><00:09:06.839><c> app</c> 00:09:09.030 --> 00:09:09.040 align:start position:0% we will go with public app 00:09:09.040 --> 00:09:11.269 align:start position:0% we will go with public app now<00:09:09.200><c> it</c><00:09:09.279><c> gives</c><00:09:09.440><c> you</c><00:09:09.600><c> this</c><00:09:09.760><c> url</c><00:09:10.320><c> to</c><00:09:10.560><c> authorize</c> 00:09:11.269 --> 00:09:11.279 align:start position:0% now it gives you this url to authorize 00:09:11.279 --> 00:09:12.630 align:start position:0% now it gives you this url to authorize with<00:09:11.440><c> your</c><00:09:11.600><c> partner</c><00:09:12.000><c> account</c><00:09:12.320><c> so</c><00:09:12.480><c> let's</c> 00:09:12.630 --> 00:09:12.640 align:start position:0% with your partner account so let's 00:09:12.640 --> 00:09:14.550 align:start position:0% with your partner account so let's follow<00:09:12.959><c> that</c> 00:09:14.550 --> 00:09:14.560 align:start position:0% follow that 00:09:14.560 --> 00:09:16.150 align:start position:0% follow that so<00:09:14.720><c> now</c><00:09:14.880><c> i</c><00:09:15.040><c> just</c><00:09:15.200><c> log</c><00:09:15.440><c> into</c><00:09:15.680><c> my</c><00:09:15.760><c> partner</c> 00:09:16.150 --> 00:09:16.160 align:start position:0% so now i just log into my partner 00:09:16.160 --> 00:09:17.590 align:start position:0% so now i just log into my partner account 00:09:17.590 --> 00:09:17.600 align:start position:0% account 00:09:17.600 --> 00:09:19.190 align:start position:0% account authenticated<00:09:18.320><c> successful</c><00:09:18.800><c> we</c><00:09:18.959><c> can</c><00:09:19.040><c> now</c> 00:09:19.190 --> 00:09:19.200 align:start position:0% authenticated successful we can now 00:09:19.200 --> 00:09:21.750 align:start position:0% authenticated successful we can now close<00:09:19.519><c> this</c><00:09:19.680><c> page</c><00:09:20.399><c> let's</c><00:09:20.640><c> do</c><00:09:20.880><c> it</c> 00:09:21.750 --> 00:09:21.760 align:start position:0% close this page let's do it 00:09:21.760 --> 00:09:23.190 align:start position:0% close this page let's do it and<00:09:21.839><c> then</c><00:09:22.000><c> you</c><00:09:22.080><c> can</c><00:09:22.240><c> select</c><00:09:22.560><c> the</c><00:09:22.800><c> specific</c> 00:09:23.190 --> 00:09:23.200 align:start position:0% and then you can select the specific 00:09:23.200 --> 00:09:24.630 align:start position:0% and then you can select the specific partner<00:09:23.519><c> account</c><00:09:23.839><c> because</c><00:09:24.080><c> i</c><00:09:24.160><c> have</c><00:09:24.320><c> two</c><00:09:24.560><c> in</c> 00:09:24.630 --> 00:09:24.640 align:start position:0% partner account because i have two in 00:09:24.640 --> 00:09:25.110 align:start position:0% partner account because i have two in here 00:09:25.110 --> 00:09:25.120 align:start position:0% here 00:09:25.120 --> 00:09:26.790 align:start position:0% here so<00:09:25.360><c> for</c><00:09:25.519><c> all</c><00:09:25.680><c> the</c><00:09:25.760><c> youtube</c><00:09:26.080><c> videos</c><00:09:26.399><c> it</c><00:09:26.480><c> will</c><00:09:26.640><c> be</c> 00:09:26.790 --> 00:09:26.800 align:start position:0% so for all the youtube videos it will be 00:09:26.800 --> 00:09:28.630 align:start position:0% so for all the youtube videos it will be coding<00:09:27.040><c> with</c><00:09:27.279><c> yun</c><00:09:28.000><c> and</c><00:09:28.160><c> then</c><00:09:28.320><c> you</c><00:09:28.399><c> want</c><00:09:28.560><c> to</c> 00:09:28.630 --> 00:09:28.640 align:start position:0% coding with yun and then you want to 00:09:28.640 --> 00:09:29.750 align:start position:0% coding with yun and then you want to select<00:09:28.880><c> the</c><00:09:29.040><c> demo</c><00:09:29.360><c> store</c> 00:09:29.750 --> 00:09:29.760 align:start position:0% select the demo store 00:09:29.760 --> 00:09:31.710 align:start position:0% select the demo store so<00:09:29.920><c> for</c><00:09:30.080><c> me</c><00:09:30.240><c> that's</c><00:09:30.480><c> how</c><00:09:30.640><c> to</c><00:09:30.800><c> write</c><00:09:31.040><c> an</c> 00:09:31.710 --> 00:09:31.720 align:start position:0% so for me that's how to write an 00:09:31.720 --> 00:09:33.829 align:start position:0% so for me that's how to write an app.myshopify.com 00:09:33.829 --> 00:09:33.839 align:start position:0% app.myshopify.com 00:09:33.839 --> 00:09:35.190 align:start position:0% app.myshopify.com and<00:09:33.920><c> now</c><00:09:34.080><c> we</c><00:09:34.240><c> just</c><00:09:34.320><c> have</c><00:09:34.480><c> to</c><00:09:34.560><c> wait</c><00:09:34.800><c> for</c><00:09:34.959><c> all</c><00:09:35.120><c> of</c> 00:09:35.190 --> 00:09:35.200 align:start position:0% and now we just have to wait for all of 00:09:35.200 --> 00:09:36.949 align:start position:0% and now we just have to wait for all of that<00:09:35.360><c> to</c><00:09:35.519><c> finish</c><00:09:35.920><c> can</c><00:09:36.080><c> take</c><00:09:36.240><c> a</c><00:09:36.320><c> couple</c><00:09:36.640><c> seconds</c> 00:09:36.949 --> 00:09:36.959 align:start position:0% that to finish can take a couple seconds 00:09:36.959 --> 00:09:37.990 align:start position:0% that to finish can take a couple seconds or<00:09:37.120><c> even</c><00:09:37.360><c> minutes</c> 00:09:37.990 --> 00:09:38.000 align:start position:0% or even minutes 00:09:38.000 --> 00:09:41.030 align:start position:0% or even minutes so<00:09:38.480><c> i'll</c><00:09:38.720><c> see</c><00:09:38.800><c> you</c><00:09:38.959><c> then</c><00:09:40.240><c> and</c><00:09:40.399><c> now</c><00:09:40.640><c> it</c><00:09:40.720><c> already</c> 00:09:41.030 --> 00:09:41.040 align:start position:0% so i'll see you then and now it already 00:09:41.040 --> 00:09:42.710 align:start position:0% so i'll see you then and now it already registered<00:09:41.600><c> the</c><00:09:41.839><c> app</c> 00:09:42.710 --> 00:09:42.720 align:start position:0% registered the app 00:09:42.720 --> 00:09:44.630 align:start position:0% registered the app inside<00:09:43.120><c> our</c><00:09:43.360><c> partner</c><00:09:43.680><c> dashboard</c><00:09:44.160><c> but</c><00:09:44.399><c> not</c> 00:09:44.630 --> 00:09:44.640 align:start position:0% inside our partner dashboard but not 00:09:44.640 --> 00:09:46.710 align:start position:0% inside our partner dashboard but not inside<00:09:45.040><c> our</c><00:09:45.279><c> development</c><00:09:45.760><c> store</c><00:09:46.080><c> yet</c> 00:09:46.710 --> 00:09:46.720 align:start position:0% inside our development store yet 00:09:46.720 --> 00:09:48.710 align:start position:0% inside our development store yet so<00:09:46.880><c> what</c><00:09:47.120><c> i</c><00:09:47.200><c> want</c><00:09:47.279><c> to</c><00:09:47.360><c> do</c><00:09:47.519><c> next</c><00:09:48.000><c> is</c><00:09:48.240><c> type</c> 00:09:48.710 --> 00:09:48.720 align:start position:0% so what i want to do next is type 00:09:48.720 --> 00:09:51.590 align:start position:0% so what i want to do next is type shopify<00:09:49.360><c> serve</c> 00:09:51.590 --> 00:09:51.600 align:start position:0% shopify serve 00:09:51.600 --> 00:10:01.670 align:start position:0% shopify serve that<00:09:51.839><c> brings</c><00:09:52.160><c> up</c> 00:10:01.670 --> 00:10:01.680 align:start position:0% 00:10:01.680 --> 00:10:03.509 align:start position:0% ah<00:10:01.920><c> sorry</c><00:10:02.240><c> we</c><00:10:02.399><c> have</c><00:10:02.560><c> to</c><00:10:02.640><c> navigate</c><00:10:03.120><c> into</c><00:10:03.360><c> our</c> 00:10:03.509 --> 00:10:03.519 align:start position:0% ah sorry we have to navigate into our 00:10:03.519 --> 00:10:04.949 align:start position:0% ah sorry we have to navigate into our demo<00:10:03.839><c> app</c><00:10:04.000><c> folder</c><00:10:04.399><c> first</c> 00:10:04.949 --> 00:10:04.959 align:start position:0% demo app folder first 00:10:04.959 --> 00:10:09.430 align:start position:0% demo app folder first so<00:10:05.760><c> let's</c><00:10:06.079><c> do</c><00:10:06.320><c> cd</c><00:10:07.440><c> demo</c><00:10:07.839><c> app</c> 00:10:09.430 --> 00:10:09.440 align:start position:0% so let's do cd demo app 00:10:09.440 --> 00:10:15.829 align:start position:0% so let's do cd demo app and<00:10:09.519><c> then</c><00:10:09.680><c> let's</c><00:10:09.920><c> run</c><00:10:10.240><c> shopify</c><00:10:10.720><c> server</c><00:10:11.040><c> again</c> 00:10:15.829 --> 00:10:15.839 align:start position:0% 00:10:15.839 --> 00:10:17.590 align:start position:0% so<00:10:16.079><c> this</c><00:10:16.240><c> looks</c><00:10:16.399><c> a</c><00:10:16.480><c> lot</c><00:10:16.640><c> better</c><00:10:17.120><c> and</c><00:10:17.360><c> what</c><00:10:17.519><c> i</c> 00:10:17.590 --> 00:10:17.600 align:start position:0% so this looks a lot better and what i 00:10:17.600 --> 00:10:19.269 align:start position:0% so this looks a lot better and what i was<00:10:17.760><c> about</c><00:10:18.000><c> to</c><00:10:18.160><c> explain</c><00:10:18.800><c> is</c> 00:10:19.269 --> 00:10:19.279 align:start position:0% was about to explain is 00:10:19.279 --> 00:10:22.389 align:start position:0% was about to explain is that<00:10:19.519><c> shopify</c><00:10:20.079><c> serve</c><00:10:21.040><c> brings</c><00:10:21.440><c> up</c><00:10:21.839><c> our</c><00:10:22.160><c> app</c> 00:10:22.389 --> 00:10:22.399 align:start position:0% that shopify serve brings up our app 00:10:22.399 --> 00:10:23.350 align:start position:0% that shopify serve brings up our app server 00:10:23.350 --> 00:10:23.360 align:start position:0% server 00:10:23.360 --> 00:10:25.190 align:start position:0% server and<00:10:23.519><c> the</c><00:10:23.680><c> only</c><00:10:23.920><c> difference</c><00:10:24.320><c> is</c><00:10:24.560><c> that</c><00:10:24.800><c> for</c><00:10:24.959><c> now</c> 00:10:25.190 --> 00:10:25.200 align:start position:0% and the only difference is that for now 00:10:25.200 --> 00:10:27.990 align:start position:0% and the only difference is that for now we<00:10:25.360><c> don't</c><00:10:25.600><c> have</c><00:10:25.839><c> this</c><00:10:26.320><c> myapp.com</c><00:10:27.200><c> domain</c> 00:10:27.990 --> 00:10:28.000 align:start position:0% we don't have this myapp.com domain 00:10:28.000 --> 00:10:29.990 align:start position:0% we don't have this myapp.com domain and<00:10:28.240><c> we're</c><00:10:28.480><c> actually</c><00:10:28.800><c> hosting</c><00:10:29.279><c> it</c><00:10:29.600><c> on</c><00:10:29.760><c> our</c> 00:10:29.990 --> 00:10:30.000 align:start position:0% and we're actually hosting it on our 00:10:30.000 --> 00:10:31.110 align:start position:0% and we're actually hosting it on our local<00:10:30.320><c> pc</c> 00:10:31.110 --> 00:10:31.120 align:start position:0% local pc 00:10:31.120 --> 00:10:32.790 align:start position:0% local pc but<00:10:31.279><c> once</c><00:10:31.519><c> you</c><00:10:31.680><c> deploy</c><00:10:32.079><c> the</c><00:10:32.240><c> app</c><00:10:32.480><c> you</c><00:10:32.560><c> want</c><00:10:32.720><c> to</c> 00:10:32.790 --> 00:10:32.800 align:start position:0% but once you deploy the app you want to 00:10:32.800 --> 00:10:34.790 align:start position:0% but once you deploy the app you want to push<00:10:33.120><c> it</c><00:10:33.360><c> to</c><00:10:34.000><c> heroku</c> 00:10:34.790 --> 00:10:34.800 align:start position:0% push it to heroku 00:10:34.800 --> 00:10:37.590 align:start position:0% push it to heroku or<00:10:35.120><c> any</c><00:10:35.360><c> other</c><00:10:35.600><c> web</c><00:10:35.760><c> hoster</c><00:10:37.040><c> and</c><00:10:37.200><c> here</c><00:10:37.360><c> it's</c> 00:10:37.590 --> 00:10:37.600 align:start position:0% or any other web hoster and here it's 00:10:37.600 --> 00:10:38.389 align:start position:0% or any other web hoster and here it's asking<00:10:38.000><c> us</c> 00:10:38.389 --> 00:10:38.399 align:start position:0% asking us 00:10:38.399 --> 00:10:41.509 align:start position:0% asking us to<00:10:38.720><c> create</c><00:10:39.120><c> a</c><00:10:39.200><c> tunnel</c><00:10:39.920><c> to</c><00:10:40.160><c> our</c><00:10:40.399><c> local</c><00:10:40.720><c> pc</c> 00:10:41.509 --> 00:10:41.519 align:start position:0% to create a tunnel to our local pc 00:10:41.519 --> 00:10:43.269 align:start position:0% to create a tunnel to our local pc because<00:10:41.920><c> we</c><00:10:42.000><c> don't</c><00:10:42.240><c> have</c><00:10:42.480><c> the</c><00:10:42.720><c> public</c><00:10:43.040><c> web</c> 00:10:43.269 --> 00:10:43.279 align:start position:0% because we don't have the public web 00:10:43.279 --> 00:10:48.389 align:start position:0% because we don't have the public web server<00:10:43.600><c> yet</c><00:10:44.079><c> so</c><00:10:44.240><c> let's</c><00:10:44.399><c> hit</c><00:10:44.839><c> yes</c> 00:10:48.389 --> 00:10:48.399 align:start position:0% 00:10:48.399 --> 00:10:50.630 align:start position:0% so<00:10:48.560><c> now</c><00:10:48.800><c> our</c><00:10:49.040><c> server</c><00:10:49.360><c> is</c><00:10:49.519><c> running</c><00:10:50.079><c> and</c><00:10:50.240><c> we</c><00:10:50.399><c> can</c> 00:10:50.630 --> 00:10:50.640 align:start position:0% so now our server is running and we can 00:10:50.640 --> 00:10:52.630 align:start position:0% so now our server is running and we can install<00:10:51.120><c> our</c><00:10:51.360><c> app</c><00:10:51.680><c> by</c><00:10:51.920><c> clicking</c><00:10:52.240><c> this</c><00:10:52.399><c> link</c> 00:10:52.630 --> 00:10:52.640 align:start position:0% install our app by clicking this link 00:10:52.640 --> 00:10:53.590 align:start position:0% install our app by clicking this link here 00:10:53.590 --> 00:10:53.600 align:start position:0% here 00:10:53.600 --> 00:10:56.949 align:start position:0% here and<00:10:53.839><c> actually</c><00:10:54.160><c> this</c><00:10:54.399><c> angry</c><00:10:54.959><c> url</c><00:10:55.920><c> is</c><00:10:56.240><c> our</c> 00:10:56.949 --> 00:10:56.959 align:start position:0% and actually this angry url is our 00:10:56.959 --> 00:10:59.350 align:start position:0% and actually this angry url is our myapp.com<00:10:57.839><c> domain</c><00:10:58.560><c> only</c><00:10:58.880><c> looks</c><00:10:59.120><c> a</c><00:10:59.200><c> bit</c> 00:10:59.350 --> 00:10:59.360 align:start position:0% myapp.com domain only looks a bit 00:10:59.360 --> 00:10:59.990 align:start position:0% myapp.com domain only looks a bit different 00:10:59.990 --> 00:11:00.000 align:start position:0% different 00:11:00.000 --> 00:11:02.470 align:start position:0% different and<00:11:00.079><c> you</c><00:11:00.240><c> got</c><00:11:00.320><c> to</c><00:11:00.399><c> use</c><00:11:00.640><c> your</c><00:11:00.959><c> imagination</c><00:11:02.320><c> but</c> 00:11:02.470 --> 00:11:02.480 align:start position:0% and you got to use your imagination but 00:11:02.480 --> 00:11:04.949 align:start position:0% and you got to use your imagination but yeah<00:11:02.640><c> that's</c><00:11:02.880><c> the</c><00:11:03.040><c> tunnel</c><00:11:03.360><c> to</c><00:11:03.519><c> your</c><00:11:03.680><c> local</c><00:11:04.000><c> pc</c> 00:11:04.949 --> 00:11:04.959 align:start position:0% yeah that's the tunnel to your local pc 00:11:04.959 --> 00:11:07.990 align:start position:0% yeah that's the tunnel to your local pc so<00:11:05.440><c> let's</c><00:11:05.680><c> click</c><00:11:05.920><c> on</c><00:11:06.000><c> that</c> 00:11:07.990 --> 00:11:08.000 align:start position:0% so let's click on that 00:11:08.000 --> 00:11:09.750 align:start position:0% so let's click on that so<00:11:08.160><c> here</c><00:11:08.320><c> it</c><00:11:08.399><c> redirected</c><00:11:08.959><c> me</c><00:11:09.200><c> to</c><00:11:09.440><c> our</c> 00:11:09.750 --> 00:11:09.760 align:start position:0% so here it redirected me to our 00:11:09.760 --> 00:11:11.590 align:start position:0% so here it redirected me to our development<00:11:10.160><c> store</c><00:11:10.720><c> and</c><00:11:10.880><c> let's</c><00:11:11.120><c> go</c><00:11:11.279><c> ahead</c><00:11:11.440><c> and</c> 00:11:11.590 --> 00:11:11.600 align:start position:0% development store and let's go ahead and 00:11:11.600 --> 00:11:13.350 align:start position:0% development store and let's go ahead and install<00:11:11.920><c> that</c><00:11:12.160><c> app</c> 00:11:13.350 --> 00:11:13.360 align:start position:0% install that app 00:11:13.360 --> 00:11:15.030 align:start position:0% install that app so<00:11:13.519><c> there</c><00:11:13.760><c> we</c><00:11:13.839><c> have</c><00:11:14.079><c> it</c><00:11:14.240><c> our</c><00:11:14.480><c> very</c><00:11:14.720><c> first</c> 00:11:15.030 --> 00:11:15.040 align:start position:0% so there we have it our very first 00:11:15.040 --> 00:11:17.269 align:start position:0% so there we have it our very first shopify<00:11:15.600><c> app</c><00:11:15.839><c> with</c><00:11:16.079><c> node</c><00:11:16.320><c> and</c><00:11:16.480><c> react</c> 00:11:17.269 --> 00:11:17.279 align:start position:0% shopify app with node and react 00:11:17.279 --> 00:11:19.829 align:start position:0% shopify app with node and react first<00:11:18.000><c> how</c><00:11:18.160><c> cool</c><00:11:18.480><c> is</c><00:11:18.560><c> that</c><00:11:19.279><c> second</c><00:11:19.600><c> i</c><00:11:19.680><c> could</c> 00:11:19.829 --> 00:11:19.839 align:start position:0% first how cool is that second i could 00:11:19.839 --> 00:11:21.269 align:start position:0% first how cool is that second i could also<00:11:20.079><c> show</c><00:11:20.240><c> you</c><00:11:20.399><c> the</c><00:11:20.480><c> iframe</c> 00:11:21.269 --> 00:11:21.279 align:start position:0% also show you the iframe 00:11:21.279 --> 00:11:24.949 align:start position:0% also show you the iframe so<00:11:21.600><c> let's</c><00:11:21.839><c> go</c><00:11:22.240><c> to</c><00:11:22.480><c> inspect</c><00:11:23.920><c> and</c><00:11:24.399><c> there</c><00:11:24.640><c> we</c><00:11:24.720><c> have</c> 00:11:24.949 --> 00:11:24.959 align:start position:0% so let's go to inspect and there we have 00:11:24.959 --> 00:11:25.190 align:start position:0% so let's go to inspect and there we have it 00:11:25.190 --> 00:11:25.200 align:start position:0% it 00:11:25.200 --> 00:11:29.030 align:start position:0% it an<00:11:25.360><c> iframe</c><00:11:26.399><c> pointing</c><00:11:26.959><c> to</c><00:11:27.200><c> our</c><00:11:27.440><c> local</c><00:11:27.839><c> pc</c> 00:11:29.030 --> 00:11:29.040 align:start position:0% an iframe pointing to our local pc 00:11:29.040 --> 00:11:32.470 align:start position:0% an iframe pointing to our local pc through<00:11:29.360><c> the</c><00:11:29.920><c> ngrok</c><00:11:30.399><c> tunnel</c><00:11:31.760><c> and</c><00:11:31.920><c> let</c><00:11:32.079><c> me</c><00:11:32.240><c> also</c> 00:11:32.470 --> 00:11:32.480 align:start position:0% through the ngrok tunnel and let me also 00:11:32.480 --> 00:11:34.069 align:start position:0% through the ngrok tunnel and let me also show<00:11:32.640><c> you</c><00:11:32.800><c> what</c><00:11:32.959><c> happens</c><00:11:33.440><c> when</c><00:11:33.600><c> you</c><00:11:33.760><c> try</c><00:11:34.000><c> to</c> 00:11:34.069 --> 00:11:34.079 align:start position:0% show you what happens when you try to 00:11:34.079 --> 00:11:35.670 align:start position:0% show you what happens when you try to bring<00:11:34.320><c> up</c><00:11:34.480><c> this</c><00:11:34.640><c> url</c> 00:11:35.670 --> 00:11:35.680 align:start position:0% bring up this url 00:11:35.680 --> 00:11:38.069 align:start position:0% bring up this url outside<00:11:36.160><c> of</c><00:11:36.240><c> a</c><00:11:36.320><c> shopify</c><00:11:36.720><c> store</c><00:11:37.360><c> so</c><00:11:37.680><c> let's</c><00:11:37.920><c> get</c> 00:11:38.069 --> 00:11:38.079 align:start position:0% outside of a shopify store so let's get 00:11:38.079 --> 00:11:39.910 align:start position:0% outside of a shopify store so let's get a<00:11:38.240><c> new</c><00:11:38.480><c> incognito</c> 00:11:39.910 --> 00:11:39.920 align:start position:0% a new incognito 00:11:39.920 --> 00:11:42.550 align:start position:0% a new incognito and<00:11:40.079><c> try</c><00:11:40.240><c> to</c><00:11:40.320><c> visit</c><00:11:40.839><c> that</c><00:11:42.160><c> then</c><00:11:42.320><c> you</c><00:11:42.399><c> would</c> 00:11:42.550 --> 00:11:42.560 align:start position:0% and try to visit that then you would 00:11:42.560 --> 00:11:43.590 align:start position:0% and try to visit that then you would immediately<00:11:43.040><c> see</c> 00:11:43.590 --> 00:11:43.600 align:start position:0% immediately see 00:11:43.600 --> 00:11:46.230 align:start position:0% immediately see shop<00:11:43.920><c> undefined</c><00:11:45.040><c> and</c><00:11:45.120><c> then</c><00:11:45.279><c> it</c><00:11:45.440><c> can't</c><00:11:45.839><c> access</c> 00:11:46.230 --> 00:11:46.240 align:start position:0% shop undefined and then it can't access 00:11:46.240 --> 00:11:47.350 align:start position:0% shop undefined and then it can't access the<00:11:46.399><c> site</c> 00:11:47.350 --> 00:11:47.360 align:start position:0% the site 00:11:47.360 --> 00:11:50.150 align:start position:0% the site okay<00:11:47.680><c> so</c><00:11:47.920><c> far</c><00:11:48.160><c> so</c><00:11:48.320><c> good</c><00:11:48.720><c> pretty</c><00:11:49.040><c> cool</c><00:11:49.600><c> but</c> 00:11:50.150 --> 00:11:50.160 align:start position:0% okay so far so good pretty cool but 00:11:50.160 --> 00:11:50.949 align:start position:0% okay so far so good pretty cool but what's<00:11:50.480><c> next</c> 00:11:50.949 --> 00:11:50.959 align:start position:0% what's next 00:11:50.959 --> 00:11:53.910 align:start position:0% what's next you<00:11:51.120><c> may</c><00:11:51.279><c> be</c><00:11:51.440><c> asking</c><00:11:52.399><c> excellent</c><00:11:52.880><c> question</c><00:11:53.440><c> and</c> 00:11:53.910 --> 00:11:53.920 align:start position:0% you may be asking excellent question and 00:11:53.920 --> 00:11:55.350 align:start position:0% you may be asking excellent question and it<00:11:54.160><c> really</c><00:11:54.399><c> depends</c><00:11:54.959><c> on</c> 00:11:55.350 --> 00:11:55.360 align:start position:0% it really depends on 00:11:55.360 --> 00:11:57.250 align:start position:0% it really depends on what<00:11:55.519><c> you</c><00:11:55.680><c> want</c><00:11:55.760><c> to</c><00:11:55.920><c> do</c><00:11:56.160><c> next</c><00:11:56.959><c> so</c> 00:11:57.250 --> 00:11:57.260 align:start position:0% what you want to do next so 00:11:57.260 --> 00:11:58.629 align:start position:0% what you want to do next so [Music] 00:11:58.629 --> 00:11:58.639 align:start position:0% [Music] 00:11:58.639 --> 00:12:00.790 align:start position:0% [Music] if<00:11:58.800><c> you</c><00:11:58.880><c> never</c><00:11:59.200><c> used</c><00:11:59.519><c> node.js</c><00:12:00.160><c> before</c><00:12:00.639><c> i</c> 00:12:00.790 --> 00:12:00.800 align:start position:0% if you never used node.js before i 00:12:00.800 --> 00:12:02.790 align:start position:0% if you never used node.js before i highly<00:12:01.120><c> recommend</c><00:12:01.440><c> checking</c><00:12:01.760><c> out</c><00:12:01.920><c> my</c><00:12:02.079><c> video</c> 00:12:02.790 --> 00:12:02.800 align:start position:0% highly recommend checking out my video 00:12:02.800 --> 00:12:04.870 align:start position:0% highly recommend checking out my video on<00:12:03.200><c> automated</c><00:12:03.680><c> testing</c><00:12:04.079><c> frameworks</c><00:12:04.560><c> because</c> 00:12:04.870 --> 00:12:04.880 align:start position:0% on automated testing frameworks because 00:12:04.880 --> 00:12:07.030 align:start position:0% on automated testing frameworks because there<00:12:05.040><c> i</c><00:12:05.120><c> have</c><00:12:05.279><c> like</c><00:12:05.600><c> a</c><00:12:05.680><c> small</c><00:12:06.000><c> introduction</c> 00:12:07.030 --> 00:12:07.040 align:start position:0% there i have like a small introduction 00:12:07.040 --> 00:12:09.829 align:start position:0% there i have like a small introduction to<00:12:07.279><c> node</c><00:12:07.600><c> and</c><00:12:07.760><c> mpm</c><00:12:08.800><c> i</c><00:12:09.040><c> could</c><00:12:09.279><c> tell</c><00:12:09.440><c> you</c><00:12:09.600><c> more</c> 00:12:09.829 --> 00:12:09.839 align:start position:0% to node and mpm i could tell you more 00:12:09.839 --> 00:12:11.910 align:start position:0% to node and mpm i could tell you more about<00:12:10.079><c> the</c><00:12:10.160><c> different</c><00:12:10.399><c> packages</c><00:12:10.880><c> used</c><00:12:11.200><c> here</c> 00:12:11.910 --> 00:12:11.920 align:start position:0% about the different packages used here 00:12:11.920 --> 00:12:13.670 align:start position:0% about the different packages used here we<00:12:12.079><c> can</c><00:12:12.240><c> talk</c><00:12:12.480><c> more</c><00:12:12.639><c> about</c><00:12:12.880><c> the</c><00:12:12.959><c> shopify</c><00:12:13.519><c> app</c> 00:12:13.670 --> 00:12:13.680 align:start position:0% we can talk more about the shopify app 00:12:13.680 --> 00:12:15.509 align:start position:0% we can talk more about the shopify app bridge<00:12:14.160><c> which</c><00:12:14.399><c> is</c><00:12:14.560><c> used</c> 00:12:15.509 --> 00:12:15.519 align:start position:0% bridge which is used 00:12:15.519 --> 00:12:18.150 align:start position:0% bridge which is used to<00:12:15.920><c> enable</c><00:12:16.399><c> communication</c><00:12:17.519><c> between</c><00:12:17.920><c> this</c> 00:12:18.150 --> 00:12:18.160 align:start position:0% to enable communication between this 00:12:18.160 --> 00:12:19.990 align:start position:0% to enable communication between this frame<00:12:18.639><c> and</c><00:12:18.880><c> the</c><00:12:19.040><c> mainframe</c> 00:12:19.990 --> 00:12:20.000 align:start position:0% frame and the mainframe 00:12:20.000 --> 00:12:22.629 align:start position:0% frame and the mainframe because<00:12:20.320><c> usually</c><00:12:20.720><c> iframes</c><00:12:21.600><c> can't</c><00:12:21.920><c> easily</c> 00:12:22.629 --> 00:12:22.639 align:start position:0% because usually iframes can't easily 00:12:22.639 --> 00:12:24.470 align:start position:0% because usually iframes can't easily communicate<00:12:23.279><c> with</c><00:12:23.440><c> each</c><00:12:23.680><c> other</c> 00:12:24.470 --> 00:12:24.480 align:start position:0% communicate with each other 00:12:24.480 --> 00:12:26.629 align:start position:0% communicate with each other or<00:12:24.639><c> we</c><00:12:24.800><c> could</c><00:12:24.959><c> talk</c><00:12:25.200><c> about</c><00:12:25.519><c> graphql</c><00:12:26.399><c> like</c> 00:12:26.629 --> 00:12:26.639 align:start position:0% or we could talk about graphql like 00:12:26.639 --> 00:12:29.110 align:start position:0% or we could talk about graphql like making<00:12:27.279><c> graphql</c><00:12:27.839><c> calls</c><00:12:28.240><c> with</c><00:12:28.480><c> the</c><00:12:28.720><c> apollo</c> 00:12:29.110 --> 00:12:29.120 align:start position:0% making graphql calls with the apollo 00:12:29.120 --> 00:12:30.389 align:start position:0% making graphql calls with the apollo client 00:12:30.389 --> 00:12:30.399 align:start position:0% client 00:12:30.399 --> 00:12:33.990 align:start position:0% client we<00:12:30.480><c> could</c><00:12:30.639><c> talk</c><00:12:30.880><c> about</c><00:12:31.440><c> routing</c><00:12:32.240><c> with</c><00:12:32.480><c> next</c><00:12:32.720><c> js</c> 00:12:33.990 --> 00:12:34.000 align:start position:0% we could talk about routing with next js 00:12:34.000 --> 00:12:37.110 align:start position:0% we could talk about routing with next js we<00:12:34.160><c> could</c><00:12:34.320><c> talk</c><00:12:34.480><c> more</c><00:12:34.720><c> about</c><00:12:35.120><c> react</c><00:12:35.920><c> like</c><00:12:36.880><c> how</c> 00:12:37.110 --> 00:12:37.120 align:start position:0% we could talk more about react like how 00:12:37.120 --> 00:12:39.190 align:start position:0% we could talk more about react like how we<00:12:37.200><c> can</c><00:12:37.279><c> modify</c><00:12:37.680><c> the</c><00:12:37.839><c> content</c><00:12:38.240><c> of</c><00:12:38.320><c> this</c><00:12:38.560><c> page</c> 00:12:39.190 --> 00:12:39.200 align:start position:0% we can modify the content of this page 00:12:39.200 --> 00:12:43.509 align:start position:0% we can modify the content of this page so<00:12:39.440><c> you</c><00:12:39.519><c> could</c><00:12:39.680><c> add</c><00:12:39.760><c> a</c><00:12:39.839><c> little</c><00:12:40.079><c> test</c><00:12:40.399><c> here</c> 00:12:43.509 --> 00:12:43.519 align:start position:0% 00:12:43.519 --> 00:12:45.350 align:start position:0% and<00:12:43.600><c> then</c><00:12:43.760><c> it</c><00:12:43.839><c> would</c><00:12:44.000><c> appear</c><00:12:44.320><c> right</c><00:12:44.560><c> here</c><00:12:45.279><c> we</c> 00:12:45.350 --> 00:12:45.360 align:start position:0% and then it would appear right here we 00:12:45.360 --> 00:12:47.190 align:start position:0% and then it would appear right here we can<00:12:45.519><c> talk</c><00:12:45.760><c> more</c><00:12:45.920><c> about</c><00:12:46.160><c> polaris</c><00:12:46.800><c> which</c><00:12:47.040><c> is</c><00:12:47.120><c> a</c> 00:12:47.190 --> 00:12:47.200 align:start position:0% can talk more about polaris which is a 00:12:47.200 --> 00:12:48.550 align:start position:0% can talk more about polaris which is a collection<00:12:47.760><c> of</c><00:12:47.920><c> different</c> 00:12:48.550 --> 00:12:48.560 align:start position:0% collection of different 00:12:48.560 --> 00:12:50.870 align:start position:0% collection of different react<00:12:48.959><c> components</c><00:12:49.920><c> that</c><00:12:50.079><c> will</c><00:12:50.320><c> help</c><00:12:50.560><c> you</c><00:12:50.720><c> to</c> 00:12:50.870 --> 00:12:50.880 align:start position:0% react components that will help you to 00:12:50.880 --> 00:12:53.269 align:start position:0% react components that will help you to build<00:12:51.120><c> these</c><00:12:51.839><c> shopify</c><00:12:52.320><c> looking</c><00:12:52.639><c> interfaces</c> 00:12:53.269 --> 00:12:53.279 align:start position:0% build these shopify looking interfaces 00:12:53.279 --> 00:12:54.389 align:start position:0% build these shopify looking interfaces and<00:12:53.440><c> elements</c> 00:12:54.389 --> 00:12:54.399 align:start position:0% and elements 00:12:54.399 --> 00:12:56.389 align:start position:0% and elements or<00:12:54.560><c> we</c><00:12:54.720><c> could</c><00:12:54.959><c> also</c><00:12:55.200><c> talk</c><00:12:55.440><c> more</c><00:12:55.600><c> about</c><00:12:56.000><c> react</c> 00:12:56.389 --> 00:12:56.399 align:start position:0% or we could also talk more about react 00:12:56.399 --> 00:12:57.509 align:start position:0% or we could also talk more about react in<00:12:56.560><c> general</c> 00:12:57.509 --> 00:12:57.519 align:start position:0% in general 00:12:57.519 --> 00:12:59.030 align:start position:0% in general or<00:12:58.000><c> i</c><00:12:58.079><c> could</c><00:12:58.240><c> tell</c><00:12:58.399><c> you</c><00:12:58.560><c> more</c><00:12:58.720><c> about</c><00:12:58.959><c> the</c> 00:12:59.030 --> 00:12:59.040 align:start position:0% or i could tell you more about the 00:12:59.040 --> 00:13:00.710 align:start position:0% or i could tell you more about the server<00:12:59.440><c> side</c><00:12:59.600><c> of</c><00:12:59.760><c> things</c> 00:13:00.710 --> 00:13:00.720 align:start position:0% server side of things 00:13:00.720 --> 00:13:03.910 align:start position:0% server side of things we<00:13:00.880><c> could</c><00:13:01.120><c> set</c><00:13:01.360><c> up</c><00:13:01.839><c> our</c><00:13:02.160><c> own</c><00:13:02.480><c> routes</c><00:13:03.200><c> and</c><00:13:03.680><c> maybe</c> 00:13:03.910 --> 00:13:03.920 align:start position:0% we could set up our own routes and maybe 00:13:03.920 --> 00:13:06.230 align:start position:0% we could set up our own routes and maybe even<00:13:04.160><c> build</c><00:13:04.320><c> our</c><00:13:04.560><c> own</c><00:13:04.839><c> api</c><00:13:05.760><c> we</c><00:13:05.920><c> could</c><00:13:06.079><c> talk</c> 00:13:06.230 --> 00:13:06.240 align:start position:0% even build our own api we could talk 00:13:06.240 --> 00:13:07.430 align:start position:0% even build our own api we could talk about<00:13:06.480><c> web</c><00:13:06.720><c> hooks</c> 00:13:07.430 --> 00:13:07.440 align:start position:0% about web hooks 00:13:07.440 --> 00:13:08.710 align:start position:0% about web hooks so<00:13:07.600><c> there</c><00:13:07.760><c> are</c><00:13:07.839><c> a</c><00:13:07.839><c> thousand</c><00:13:08.240><c> different</c><00:13:08.480><c> things</c> 00:13:08.710 --> 00:13:08.720 align:start position:0% so there are a thousand different things 00:13:08.720 --> 00:13:10.470 align:start position:0% so there are a thousand different things that<00:13:08.800><c> we</c><00:13:08.959><c> could</c><00:13:09.120><c> cover</c><00:13:09.600><c> and</c><00:13:09.920><c> just</c><00:13:10.079><c> let</c><00:13:10.240><c> me</c><00:13:10.320><c> know</c> 00:13:10.470 --> 00:13:10.480 align:start position:0% that we could cover and just let me know 00:13:10.480 --> 00:13:11.829 align:start position:0% that we could cover and just let me know what<00:13:10.560><c> you</c><00:13:10.720><c> want</c><00:13:10.880><c> to</c><00:13:10.959><c> learn</c><00:13:11.200><c> next</c> 00:13:11.829 --> 00:13:11.839 align:start position:0% what you want to learn next 00:13:11.839 --> 00:13:13.750 align:start position:0% what you want to learn next i<00:13:12.079><c> also</c><00:13:12.320><c> have</c><00:13:12.480><c> a</c><00:13:12.560><c> few</c><00:13:12.800><c> other</c><00:13:12.959><c> videos</c><00:13:13.440><c> planned</c> 00:13:13.750 --> 00:13:13.760 align:start position:0% i also have a few other videos planned 00:13:13.760 --> 00:13:15.269 align:start position:0% i also have a few other videos planned but<00:13:14.000><c> we</c><00:13:14.079><c> can</c><00:13:14.240><c> have</c><00:13:14.399><c> an</c><00:13:14.480><c> app</c><00:13:14.720><c> video</c> 00:13:15.269 --> 00:13:15.279 align:start position:0% but we can have an app video 00:13:15.279 --> 00:13:16.790 align:start position:0% but we can have an app video in<00:13:15.360><c> between</c><00:13:15.760><c> every</c><00:13:16.000><c> now</c><00:13:16.160><c> and</c><00:13:16.240><c> then</c><00:13:16.639><c> would</c> 00:13:16.790 --> 00:13:16.800 align:start position:0% in between every now and then would 00:13:16.800 --> 00:13:18.389 align:start position:0% in between every now and then would actually<00:13:17.040><c> be</c><00:13:17.120><c> a</c><00:13:17.200><c> lot</c><00:13:17.360><c> of</c><00:13:17.519><c> fun</c><00:13:18.079><c> and</c><00:13:18.160><c> then</c><00:13:18.320><c> i</c> 00:13:18.389 --> 00:13:18.399 align:start position:0% actually be a lot of fun and then i 00:13:18.399 --> 00:13:19.910 align:start position:0% actually be a lot of fun and then i would<00:13:18.560><c> say</c><00:13:18.720><c> this</c><00:13:18.880><c> was</c><00:13:19.040><c> a</c><00:13:19.120><c> pretty</c><00:13:19.360><c> good</c><00:13:19.519><c> start</c> 00:13:19.910 --> 00:13:19.920 align:start position:0% would say this was a pretty good start 00:13:19.920 --> 00:13:20.949 align:start position:0% would say this was a pretty good start and<00:13:20.000><c> i</c><00:13:20.079><c> hope</c><00:13:20.240><c> that</c><00:13:20.320><c> was</c><00:13:20.480><c> something</c><00:13:20.800><c> and</c> 00:13:20.949 --> 00:13:20.959 align:start position:0% and i hope that was something and 00:13:20.959 --> 00:13:21.910 align:start position:0% and i hope that was something and helpful 00:13:21.910 --> 00:13:21.920 align:start position:0% helpful 00:13:21.920 --> 00:13:23.590 align:start position:0% helpful if<00:13:22.000><c> you're</c><00:13:22.240><c> looking</c><00:13:22.399><c> to</c><00:13:22.480><c> become</c><00:13:22.800><c> a</c><00:13:22.880><c> freelancer</c> 00:13:23.590 --> 00:13:23.600 align:start position:0% if you're looking to become a freelancer 00:13:23.600 --> 00:13:25.190 align:start position:0% if you're looking to become a freelancer keep<00:13:23.839><c> an</c><00:13:24.000><c> eye</c><00:13:24.079><c> on</c><00:13:24.240><c> free</c><00:13:24.399><c> mode</c><00:13:24.720><c> for</c><00:13:24.959><c> a</c><00:13:25.040><c> more</c> 00:13:25.190 --> 00:13:25.200 align:start position:0% keep an eye on free mode for a more 00:13:25.200 --> 00:13:26.870 align:start position:0% keep an eye on free mode for a more structured<00:13:25.760><c> and</c><00:13:25.920><c> guided</c><00:13:26.240><c> format</c> 00:13:26.870 --> 00:13:26.880 align:start position:0% structured and guided format 00:13:26.880 --> 00:13:28.470 align:start position:0% structured and guided format and<00:13:26.959><c> then</c><00:13:27.120><c> i</c><00:13:27.200><c> also</c><00:13:27.440><c> found</c><00:13:27.760><c> this</c><00:13:28.160><c> very</c> 00:13:28.470 --> 00:13:28.480 align:start position:0% and then i also found this very 00:13:28.480 --> 00:13:30.150 align:start position:0% and then i also found this very insightful<00:13:29.120><c> article</c><00:13:29.839><c> on</c> 00:13:30.150 --> 00:13:30.160 align:start position:0% insightful article on 00:13:30.160 --> 00:13:32.870 align:start position:0% insightful article on how<00:13:30.320><c> to</c><00:13:30.480><c> like</c><00:13:30.800><c> a</c><00:13:30.880><c> youtube</c><00:13:31.279><c> video</c><00:13:32.320><c> and</c><00:13:32.560><c> i</c><00:13:32.639><c> don't</c> 00:13:32.870 --> 00:13:32.880 align:start position:0% how to like a youtube video and i don't 00:13:32.880 --> 00:13:34.389 align:start position:0% how to like a youtube video and i don't think<00:13:33.120><c> we</c><00:13:33.279><c> need</c><00:13:33.440><c> this</c><00:13:33.600><c> part</c><00:13:33.920><c> here</c> 00:13:34.389 --> 00:13:34.399 align:start position:0% think we need this part here 00:13:34.399 --> 00:13:36.069 align:start position:0% think we need this part here so<00:13:34.560><c> make</c><00:13:34.800><c> sure</c><00:13:34.959><c> to</c><00:13:35.040><c> check</c><00:13:35.200><c> that</c><00:13:35.360><c> out</c><00:13:35.760><c> and</c><00:13:35.920><c> then</c> 00:13:36.069 --> 00:13:36.079 align:start position:0% so make sure to check that out and then 00:13:36.079 --> 00:13:39.920 align:start position:0% so make sure to check that out and then i'll<00:13:36.160><c> see</c><00:13:36.320><c> you</c><00:13:36.560><c> in</c><00:13:36.720><c> the</c><00:13:36.800><c> next</c><00:13:37.360><c> bye</c>