How Firebase Cloud Functions support custom domains – #AskFirebase
Articles,  Blog

How Firebase Cloud Functions support custom domains – #AskFirebase


DAVID EAST: That is
good, and we are rolling. Oh man, it’s been
quite some time, but welcome back to a brand
new episode of “AskFirebase.” My name is David East. I haven’t done one of
these things in forever. And that framing
is just no good. That is just not what I want. Crossfade. Hollywood. Luis asks, #AskFirebase– it’s
been a while since I’ve done that– how long until Firebase Cloud
Functions support custom domains? Well Luis, at Google I/O,
we launched Firebase Hosting and Firebase Cloud Functions
integrated together. So now you can create
your cloud function, and then you can
write a redirect, and then it has its own awesome
custom domain or Firebase app domain, really kind
of whatever you want. So let’s actually
dive into the laptop, and we’ll see how it looks. So right here I just
have this basic project, and it has two folders. I have a functions folder
and a public folder. Public folder is the website. Functions folder is
my Cloud Functions. So if I go into
Functions, index.js, I can require from
Firebase dash functions, and then I’m going
to go and create my actual cloud function. So I’m going to say
exports.app, because that’s the name of my function. And I’ll set that to
functions.https.onRequest. And the onRequest method takes
a callback that provides you a request and a response,
which is pretty much all you need to make a website. So now I can take this
response and I can just send back some HTML. And now with that
saved, I’m going to go to my firebase.json. So here in
firebase.json, you can see that we just have
our hosting set up to our public folder. Well, I can go and
specify a rewrite. And so a rewrite takes
an array of rewrites, and so we’ll provide
the first object. So the first object, we’ll say
that the source of our rewrite is the slash hello location. And then whenever someone
hits the slash hello location, we’re now going to go to the app
function that we just created. So now in the command
line, all I have to do is write firebase deploy. And then once that
gets out there, we’ll go to our web
site slash hello. And then right there, that
HTML that we sent back, it’s right there
available in the browser. So that’s just a
little bit of what you can do with Cloud
Functions and Firebase Hosting. And one of the amazing
features of this is actually that you get
to set the cache control. So with traditional dynamic
hosting, you send a request, it sends you back a response. And then a request,
response, request, response. But with our Firebase
Hosting and Cloud Functions, you actually get to cache that
response on the CDN level. So that means the user
where they locally send that request
from, the response goes back to their
local CDN edge. So all the other
users in that area for that set period of time
can get a low latency response, which is just one of the amazing
reasons why you use Cloud Functions and Firebase Hosting. Great question, Luis. Next q– there’s supposed
to be a camera there. It’s actually kind
of dark in here. I’m going to see if I
can find some lights. Next question. I feel like there’s a
disturbance in the force. Oh my god, the Firebase picture. Next question. Mike says, for mobile,
is there any way to pre-populate the cache so
the initial sync with the server is minimal? So Mike, I’m
assuming that you’re talking about the
Firebase Database clients. And no, there isn’t actually
a way you can take some JSON and pre-warm the cache so
you can render items faster. But what you can do is you can
render your HTML on the server. And a little trick I like
to do is take each component and give it an ID that is
associate ID to the database. So if you have a list
of items, each list item will have its database ID. And so now what you can do
is you can find the last item and then run a Firebase
database query, and just keep appending those
items on to the bottom. So that way the user gets a
fast first render of their HTML and CSS content, and
then dynamically you can just add all of that real
time stuff on at the end. Great question, Mike. Man, just, it feels
so good to be back. I mean, for like, the
longest time, I just– MAN: David? [DOOR CLOSE] How did
you get into the studio? What are you doing here? DAVID EAST: I got to go. Make sure to like, subscribe,
comment, all those things, and I’ll see you later. MAN: Did you break
the picture frame? DAVID EAST: My bad!

31 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *