Placeholder Image

字幕表 動画を再生する

  • I'm so delighted to be able to announce on ex speaker Chris Koya.

  • 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.

  • Sorry.

  • Hey, he was absolutely behind.

  • You know, so many of the resources that have taught me so much throughout my web development.

  • Korea no CSS tricks has become this Kanaan ical 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, courses ableto grasp it to see its importance, learn about it, produce content that is just so valuable for everyone on that has incredible longevity and just kind of sticks around eso it is kind of staggering to see 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.

  • Is Chris Koya?

  • Yeah.

  • You don't know You okay?

  • Wow, That was so nice.

  • That's a nice direction I ever got ever.

  • Um, yeah.

  • Who Flashlight, all powerful friend of Miller.

  • I've been a friend of dealer.

  • Prefer a long time.

  • It's very near and dear to my heart, and it's so cool what's happening in that front?

  • And developers are just getting so much more powerful in what we can do.

  • And that's what this we're gonna talk about for half an hour.

  • It's gonna be awesome.

  • I work at Code Pen.

  • Uh, do CSS tricks and chop talk shows.

  • Well, what does it say?

  • Bookmark this pages in that weird.

  • Do you see that?

  • Whatever that's annoying enough to fix.

  • There you go.

  • You want to read my evil Tiu there?

  • Someone cool.

  • So, like, before any of the stuff that we're going to talk about today from developers have already been super powerful.

  • We always had, like, a super important role in the on the construction of websites.

  • You know, like, uh okay, next go, buddy.

  • All of you.

  • X is important of you exes.

  • It's like the most important thing we can possibly deal with when making a website.

  • What is it like for the user's to use the front of developer crafts?

  • All of it.

  • You know like it's in a totally in our hands with the experience of using a website.

  • It's like performance that's on front and developers, primarily a big chunk of purpose, a front of development situation, all of excessive people can.

  • You can have specialists like Think about you X and wire frame stuff and do research.

  • But the putting it into a website is all from developers just like accessibility that's in front and developers hands with the execution of a design and integrating the animations and interactions and all that stuff.

  • That's all front and development work.

  • That's incredible.

  • We have so much work to do already front and 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 of the best job in the world being a friend and developer on.

  • 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 and developer, which means that you don't have some other skills.

  • Probably.

  • So there's some kind of, like roadblock to your front and development skills were 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 when, when does it stop?

  • Generally, it stops when you need, like some some hard core 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 of this conference, so I feel like it's just a CZ buzzword.

  • Ia's Jam stack is to some degree, so I'm gonna say a whole bunch just unapologetically, and I'm not even gonna give some caveat.

  • That's like, Well, they're still servers involved Boo Boo and I'm gonna do it.

  • I made a website called the Power of Server lis dot info that it's just a bunch of links and stuff, so don't worry about like jotting down links and stuff.

  • We talked 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 I'd say jam stock, but definitely of server list, which is this whole idea of cloud functions are so cool.

  • It's some Java script and you put it on a server, but not your server.

  • Somebody else and server, which is great.

  • And it's probably knowed, 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 the Earl of some kind.

  • You hit the u.

  • R L.

  • 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 bosses like Okay, we work at we work it food dot recipes or signing off.

  • You work on a recipe site and you're tasked with.

  • 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 friend of developer like I got this, I can do the design it.

  • I can do the u X for it.

  • I can build the form I can think about states I could do all this work, But at some point, my friend develop, I'm done and I gotta kick it over the fence to somebody who could, like, go the last mile and make it do the actual thing of sending a text message.

  • That's the road block that we're gonna kick over.

  • We're gonna be like Okay, Twilio.

  • That's the app that you used to send text messages.

  • Cool.

  • Got it.

  • That's the thing.

  • I'm a little afraid off like you don't know.

  • I don't know how to do that.

  • Seems like back and nerd stuff.

  • This is where my friend and skills expire and somebody else comes to help me like that.

  • That's what we're gonna we're gonna scratch out.

  • So how do we do it?

  • Well, it's not because Tulio announced that they have client side only AP eyes and we can just do it in the browser.

  • They don't have that.

  • They don't have that on purpose because you need a P I keys to deal with your twilio account.

  • Because if you're the FBI, keys are the keys to the kingdom.

  • If some bad person slides in here and steals your ap, Ah, keys for twilio, they're gonna context all of Texas to vote for Ted Cruz or something that you don't want.

  • Something bad is gonna happen to us if they get your A P I keys.

  • That's why you need to protect him behind server side code.

  • Uh, that's a traditional use case of why you need a server.

  • I need to protect my A p I 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 AP Eyes flickers.

  • Got an A p I.

  • You can use it to search first church for pictures.

  • You don't need any AP I keys.

  • You don't need a server for this.

  • This is all happening Client side.

  • This also makes you powerful as a friend and developer.

  • But it's not gonna help us in the twilio situation.

  • So we're gonna use the server, but not really.

  • We're going to use somebody else's, and we're gonna do it this way.

  • So that's our little clout.

  • What a cloud function is diagram.

  • We're gonna write our little javascript code.

  • We're gonna put it on somebody else's server, and we're gonna communicate with that via U R l's the Web's finest feature.

  • So if we're gonna run some javascript code and we need to put it on a server somewhere, whatever, why can't we just use the one that's already powering our recipe website?

  • Like Why?

  • Why not?

  • Well, because this is wine 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 note on it on purpose.

  • What's a RST website is running on?

  • Get up pages or code 10 projects are obviously nullifies the choice.

  • Here, I'm gonna dump all that crap in.

  • It s three bucket.

  • Guess which back end languages.

  • None of those things have all of them.

  • That was complicated.

  • None of those run any back and languages, you know, like get home pages will not run your python script.

  • Know if I will not run your PHP function Code pen projects will not run your know Java script 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 CD?

  • Ends edge?

  • No, 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 ups.

  • HTM the https that you don't have to frickin deal with.

  • It's such a pain, yet they're just very front and 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 Julio.

  • So let's serve Earless up server lift it up this website, which I have no affiliation with or anything.

  • It is just It helped me understand what a cloud function is, so maybe this will be useful to you, too.

  • It's called Web task dot io.

  • It's a little bit like code pennant that it's an editor in the browser so I can open up Web task and that 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 gonna do, it calls a callback in returns that data what's cool about what has second test it right in there, compress that run button, it'll run that function.

  • So here, I'm gonna post.

  • I'm gonna fake post to this piece of code, and I'm gonna pass it some form data, food, bar, whatever.

  • Hit the run button and I can see that it returns.

  • I can even console doubt logs stuff in there, and it returns a little piece of Jason for me to use.

  • Cool.

  • So now I have this like piece of node that I'm executing now, uh, but that note is useless.

  • The node code I want is I'm gonna just go copy and paste them crap out of the Giulio docks because that's how I need to send a text message.

  • They'll have an N p m lib that you can just grab.

  • They'll have documentation.

  • That's just like, I don't know, fill in the blanks.

  • You know that it's their job to make this easy for you to use.

  • So here I've done it.

  • I just went to Coolio.

  • I'm importing Tulio from Tool.

  • You don't even know what that live does.

  • But I'm just following the docks.

  • You know, there's some a P I ke stuff in there, and I'm just gonna That's their documentation for how to send a text message.

  • Um 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 u R l to hit it that they've give you that.

  • Now I have a girl 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.

  • You just have a form I'm gonna post to that girl that they just gave me on.

  • I'm gonna ask her phone number to send it to and just pass it some value to send or whatever, and it has the submit button and that's it.

  • So I can run that on Code pen is 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 you know, I'm in Mac OS, so I have my message set up or whatever, and it's working.

  • 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, which is great, and so you and you don't even have to have it spit out crap.

  • I could have told that note 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 whatever post to the to the girl that I said and you send it some data and then wait for the response and do fancy animations on your page or whatever.

  • That's probably amore likely scenario, but it's kind of cool that you can do it with progressive enhancement to, 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 lovely little recipe for for oatmeal cookies.

  • So that's totally part of Gem Stack and server lis.

  • But this is this can get harder and easier than that.

  • Here's an example of getting a lot easier.

  • Let's say you need a form on your website that something else a contact form or something.

  • I need back end code to be able to deal with that.

  • So what do you used to?

  • We're gonna have to bright a cloud function and protect our A P I keys movable.

  • Sure, you couldn't do it like that.

  • But you don't have to, because this is a super old need on the Web.

  • Like people who needed to put forms on websites.

  • There's been startups to help them do that forever, so there's Google forms or whatever, and Wu fu and type, form and form Stack and John form There's a 1,000,000 APS to do this.

  • I think you know as old as the scene.

  • This is a part of jams act, 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 back and languages or anything else.

  • You know, I think that's part of this story as well.

  • I can take a wolf of form and have it work right on code pen.

  • It's just copy and paste code, and that's a fully functional, payment enabled form.

  • But I could host anywhere.

  • But there is, you know, Maura little bit Maur jammed stak e maybe is this idea that you could just bring your own HTML form and then just point the action attributes at one of these other service is like a new breed of form processors.

  • You just pass it that, and that's how form Carrie works and Paige clip and nullify 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 service's.

  • That's why this website, the power of surveillance dot info, exists so that it rounds up.

  • All these service is there's a 1,000,000 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 gonna use Shopify magenta.

  • Or is that the kids these days?

  • No, about magenta still.

  • Uh, but you don't really have to to like, how would you do, Jem?

  • Stak e e commerce?

  • How does that work?

  • Well, there's a 1,000,000 ways to cut it, but the easiest way in the universe is just abuse A By now button, I have little scarf.

  • So here's all the players, right?

  • We know them.

  • They were literally all here references, uh, papal isil scarfs.

  • I'm gonna put a frickin 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 then papal tells me about it.

  • So then I shipped them this car for whatever.

  • That's jam stack.

  • That's I don't need any back and languages to do this.

  • I'm totally enabled as a friend.

  • And developers have you commerce on my website the oldest way in the book, or you can get all fancy with it.

  • This is a Sarah Drasner demo where she, you know who's, you know, works for Microsoft and on Azure and is on the view core team.

  • This is a view demo where it's all dancy.

  • 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 in the cart has items in it, but you can actually check out.

  • And this isn't just totally faked.

  • She integrated this with stripes, so this is just using the fake stripe credit card number, but this would actually work in process code.

  • It's this thing else.

  • All the proper code is there to do it.

  • You pay with a credit card, and stripe is communicated with.

  • The card is actually processed, and it's doing all that kind of really commerce work.

  • But there's no server here.

  • This is still all jam stak e in the way that it works is that the back end is or the front is view.

  • The processing is strike, but the way that those two mics because, of course, striped has a P I keys that you need to protect.

  • You better help protect your stripe, a p I keys.

  • They're communicated with cloud functions, in this case on azure, so stripe again they want to help you do this.

  • The AP I docks 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.

  • Andi and the Azure has an interface.

  • I think this is probably an old issue screenshot.

  • I think it's been redesigned a little bit, but it's kind of cool about this.

  • Is that in this case you see how it's all kind of great out.

  • Sarah put these in a get hub repo, so her funk, her cloud functions are part of like the rest of her code base.

  • It's just she's shipping him upto 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.

  • Cool.

  • Kind of cool just cause we're talking about payments.

  • I think this is worth knowing about that.

  • Browsers have this new thing on the Web payment, a p I and the whole point of it isn't toe like they're not actually processing payments for you?

  • What browsers air trying to give you hear is free you Y u x for checking out from pages like they'll be your shopping cart and you're address collector and credit card information.

  • Except, er 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 now.

  • You know, the people have their saved addresses and saved credit cards and stuff.

  • It's, but it's just that you y u x you still need to bring your own payment processing.

  • So you still need stuff like, you know, serverless functions, to process your striped calls and all that kind of stuff.

  • But it's worth knowing about this.

  • That's a future Web stuff that works nicely in a jam stack situation.

  • So here's another one.

  • Let's say you need comment threads.

  • This might be a moment where you're like, Yeah, Jim stacks Cool.

  • But I need I literally need comments on my website.

  • So what am I gonna do about that?

  • I'm just going to give up and use WordPress or something, but no, but but comments are great structure 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 in the value of the comment and when it happened and whether it's approved or not.

  • It's great structure data, so sure, you could just reach for WordPress.

  • But let's assume that you're gonna use a static site generator instead that excite generators air so hot I'm gonna use middleman or there's a bunch of them.

  • They're all great.

  • There's Hugo and Gatsby's The cool one, right?

  • And there's Heck So and metal Smith and Jekyll and Middleman and eleventy is the new hot one, isn't it?

  • So, but But you don't you know 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 ISS you know there's the content lives in your repo.

  • It's a big pile of mark down files, actually, an interesting conversation last night, where it's not necessarily that it's just anything that returns a promise.

  • Can I think it's interesting conversation, but because so it wouldn't necessarily need to be a bunch of mark down files.

  • It could hit your content full a p I 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.

  • It like a bunch of files that you could put anywhere you put it in your s three bucket or let MetLife I 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?

  • Um, well, we don't really have a database at our command, so let's just put discus, 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 as such is kind of part of the the gem stock universe.

  • In a way, but like, let's really nerd this one off.

  • Like, let's go full bore nerd on the comment thread thing.

  • Let's wanna roll our own system.

  • So we're gonna use you.

  • Go.

  • She goes cool, right?

  • That's our static site.

  • Generally, when we're gonna 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 gonna turn into a piece of, like, structure data.

  • We'll just formatted as Jason, and we'll throw it up because fire base is great for that.

  • It's basically Jason based could just throw our, You know, I know there's more to it than this.

  • I'm being but on purpose, but we'll keep that data in fire base.

  • But it could be spam.

  • It could be garbage.

  • So we're gonna have a when that happens.

  • And of course, we'll do this through a cloud function.

  • You know that Shin will also hit slack and Slack will have a channel.

  • It will 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 approved, then maybe that cloud function then can hit, nullify and trigger a build.

  • That'd be kind of cool.

  • And during that build will 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 JEM, stocky and server Lissy and just kind of sweet and a little bit like that things around, but it's kind of sweet.

  • Ah, that's Phil's version.

  • Fills in school.

  • Feels feels, don't you?

  • Yes, it uses, um, like the nullify, like kind of, you know, when you use nullify forms that just uses nullifies the database 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.

  • Code pen uses the crap out of cloud functions.

  • Here's one of the things we use cloud functions for.

  • You could write in a bunch of different pre processor languages on code like your HTML.

  • You can write it.

  • Are any of these other languages your CSS?

  • You can write in popular CSS pre processor languages.

  • JavaScript to 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 Code Pen.

  • 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 service, is 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.

  • That's its own.

  • That's all it does in the world.

  • It's its own little job on.

  • Then there's a couple other languages out there that you know sass.

  • There's darts ass 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 code pen, uh, the ones that are on the left side of this screen are certainly.

  • Ah, kind of happier, You know that they're cheaper.

  • They're easier to secure their easier to scale.

  • They don't break that often.

  • It's not like that Stuff on the right is untenable.

  • Like we can manage it that we're in.

  • That's the business that we're in.

  • But certainly if you can run it as a cloud function.

  • Oh, for 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 cause we can let's say you need to be able to build a like a CR round like your boss is like a broken You build me like an app to track our customers.

  • And like, if they got a gift box or not for Christmas and you be like Yes, boss, I can, uh, no, no, like an app.

  • You know, you're like, Yes, I can build you that, you know, But anyways, like no, like, let's do it for real.

  • Like we're gonna build a crowd app, you know, create, read, update, delete.

  • Like every app that most of us, right, We all right?

  • Crowd APS all day long.

  • We're gonna need some structure data for our customers and whether they got a gift box or not.

  • Fine.

  • Uh, where should we put that would be kind of rad to use air table.

  • I don't know if any of you have seen this.

  • There's a great little lap.

  • It spread sheet like base.

  • They have a great you eye, which is just cool on its own.

  • But they have Jason AP eyes for all that data.

  • So if we run it, it's a cheap, easy solution like that.

  • We're gonna make a little crowd app using air tables.

  • Great for that.

  • But air table also has a P I 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 air table has also great AP eyes.

  • They run knowed you can make a cloud function that does all the crowds stuff for Air Table and Poland push data like, Oh, they got their gift box or whatever.

  • That's a perfect use case for cloud function.

  • This another Sarah Drasner demo where she made her and her team speak at all these events.

  • So she made this crazy web G L Globe of where they're speaking and when and all this stuff.

  • But you can run this anywhere.

  • You could run this on a gem stack thing because the way that she did it was basically built.

  • A little credit.

  • The data store in this case is just adjacent vile.

  • But she made a little view I 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 blogger is Do you have to run a statics like generator on James Tech to have a blogger 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, you know, this birth Googling We won't get into a whole bunch.

  • But Kitch Kitch Hodgdon made this for us on Code Pen, which is a wayto spin up a block and totally server list.

  • Least you can run it on Code Pen, which has no database or back, and functions are back in languages.

  • Remember, But here's like Monaco is talking about Here's how Easy Firebase Office.

  • It's like two lines of code.

  • You're like, Oh, cool.

  • Now I have log in for my app.

  • Great.

  • And now that I'm logged in and authenticated, I can write posts.

  • And so no, I'm writing a post and it's gonna turn that data into Jason, send it up to fire base.

  • And now I have a new block, and it persists in the cloud.

  • Right?

  • You refresh this page.

  • That blood post that I just authored will be there.

  • So a server list block.

  • How cool is that?

  • Did it all in code pin.

  • This got me empowered to him.

  • Like I'm gonna make a food log.

  • I could download one of a two billion of them on my phone or whatever, but all right, one myself just to see if I can do it.

  • So I used fire base.

  • I have off.

  • Now.

  • I type in what food I ate.

  • What calories on it saves it to firebase, and it stores it by date and adds up the calories form.

  • You know, that stuff that's so empowering?

  • That is me kicking down the door of what I'm able to do as a front and developer, and it's badass.

  • I think uh, anyway, I just called myself a badass, which is not the case.

  • So you want to send notifications for Europe?

  • We already talked about sending SMS, but what if you're running a bug tracker and it needs to send ah, 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 to slack Do it.

  • Slack wants you, wants you to hit u r l to You want to send a message to a slack channel?

  • They're just like, here's the earl.

  • Hit it with your data and we'll do that for you.

  • So you'd write a cloud function that hit.

  • There you are.

  • L 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 male gun and spark post and send grid.

  • They're just a p.

  • I s for sending emails.

  • What do you think we're gonna do?

  • We're gonna write it.

  • They're gonna give us some node code, We're gonna put it in a cloud function.

  • And now we have a you Earl 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 Webcast.

  • That was a really easy way to get started with him and feel out what they are.

  • We looked Asher's got cloud functions.

  • Firebase will run on Google Cloud functions.

  • A W slammed is probably the biggest provider of them.

  • And mala fides got them.

  • Of course, too, which is really rad because it's so easy on that left, you just put your function dot Js in a folder called Functions.

  • Kick it to your net lif I And now at your Web sites like it just makes a relative.

  • You are l 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 gonna cost?

  • I think this is funny.

  • So, for, like, 100,000 tile, if we hit our cloud function to send an email ah, 100,000 times and it ran for half a second each time, which is way longer than it will take to run and we use is 512 megabytes around, 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 this kind of stuff, it's not always the right answer, but for this kind of stuff, it's pretty no granary.

  • It reminds you all.

  • Watch Culleton catch fire.

  • If you didn't, you should go home tonight and watch all of it because it's the butts show ever butt in like season, for they kind of invent this concept in the eighties There, like these big computers are just sitting around doing nothing at night.

  • We should have them run.

  • You will sell the time.

  • The unused computer time, which is kind of a cloud functions, are I think, you know, AWS has all these servers sitting around that are pre bought, not doing anything.

  • They're like there 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 sensed its SMS messages, and it sends e mails and it sends slack messages.

  • And we've written cloud functions for each one of those things.

  • Well, but we found this cool abstraction Mailer.

  • So instead of using spark post AP eyes directly, we'll use this abstraction.

  • That way, if we need to change providers, we can.

  • We're like, Yeah, I'm totally going to use that.

  • So now my mailer function isn't tied to Spark Post, 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 AP eyes directly.

  • Why don't we write a cloud function that's like just a notify air and we send say Okay, notify.

  • I want you to send an SMS to this location, And so if 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 freakin architects all the sudden we haven't learned anything, really.

  • But we all of a sudden we're like back in developers too, you know, which is great.

  • So we got to close this thing down half a hour.

  • It's not how to breath, you know, server lis.

  • It's this ingredient list.

  • It's not like if you go server Lester, 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 could just who that looks nice.

  • I'll have one of these and one of these.

  • You know, it's not just for hobbyist thing's.

  • It's not just for crazy enterprise sites.

  • It's for everybody.

  • It's amazing how I've seen usage of this server list.

  • Jams deck stuff all across.

  • It's not for its not prescriptive, any type of website.

  • You know that there's very clearly people doing Jem stock for publishing of, like, lots of content, blawg type stuff, publication type stuff.

  • And clearly it's for Web APS.

  • Whatever those things are, people are using the crap out of that stuff.

  • It's just everybody's using it in some way.

  • The perf story is so great for it, especially on something like nullify 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, under the security.

  • So great, you know, lets one of the things I totally love about jams.

  • Stock is it's not like, Oh, my God, how am I gonna 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 friend and developer on 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 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 surveillance dot info.

  • I have the Twitter handle CSS.

  • Now.

  • How cool is that, right?

  • Anyway, that's that's my whole talk.

I'm so delighted to be able to announce on ex speaker Chris Koya.

字幕と単語

ワンタップで英和辞典検索 単語をクリックすると、意味が表示されます

A2 初級

すべての強力なフロントエンド開発者 - Chris Coyier (The All Powerful Front End Developer - Chris Coyier)

  • 2 0
    林宜悉 に公開 2021 年 01 月 14 日
動画の中の単語