Getting Started with Firebase Hosting on the Web - Firecasts
HTML-код
- Опубликовано: 25 авг 2024
- Firebase Hosting is static web hosting tailored for developers. Every app deployed is automatically provisioned an SSL certificate, all content is cached in a global CDN, and deployed just takes one command.
David East gets your started with Firebase Hosting and shows you how to manage multiple environments with the Firebase CLI.
Firebase Hosting Web Doc: goo.gl/le7FXa
Add the Firecasts playlist! goo.gl/dGJ68p
Subscribe to the new Firebase Channel: goo.gl/9giPHG
I found this extremely helpful. Thank you for setting up a channel to teach this tool for someone like me who is new to web development. Also, the fact you can start for free. Awesome!
I really enjoy the video presentation here. The sounds and intro are solid, not to even mention I find the content very interesting!
using react + redux to create SPA to deploy on firebase . But quite excited about adding Progressive web app Features with service workers and push notifications w/ FCM.
The FCM video is in the pipeline!
My friend, I am having trouble deploying a web app. The ap doesn't show after getting deployed. It shows
You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!
We start a new project with angular 2 / firebase with e-mail auth, storage... Thanks David ! For all tips
Are you using the AngularFire2 library?
Actually, those emojis are pretty cool. Outstanding.
Thanks David for this video. I am currently using Angular 2 + AngularFire.
Are you using AngularFire2?
Yes AngularFire2
I'm really liking Firebase so far. My app will be a business owner financial management app, so I need to have real time updates across all devices, as well as allow paid users to store images on Firebase.
Are you using Firebase Storage for the images?
I am working on a similar sort of app. Is your app live?
Thanks for the videos, looking forward to see more!
Is it possible to associate database with apps like staging? So that when I type 'use staging' the database ref that I'm using in my code automatically works with staging' database?
Regarding the question - I'm going to try react + redux + firebase.
I did it! Simple and clean, am using polymer. thanks! keep em coming.
@AskFirebase How can I change the firebase config values based on where I'm deploying (staging or production). Thus the staging deployed app also uses the database of staging app. My current solution is to just comment one snippet of config code and uncomment another snippet of config code.
In angular you have a file called environment.ts and enviornment.prod.ts, in one file I have staging URL, in other i have prod firebase URL. Then I use ng build --prod if i'm building an app for production. And then that production app will point to the production database. Then I can deploy a production build to production hosting, and a staging build to staging hosting
Robert King cool. I'm also wondering though, how can I populate those secrets. I don't want to commit them to my repo
Hi Dave, using polymer here.
I'm using jquery-mobile (actually an older version), and hosting is working nice :) I selected the option to configure everything as a single page app and links are well resolved, although I used several htmls. The app looks fine on my pc browser.
after setting firebase tool by npm install -g firebase-tools,
terminal inform firebase login not found,why?
This is great, thank you!
Thanks for the tutorial! :)
Using angular2 with angularFire2, it's great!
Hi! I'm using Angular 1 (but thinking of switching to 2) to develop a small app for sports class scheduling! Great tutorials! Keep it up!
Doooooo it!!
u r awesome thanks for these wonderful tutorials
Firebase Hosting is amazing! :)
Using AngularJS, Great Tips, Thanks!
Did this work with your Angular app? templates and all?
Welcome to Firebase Hosting
You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!
Open Hosting Documentation
Why am i seeing this instead of the app?
Needed to move index.html to public folder and redeploy.
my index.html is already in public folder but still this message is displayed.
As it turns out you need to set the following during your "firebase init"
=== Hosting Setup
Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.
? What do you want to use as your public directory? public
? Configure as a single-page app (rewrite all urls to /index.html)? No
✔ Wrote public/404.html
? File public/index.html already exists. Overwrite? No
i Skipping write of public/index.html
? What do you want to use as your public directory? public
? Configure as a single-page app (rewrite all urls to /index.html)? No
_ Wrote public/404.html
_ Wrote public/index.html
i Writing configuration info to firebase.json...
i Writing project information to .firebaserc...
_ Firebase initialization complete!
So annoying I can't get anything but this, "Welcome to Firebase Hosting' index.html. ugh.
have you solve this one? facing the same problem as of now
I guess Firebase hosting is for beginners. But definitely a lot of potential if you combine Firebase other resources. In other words, Firebase will be a new hosting provider for everything lol
What Pen are you using for this demo? Do you mind sharing?
how can i add X-Frame-Options using headers? i tried to add it in firebase.json but somehow its not working, can anyone share working example for it, e.g i need allow picassa album in a page and also a contact form hosted on some other site
hi David. yes please.
Very helpful, thanks. I will try this out with a Polymer app. Does the server support http2?
hello, quick question
is possible to deploy you website with additional folders that contains css files and client base js?
Is that possible to deploy the Laravel(deploy all project file in firebase hosting) project in firebase hosting and use the firebase database and storage?
Can Firebase also host the backend of Mobile applications written in Node.js + Express.js ?
who sets up their staging and production environments like this? I don't have separate applications for staging and production. i've never worked like this. usually this is done via a staging/master BRANCH in git.
which software did you use to run these commands
Angular 6+ for the win "!!
I didn't understand why when I left the public folder called "public" I still got a default firebase page, but when I renamed it to "dist" it worked as expected. That's my first question, and the second one is why not rewriting the default index that was placed there before?
It's good to know that we need to run firebase login first, otherwise, we won't get to link our local code to our firebase projects...
I have a question regarding deploying to different environments. Do I need to create a separate project for development purposes? If so then how do I keep the databases of the two projects synchronised since I'm using data from the database in my webpages. Lastly, isn't it an over kill to create two different projects for different environments? Can't we use the same project to make sure we have access to all the resources in each environment?
Where am I supposed to start? Can we get a 1 through 23 numbering on these videos?
Hello, Firebase creates default sub domains for the project. What security measures are set by default? Does it have WAS and protections against DDoS?
Does it have WAF (not WAS)? - sorry
How can I download code from firebase because my laptop has crashed..please help me sir I am in a trouble situation.i will very thankful to you..please reply answer...
I have a question : i have a PWA hosted on firebase everything works well. But when i modify my app and redeploy it, i always need to double cache clean my browser to see the new version of my app. I tried a lot of thing like adding { "source":"/service-worker.js", "headers": [{"key": "Cache-Control", "value" : "max-age=0, no-cache, no-store, must-revalidate"}] } in my firebase.json file
But it changes nothing. Why ?
Wait.... what's happening to stage 13?
It's sad there is no video or documentation on how to use google domains to host firebase.
Thanks David. I'm currently learning Polymer, and would really like to see how a PWA can integrate with Firebase.
So you'd like to see a PWA Firecast?
+David East i would!
and I also want to see how server side scripting is handled (like setting up emails) it's a big question for us right now
Thank you for this video.
I have a problem, when I’m trying to host de web. It doesn’t show the project’s name that I created. So I can’t choose any projects.
What can I do?
Thank you.
Is it possible to host a Flask app?
Need help please. And so I made a change by adding the H1 tag, added a staging successfully, deployed successfully as well. However, the changes are not visible. How could this be? Has this something to do with the servers or with some caching issues on my end?
Can u please share ur firebase.json and database.rules.json file as i m getting am error saying unexpected rules fornat.json
Awesome, couldn't be easier I guess 👍
when I go to the Firebase deployed site... it shows a very old version 🥺 I did the build. How can I get Firebase to update to the most recent deploy???
I use Angular 5 and electron
Do I use the normal terminal found when you search for Command Prompt??
can I use this to create a site that shows an excel and that excel can be changed given certain criteria? like if it is an admin trying to make a change it will occur on the spot, if it is another user then that user, another and the admin have to accept the change
using angular (because using ionic1).
My website after deploy showing this ->
Welcome
Firebase Hosting Setup Complete
You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!
with a button named "Open Hosting Documentation".Can you tell me the problem?
Is there a walkthrough for deploying react.js using webpack to firebase? I'm assuming that some steps will be different.
I did follow 4step
1.Create
2.install tools
3.init
4.deploy
it show > Site Not Found
How to fix this
Thank you
I hosted a website on firebase and then I deleted the project but the site is still up and running. I can't use CLI on this project because its deleted. How do I disable this website?
Can you make a vedio on how to fix url problem in android studio.I am not able to add firebase to app using tools table."Application not found error"
which should it allocate to whih projects , hangs my terminal
Angular2 + Angularfire2, but angular-cli + angularfire gives alot of errors with types, i think they shoud make it alot more stable so we don't have to make workaround all the time :)
am Task Manager at software development company and we use another web hosting servers so can we use firebase for all our products and the enviroments we use whether it's ASP.net, C#, Java, Android, PHP and more other if all of these is compatible on firebase it's would be our best option.
what's the firebase best practice for hiding the staging environment from the public? something similar to php htaccess user/password.
hello
I am trying to connect to connect custom domain with firebase web hosting but it always shows "needs setup".
Please help me
Hello,
I am building an app in Vue.js for my company.
I would like my staging environment to have separated databases and functions resources.
How can i manage these environments? can do that with "firebase use"?
Thanks
i have a question..
can i use firebase hosting for ecommerce site?
my use case would be i create an AMPed website that will use payment request API to accept payment.. only that..
the AMPed website,well you know..it is static and just to showcase the product..
as far as i know, i don't need to register any app..and for my case, the website will be more than one..
anyone knows about this?
Why HTTP Error: 400 ?
Hello guys,
I created a project with angular cli. I would like to know how to create the firebase.json file to use firebase hosting.
Which public folder do I need to indicate?
thank you
I had to use the following firebase.json because firebase deploy was complaining a trailing comma error in my firebase.json otherwise.
{
"hosting": {
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
]
}
}
Hi, I'm still wondering if it's possible to deploy a Php app on firebase hosting
Firebase is insane, really 🙌🏼 Can it also host a Wordpress website? How would I go about that?
Firebase can only host static files, so no PHP which is needed by WordPress to run.
Thanks Leo!
hello i use firebase first and i want to display all users. how i can proceed ?
on file firebase deploy having some files how to select your upload file.
exp: on my web site i have 7 files
so how to add 1 more file without upload all agin.
from 7 to 8
Help please, I can not run the 'firebase init' command
Authentication error is showing in PC when I try to run firebase login cmd.how to fix it
I know this is old but can you run a NodeJS app on this hosting?
i have a lot of problems trying to put my website online WITH FIREBASE.
someone can help me ?
Very old video and explanation! Lot of things missing in CLI options and commands while deployment!
Angularjs + AngularFire ftw
Anybody know why chrome is telling me "This page is trying to load scripts from unauthenticated sources"?, Thanks!
angular 8 still have to try this
Is it safe to put the API keys right in the public app like he is doing in the video here?
yup, only one instance of the app can run
What are the tools in your video?
So you have to create another firebase project just for staging? What a shame! Took me two hours to figure out.
I'm using Polymerfire
is this still useful in 2020 or its outdated ??
Error: No targets found. Valid targets are: database,storage,functions,hosting
any solution?
stackoverflow.com/questions/44323081/firebase-deploy-error-and-fiebase-json-empty-file
Man, after secound deploy change made in file only reflected in my device and not in other peoples phones.
#ASKFirebase I deployed my Web app but all i see is welcome to firebase hosting how can i fix this?
Can i host opencart webapp on firebase hositng?
Hi,
I would have to do to upload content of heavier folders, I talk about 200MB of information, which would have to do ??
If you just need to store assets and not serve an actual website, I would look into using Firebase Storage.
Can anyone create a video tutorial about adding a domain name in firebase where domain name is bought from namecheap?.
Good!
Welcome to Firebase Hosting
You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!
I AM UNABLE TO OPEN DEPLOY index.html file after deploy command and all.
Please reply asap AS i have urgent to deploy Live site so.
why is there 2 diff vids for this
We updated the CLI after the Google I/O re-launch, so the getting started instructions are way different.
Oh I see. Figured it out. Thnx for the feedback!
Deploy java project of spring framework. Please help me.
What you say if I want host wordpress my own example.com domain name
Am I alone in finding black text on a dark grey background difficult to read?
i deploy it and it comes up with
"Welcome"
"Firebase Hosting Setup Complete"
[OPEN DOCUMENTATION]
have you solve it?
how to deploy .net core webapi project to firebase? this .net core webapi project is a middleware that is responsible to get data from firebase realtime database then give it to UI.
What would be the proper setup for a NodeJs + AngularJs app?
why node js?? isn't backend part is taken care by firebase ??
Navu Kumar Yes, but I still need to manage things like emails etc.. And I dont want to the logic for each ios, android and web. That's why I still need nodejs. Does it make sense? :/
+Jofferson Tiquez hmm yup sorry didn't though about that
Navu Kumar Maybe you can help me with any ideas that you have? :) Any idea is greatly appreciated :)