[Music]
i'm so delighted to be able to announce
uh our next speaker uh chris coyer um
many of you will know chris from around
on the on the internet he's he's been i
don't want to call him old but he's been
around there for a while uh sorry chris
i don't know um
uh he's he was absolutely behind you
know so many of the resources that have
taught me so much throughout my web
development career you know css tricks
has become this canonical reference for
all kinds of content all kinds of things
to do with web development i'm always
baffled at how quickly after something
new comes along chris is able to grasp
it see its importance learn about it
produce content that is just so valuable
for everyone
and that has incredible longevity and
just kind of sticks around uh so uh it's
it's kind of staggering to see um chris
is gonna come and talk to us now about
you know the power of the all-powerful
front-end developer and that makes me
happy because that's that's my
background so please make him very very
welcome it's chris coyer
yeah
no you don't need that
okay
wow
that was so nice that's the nicest
introduction i ever got
ever
um yeah ooh flashlight uh all-powerful
friend of thought i've been a friend of
developer for a long time it's very near
and dear to my heart and it's so cool
what's happening and that front-end
developers are just
getting so much more powerful in what we
can do and that's what this we're going
to talk about for half an hour it's
going to be awesome i'm uh i work at
codepen
uh and do css tricks and shop talk show
as well why does it say bookmark this
page isn't that weird do you see that
whatever that's annoying enough to fix
let's
there it goes
you want to read my email too there's
some in there
cool so like before any of the stuff
that we're going to talk about today
friend developers have already been
super powerful we always had like a
super important role in the con
and the construction of websites you
know like uh uh okay next slide go buddy
yeah all of ux is important of ux is
it's like the most important thing we
can possibly deal with when making a
website what is it like for the users to
use the front-end developer crafts all
of it you know like it's in totally in
our hands what the experience of using a
website is like performance that's on
front end developers primarily a big
chunk of perf is a front-end development
situation all of accessibility and
people can
uh you can have specialists like think
about ux and wireframe stuff and do
research but the but the putting it into
a website is all from developers just
like accessibility that's in front-end
developers hands
the execution of a design and
integrating the animations and
interactions and all that stuff that's
all front-end development work that's
incredible we have so much work to do
already front-end developers that you
can make a sweet career out of it and
lots of people are doing it and i love
it i've done it and i just think wow
what a cool job the best job in the
world being a front-end developer
and there's a certain skill set that
comes along with the job certainly those
things it's generally like some of those
things you specialize in some of them
whatever you add a few things to that
party but there is some kind of like
roadblock eventually that's the point
you're a front-end developer which means
that you don't have some other skills
probably so there's some kind of like
roadblock to your front-end development
skills where you're like okay my skill
set has expired and now i need somebody
else to help me and this talk is kind of
about like where is that and where is it
changing and i'm kind of interested in
just kicking it down i mean like
i don't i don't need anybody's help
anymore i can do everything which i love
so there's some kind of like there's a i
don't know when when does it stop
generally it stops when you need like
some some hardcore back end help or like
server ops kind of stuff
uh at least that's been the case for me
so if you don't need any servers you
know well i don't know why that this
word hasn't come up as much at this
conference but i feel like it's just as
buzzwordy as jam stack is to some degree
so i'm gonna say it a whole bunch just
unapologetically and i'm not even going
to give some caveat that's like well
there's still servers involved
i'm going to do it i made a website
called the power of serverless.info
that it's just a bunch of links and
stuff so don't worry about like jotting
down links and stuff we talk about some
service it's up on this micro site
that's kind of related to this talk so
let's look at one of the major
ingredients of of i'd say jam stock but
definitely of serverless which is this
whole idea of cloud functions they're so
cool
it's some javascript and you put it on a
server but not your server somebody
else's server
which is great and it's probably node
you know it doesn't have to be but it
probably is especially for the people in
this room and then you got a website and
all you need to know is that you execute
that code by hitting a url of some kind
you hit the url the code runs that's all
that a cloud function is it's
sounds boring but it's cool
why would you ever do that well let's
not be abstract about it let's talk
about real reasons why you do it let's
say your boss is like okay we work at we
work at
food dot recipes or center stuff
you work on a recipe site and you're
tasked with
i we need to like have an input field
and you type in your phone number and
you get the recipe on your phone it's
like a feature that you're tasked with
building so if you're like a front-end
developer you're like i got this i can
do the design it i can do the ux for it
i can build the form i can think about
the states i can do all this work but at
some point my friend i'm done and i
gotta kick it over the fence to somebody
who can like go the last mile and make
it do the actual thing of sending a text
message
that's the roadblock that we're gonna
kick over
we're gonna be like okay twilio that's
the app that you use to send text
messages cool got it that's the thing
i'm a little afraid of like you they
don't know i don't know how to do that
it seems like back end nerd stuff this
is where my front end skills expire and
somebody else comes to help me like i
said this is what we're gonna we're
gonna scratch out so how do we do it
well
it's not because twilio announced that
they have client-side-only apis and we
can just do it in the browser they don't
have that they don't have that on
purpose because you need api keys to
deal with your twilio account because
if your
api keys are the keys to the kingdom if
some bad person slides in here and
steals your api keys for twilio they're
going to can text all of texas to vote
for ted cruz something that you don't
want something bad is going to happen to
you if they get your api keys that's why
you need to protect them behind
server-side code
uh that's a traditional use case of why
you need a server i need to protect my
api keys you just have to do that you
can't protect them client-side i need a
server
to do this in some way it's not the case
for all apis flickr's got an api you can
use it to search first search for
pictures you don't need any api keys you
don't need a server for this this is all
happening client-side this also makes
you powerful as a front-end developer
but it's not going to help us in the
twilio situation so we're going to use a
server but not really we're going to use
somebody else's server
and we're going to do it this way so
that's our little clout what a cloud
function is diagram we're going to write
our little javascript code we're going
to put it on somebody else's server and
we're going to communicate with that via
urls the web's finest feature
so
if we're going to run some javascript
code and we need to put it on a server
somewhere or whatever why can't we just
use the one that's already powering our
recipe website
like why why not well we because this is
why not
because our server doesn't run anything
in the background so we maybe could if
it was like an old school server that we
don't have but no we jam stacking baby
our server don't have node on it on
purpose
what say our recipe website is running
on github pages or codepen projects or
obviously nutlify is the choice here or
i'm gonna dump all that crap in an s3
bucket guess which back-end languages
none of those things have all of them
that was complicated
none of those run any back-end languages
you know like github pages will not run
your python script nutlify will not run
your php function codepen projects will
not run your node javascript yet
so
but why would you choose those things
because it's super cheap it's super fast
it's cdn edge don't we call it a cdn's
edge now i don't know why there's you
they're super secure there's no database
to break into there's no file
permissions to set that you get a htm
https that you don't have to freaking
deal with it's such a pain in the ass
they're just very front-end developer
friendly places to put your code it's a
fundamental kind of concept of this jam
stack stuff that's where our recipe
website lives so that's why we don't
have a place to run our little function
to talk to twilio so let's server list
up
serverless it up this website which i
have no affiliation with or anything
it's it's just it helps me understand
what a cloud function is so maybe this
will be useful to you too it's called
webtask.io it's a little bit like
codepen and that it's an editor in the
browser so i can open up webtask and i
can actually edit that code and i can
make a function so here's just a
function that takes some data and when
it's done doing whatever it's going to
do it calls a call back and returns that
data what's cool about web tests i can
test it right in there i can press that
run button and it'll run that function
so here i'm going to post i'm going to
fake post to this piece of code and i'm
going to pass it some form data foo bar
whatever hit the run button and i can
see that it returns
i can even console.log stuff in there
and it returns a little piece of json
for me to use cool so now i have this
like piece of node that i'm executing
now
uh so but that node is useless the node
code i want is i'm going to just go copy
and paste some crap out of the twilio
docs because that's how i need to send a
text message they'll have an npm lib
that you can just grab they'll have
documentation that's just like
i don't know fill in the blanks you know
it's their job to make this easy for you
to use
so here i've done it i just went to
quilio i'm importing twilio from twilio
i don't even know what that lib does but
i'm just following the docs you know
there's some api key stuff in there and
i'm just gonna that's their
documentation for how to send a text
message
and then web test has a place to keep
your secrets if you want to so that the
world kind of can't see them but
crucially they give you a url
to hit it that they give you that now i
have a url to run my function which is
great now i can use it and this is cool
old school web i can use this function
with not no client-side javascript at
all i can just have a form i'm going to
post to that url that they just gave me
and i'm going to ask her phone number to
send it to and just pass it some value
to send or whatever and it has a submit
button and that's it so i can run that
on codepen it's just a
that's it there's no css or javascript
involved here at all i just type in my
own phone number there and never call me
and
i'm just having it barf outside but i'm
in you know i'm in mac os so i have my
imessage set up or whatever and it's
working it's it's hitting twilio with
that data and it's sending me a text
message i put that together and i have
no business doing that
uh which is great and so and you don't
even have to have it spit out crap i
could have told that node function to
redirect to some success page or
something like that it's probably more
likely though that you'd have an event
listener on your form and you'd whatever
post to the
to the url that i said and you'd send it
some data and then wait for the response
and do fancy animations on your page or
whatever that's probably a more
likely scenario but it's kind of cool
that you can do it with progressive
enhancement too and this is what i did
you know i made a dumb little recipe
website where you can type in the phone
number and you get these a lovely little
recipe for
for oatmeal cookies so that's totally
part of jam stack and serverless
but this this can get harder and easier
than that here's an example of it
getting a lot easier let's say you need
a form on your website that's something
else a contact form or something i need
back-end code to be able to deal with
that so what do you use do we gonna have
to write a cloud function and protect
our api keys
sure you could do it like that but you
don't have to because this is a super
old need on the web like people have
needed to put forms on websites and
there's been startups to help them do
that uh forever so there's
google forms or whatever and
wufoo and typeform and formstack and
jotform there's a million apps to do
this i think you know as old as these
seem this is a part of jam sect too if
you ask me this means
somebody else deal with my forms
let somebody else's servers and stuff
that specialize in that
be part of this website and i don't need
any backend languages or anything else
you know i think that's part of this
story as well i can take a woofer form
and have it work right on codepen it's
just copy and paste code and that's a
fully functional payment enabled form
that i could host anywhere
but there's you know more a little bit
more jam stacky maybe is this idea that
you can just bring your own html form
and then just point the action attribute
at one of these other services like a
new breed of form processors you just
pass it that and that's how form carry
works and page clip and netlify forms of
course and uh basin you know there's all
these these new form processors that
help you deal with forms as well and
these exist because this is a big deal
which is cool so don't don't worry about
any of those services that's why this
website the power of serverless.info
exists so that all it rounds up all
these services there's a million of them
so let's say you need to take some money
for your thing e-commerce
i don't know i give up i'm just going to
use shopify or magento or i don't know
is that do the kids these days know
about magento still
but you don't really have to too like
how would you do jam stacky e-commerce
how does that work well there's a
million ways to cut it but the easiest
way in the universe is just to use a buy
now button i have little scarfs oh well
here's all the players right we know
them they they're literally all here and
san francisco
uh
paypal i sell scarfs i'm gonna put a
freaking paypal button on the thing when
they click it they go to paypal they pay
for the thing they come back to my scarf
website and and then paypal tells me
about it so then i ship them the scarf
or whatever that's jam stacky that's i
don't need any back-end languages to do
this i'm totally enabled as a front-end
developer to have e-commerce on my
website the oldest way in the book or
you can get all fancy with it this is a
sarah drazner demo where she you know
who's you know works for microsoft and
on azure and um and is on the vue core
team this is a view demo where it's all
fancy it's got filtering and there's a
cart and you know she made up this whole
e-commerce demo
but it also has a payment form on it so
look as she filters and it's all modern
and fancy and then you go to the cart
and the cart has items in it but you can
actually check out and this isn't just
totally fake she integrated this with
stripe so this is just using the fake
stripe credit card number but this would
actually work in process code it's the
same else all the proper code is there
to do it you pay with the credit card
and stripe is communicated with the card
is actually processed and it's it's
doing all that kind of real e-commerce
work but there's no server here this is
still all jam stacky and the way that it
works is that the back end is
or the front is view the processing is
striped but the way that those two mix
because of course stripe has api keys
that you need to protect you better as
help protect your stripe api keys
they're communicated with cloud
functions in this case on azure
so stripe again they want to help you do
this
api docs for stripe are incredible you
know but it's but it's
you know so you need to put it somewhere
so in this case she's using azure uh and
you azure has an interface i think this
is probably an oldish screenshot i think
it's been redesigned a little bit but
what's kind of cool about this is that
in this case you see how it's all kind
of grayed out sarah put these in a
github repo so her funker cloud
functions are part of like the rest of
her code base it's just she's shipping
them up to azure here too so you don't
have to use an online editor for your
cloud functions can live in your repo
along with all the rest of your code
kind of cool kind of cool just because
we're talking about payments i think
this is worth knowing about the browsers
have this new thing called the web
payment api and the whole point of it
isn't to like they're not actually
processing payments for you what
browsers are trying to give you here is
free ui ux for checking out from pages
like they'll be your shopping cart and
your address collector and credit card
information acceptor it's this piece
that they're trying to give you and
that's so cool
because it's just it's consistent across
sites then and they'll you know the
people have their saved addresses and
saved credit cards and stuff it's but
it's just the ui ux you still need to
bring your own payment processing so you
still need stuff like
you know serverless functions to process
your stripe calls and all that kind of
stuff but it's worth knowing about i
think this that's some future web stuff
that works nicely in a jam stack
situation
um so here's another one let's say you
need comment threads this might be a
moment where you're like yeah gem
stack's cool but
i need i literally need comments on my
website so what am i going to do about
that i'm just going to give up and use
wordpress or something but no but
comments are great structured data
they're great for databases there's no
reason to forsake databases because
they're kind of perfect for stuff like
this you need their name and their what
piece of what article that comment was
associated with and the value of the
comment and when it happened and whether
it's approved or not and it's great
structured data so sure you could just
reach for wordpress but let's assume
that you're going to use a static site
generator instead static site generators
are so hot i'm going to use
middleman or whatever
there's a bunch of them they're all
great there's hugo and gatsby's the cool
one right and there's hexo and
metalsmith and jekyll and middlemen and
11t is the new hot one isn't it so but
you but you don't you know they're they
don't have like comment threads aren't
like a native feature of any of these
things
so in the way that they generally work
is uh you know there's
the content lives in your repo it's a
big pile of markdown files actually had
an interesting conversation last night
where it's not necessarily that it's
just anything that returns a promise
kind of thing it was an interesting
conversation but because so it wouldn't
necessarily need to be a bunch of
markdown files it could hit your
contentful api or something but still
statically generate
total aside there but it smashes all
that together with some templates and it
makes like a directory that's a website
like a bunch of files that you could put
anywhere you put it in your s3 bucket or
let netlify run it for you or whatever
they all work the same way but none of
them really have comments as a feature
so what are we to do
well
we don't really have a database at our
command so let's just put discus on it
which is fine and it solves you know
that comes with its own can of worms but
that's been like solving that problem
for us forever and
and as such is kind of part of the the
the jam stock universe in a way but like
let's really nerd this one up like let's
go full bore nerd on the comment thread
thing let's want to roll our own system
so we're going to use hugo because hugo
is cool right uh that's our static site
generator we're going to put a comment
form on it where we collect their name
and their email and what comment and
when you click the button it's going to
turn into a piece of like structured
data we'll just
format it as json and we'll throw it up
and fight because firebase is great for
that it's basically json based we can
just throw our you know i know there's
more to it than this i'm being
abstracted on purpose but we'll keep
that data in firebase well it could be
spam it could be garbage so we're going
to have a when that happens and of
course we'll do this through a cloud
function you know the option will also
hit slack and slack will have a channel
and it'll say do i approve or disapprove
this message and if you say approve if
you say disapprove it maybe just does
nothing
but if it hits approve then maybe that
cloud function then can hit netlify and
trigger a build that'd be kind of cool
and during that build we'll have hugo go
get all approved comments from that post
and do it in the build process so now we
have a comment thread the data is stored
in a database kind of where it's nice to
keep things like comments but we can
still statically generate our site like
that's a kind of flow that is just cool
and
gem stocky and serverlessly and just
kind of sweet and a little bit like that
there's still things around but it's
kind of sweet
uh
that's phil's version phil's is cool
phil's phil's
it uses
um
like the nutlify like kind of you know
when you use nutify forms it just uses
nutlify as a database kind of
kind of cool
so what about what about real-life cloud
functions like these were all little
hobbyist kind of things but clearly
sites use them all the time codepen uses
the crap out of cloud functions here's
one of the things we use cloud functions
for you can write in a bunch of
different preprocessor languages on code
like your html you can write it on or
any of these other languages your css
you can write in popular css
preprocessor languages javascript too we
will process for you in a number of
different ways
we could and we have re-architected this
many times throughout the life of
codepen but we've really settled on
cloud functions as a way to do this
because it's sweet
so all these languages are written in
node which is a thing that uh lambda
which is another cloud services provider
can run so we have little cloud
functions whose whole job on earth is to
take some less css and turn it into css
and return it it's its own that's all it
does in the world it's its own little
job
and then there's a couple other
languages out there that you know sas
there's dart sass these days which you
haven't explored but there's some other
languages that just don't run in a
language that cloud functions can
generally run for whatever reason cloud
functions don't love ruby
who knows but like in the world of
codepen uh the ones that are on the left
side of this screen are certainly uh
kind of happier you know that they're
cheaper they're easier to secure they're
easier to scale they don't break that
often it's not like the stuff on the
right is untenable like we can manage it
that word that's the business that we're
in but certainly if you can run it as a
cloud function oh your life just gets so
much easier and better and
less expensive and stuff it's great
all right let's do another one just
because we can let's say you need to be
able to build a like a crm like your
boss is like hey bro can you build me
like an app to like track our customers
and like if they got a gift box or not
for christmas and you'd be like yes boss
i can
it's like no no like an app you know and
you're like yes i can build you that app
you know
but anyways like no like let's do it for
real like we got to build a crud app you
know create read update delete like
every app that most of us write we all
write crud apps all day long we're going
to need some structured data for our
customers and whether they got a gift
box or not fine
where should we put that it'd be kind of
rad to use air table i don't know if any
of you have seen this there's a great
little app it's spreadsheet like base
they have a great ui which is just cool
on its own but they have json apis for
all that data so if we run a cheap easy
solution like that we're going to make a
little crud app using air tables great
for that but airtable also has api keys
that you probably don't want to put in
your client-side javascript you can but
not great you know this is like your
private data airtable has also great
apis they run node you can make a a
cloud function that does all the crud
stuff
for airtable and pull and push data like
oh they got their gift box or whatever
that's a perfect use case for cloud
function this is another sarah drasner
demo where she made her and her team
speak at all these events so she made
this crazy webgl globe of where they're
speaking and when and all this stuff but
it you can run this anywhere you could
run this on a jam stack thing because
the way that she did it was basically
built a little crud out the data store
in this case is just a json file but she
made a little ui for adding and updating
stuff that run cloud functions in azure
in this case and then it's a view app
again on the front end let's say you
want to build a blog like is
is do you have to run a static site
generator on jumpstack to have a blog or
is there other ways to do it of course
there's other ways to do it it's just
structured data and this is a you know
this worth googling we won't get into a
whole bunch but kit hodgsden made this
for us on codepen which is a way to spin
up a blog and
totally serverlessly so you can run it
on codepen which has no database or
backend functions or backend languages
remember but here's like monica was
talking about here's how easy firebase
off is it's like two lines of code
you're like oh cool now i have login for
my app great and now that i'm logged in
and authenticated i can write posts and
so now i'm writing a post and it's going
to turn that data into json send it up
to fire base and now i have a new blog
and it persists in the cloud right you
refresh this page that blog post that i
just authored
will be there so a serverless blog how
cool is that
i did it all on codepen this got me
empowered too i'm like i'm gonna make a
food log i could download one of them
two billion of them on my phone or
whatever but i'll write one myself just
to see if i can do it so i use firebase
i have off now i type in what food i ate
what calories
and it saves it to firebase and it
stores it by date and adds up the
calories for me and all that stuff
that's so empowering that is me kicking
down the door of what i'm able to do as
a front-end developer and it's badass i
think
anyway i just called myself a badass
which is
not the case so you want to send
notifications for your app we already
talked about sending sms but what if you
are writing a bug tracker and it needs
to send a slack notice or an email
notice or whatever it's the same kind of
thing you build cloud functions that do
that job that's what this world is all
about these days you can make this work
that roadblock can be gone for you how
does slack do it slack wants to he wants
you to hit a url too you want to send a
message to a slack channel they're just
like here's the url hit it with your
data and we'll do that for you so you'd
write a cloud function that hit their
url and does the job you know we're not
looking at the code here we're talking
about empowerment what you can do
there's
sending email there's things like mail
gun and spark post and send grid they're
just apis for sending emails what do you
think we're going to do we're going to
write a they're going to give us some
node code we're going to put it in the
cloud function and now we have a url
that we can post to that will send an
email
so now we have this bug tracker app that
we're going with so anyway we talked
about web tasks that was a really easy
way to get started with them and feel
out what they are we looked azure's got
cloud functions firebase will run them
google cloud functions aws lambda is
probably the biggest provider of them
and nullifies got them of course too
which is really rad because it's so easy
on netlify you just put your
function.js
in a folder called functions kick it to
your netlify and now at your website
like it just makes a relative url that
you can execute that function through
lambda it's like the easiest way ever to
get started with cloud functions they
really did a good job with that
which is cool so it's another way to get
started with with cloud functions how
much is this stuff going to cost i think
this is funny so for like a hundred
thousand times if we hit our cloud
function to send an email a hundred
thousand times
and it ran for half a second each time
which is way longer than it'll take to
run and it uses 512 megabytes of ram
which is way more than it'll ever need
we're looking at like 50 cents
so pretty affordable i'd say in the
the terms of of this kind of stuff it's
not always the right answer but for this
kind of stuff it's pretty no-brainery it
reminds me do you all watch carlton
catch fire if you didn't you should go
home tonight and watch all of it because
it's the best show ever but in like
season four they they kind of invent
this concept in the 80s they're like
these big computers are just sitting
around doing nothing at night we should
have them
run we'll sell the time the unused
computer time which is kind of what
cloud functions are i think you know aws
has all these servers sitting around
that are pre-bought and not doing
anything they're like well they're
they're are doing something they're
executing my cloud functions when i need
them
anyway so look look now we're little
architects we have this bug tracker app
or whatever that sends
sms messages and it sends emails and it
sends slack messages and we've written
cloud functions for each one of those
things oh but we found this cool
abstraction mailer so instead of using
spark posts apis directly we'll use this
abstraction that way if we need to
change providers we can we're like oh
yeah i'm totally going to use that so
now my mailer function isn't tied to
spark posts but it's kind of an
abstraction cool and then like i don't
know it's weird to have our client be in
charge of calling all these apis
directly why don't we write a cloud
function that's like
just a notifier
and we send say okay notifier i want you
to send an sms to this location and so
it can kind of be like a little router
for all these things just to give
ourselves a little bit of abstraction in
here and all of a sudden we're thinking
we're like freaking architects all of a
sudden we haven't learned anything
really but we
all of a sudden we're like back end
developers too you know
uh which is great so we got to close
this thing down it's half an hour it's
not
out of breath you know serverless it's
this ingredient list it's not like if
you go serverless or you go jam stock
you have to do all of it but it can do
all kinds of interesting things and it's
incremental adoption for days you can
just oh that looks nice i'll have one of
these in one of these
you know it's not just for hobbyist
things it's not just for crazy
enterprise sites it's for everybody it's
amazing how i've seen the usage of this
serverless jam stack stuff all across
it's not for it's not prescriptive any
type of website you know there's very
clearly people doing gem stock for
publishing of like lots of content
blog type stuff publication type stuff
and clearly it's for web apps whatever
those things are people are using the
crap out of that stuff so it's it's just
everybody's using it in some way the
perf story is so great for it especially
on something like nutlify or your whole
site like the document will come back
like that and then the rest of it is
like for you to screw up
uh
and the security is so great you know i
lo that's one of the things i totally
love about jam stack is it's not like oh
my god how am i going to secure this
database what file permissions should
these php files be
like what way what where are bad guys
knocking on the door of this website
that i don't know about i hate that
stuff i don't want that to be my job my
job has already gotten bigger as a front
end developer
and dealing with anything
security-related just isn't my favorite
thing to do so it's so nice that i can
feel powerful and not worry about it so
the kind of the point of this isn't that
everything that we've talked about at
this conference is the best thing in the
entire universe and you should do all of
it immediately it's about your brain
knowing what's up and what's out there
and being able to pick from that
ingredients list when you can it's great
your brain is now smarter that's the
dumb little website i made the power of
serverless dot info i have the twitter
annual css now how cool is that right
anyway that's
that's my whole talk thanks everybody
[Applause]
[Music]
[Applause]
[Music]
you