How to host a website for FREE - Google Firebase Website Hosting Tutorial Step By Step for beginners

Поделиться
HTML-код
  • Опубликовано: 22 окт 2024

Комментарии • 520

  • @SameerSaini
    @SameerSaini  4 года назад +32

    Thank you all for taking out the time to watch my videos. If you like my content, please hit the like button and do subscribe to my channel to get the latest content.
    #WebHosting #WebsiteHosting #HostAWebsite #GoogleFirebase #GoogleCloud

  • @crispysquared
    @crispysquared 2 года назад +35

    As a Firebase beginner, looking to just get a website going, I found this to be an incredibly helpful and well-structured video. I especially appreciate that you were able to make it less than 10 minutes without compromising on the necessary details. Thank you!

    • @SameerSaini
      @SameerSaini  2 года назад +1

      Thanks. Glad you liked it. :)

    • @CforChillandCheese
      @CforChillandCheese Год назад

      ​@@SameerSaini would you mind to share the prerequisites for hosting this web app?

  • @xycoordinate
    @xycoordinate 7 месяцев назад

    Perhaps the best tutorial on Firebase static website hosting on youtube and on the web. Thank you Sameer!

  • @IshanSamarasinghe
    @IshanSamarasinghe Год назад +4

    Straight to the point and no bs. Thanks man.

  • @RajkumarDgupta
    @RajkumarDgupta 3 года назад +22

    after editing.. hit command "firebase deploy" again in cmd

  • @kenjoseph3746
    @kenjoseph3746 2 года назад +6

    Just came across this. Very good Sameer. Well structured and well paced. Good job!!

  • @bryanarc99
    @bryanarc99 Год назад

    By far the best introductory Firebase web hosting tutorial

  • @jerryreasner5847
    @jerryreasner5847 Год назад

    Great Video! I will say that after building a web site with a different host, using Firebase does appear to be a simple process if all I wanted to do was build a simple HDML based web site.

  • @thynguyenxo
    @thynguyenxo 3 года назад +7

    THANKYOU! Your video helped me a lot with Firebase setup :)

  • @HoyosJuan
    @HoyosJuan 2 года назад +4

    Nice! Directly to the point, no wasted time and it worked nice! Thanks

  • @raghavendrajangam3923
    @raghavendrajangam3923 3 года назад +11

    My setup is successfully done but when I search given URL it shows only welcome Firebase Hosting Setup complete Open Hosting Document why ?

    • @omarsaravia4209
      @omarsaravia4209 2 года назад

      Because your app most likely defaults to the /dist folder when the application builds. You need to configure the build to go into the /public directory instead. Or you can manually move the files in the /dist folder to /public after each build and then deploy it.

    • @abhishek5222
      @abhishek5222 2 года назад

      did u solve this problem?

    • @Nitisharav
      @Nitisharav 2 года назад +1

      In your public folder, remove default index.html

    • @Harmxn
      @Harmxn 2 года назад +1

      @@abhishek5222 Firebase hosts the Index.html file.
      Remove Firebases index.html, so it hosts YOUR index.html

    • @Alishba_Nadeem
      @Alishba_Nadeem 2 года назад +1

      @@Harmxn this comment helped me alot thanks much

  • @rahulkushwaha815
    @rahulkushwaha815 3 года назад +7

    best tutorial on Firebase Hosting.. Thank you so much Sameer.

  • @sabyasachisahu6730
    @sabyasachisahu6730 3 года назад +3

    Thank you @Sameer.. This is really helpful video. I am beginner coder, hence this is really helpful to refer this video everytime I am making changes to my website.

  • @rahulkushwaha815
    @rahulkushwaha815 3 года назад +4

    while deploying on Firebase ,use firebase diploy --only Hosting . Firebase deploy will return error with Blaze plan some times.

    • @SameerSaini
      @SameerSaini  3 года назад

      Thanks for the suggestion Rahul, Cheers

  • @abhixguitar4444
    @abhixguitar4444 3 года назад +4

    Thank you so much for this much detailed tutorial!! I have a query, actually I am able to deploy my application like this but I want to use my existing domain name which I already have. Can u please suggest option to use the existing domain. This domain is registered with Google itself.

  • @zer0blivi0n
    @zer0blivi0n 2 года назад +7

    What an amazing helpful video! Thank you so much! 💯

  • @akshitagarwal9907
    @akshitagarwal9907 3 года назад +9

    Thank you so much sir for making this video.. It helped me a lot in my project...
    But i wanted to know one thing how to deploy the changes that we make after a successful deployment ?

    • @SameerSaini
      @SameerSaini  3 года назад +3

      Apologies for missing your comment here. If you have changes to your website, just update your website locally and make sure you place the updated files in the public folder (or whatever name you have given yours) and then hit firebase deploy again. Firebase will take those files and deploy it. Your changes will be reflected on the hosted website. Hope that helps

    • @samselvaraj8171
      @samselvaraj8171 3 года назад +1

      @@SameerSaini Also it hosts from the google server only right? So can I delete the files from my PC later?

    • @peoples.say.masoom
      @peoples.say.masoom 3 года назад +1

      @@samselvaraj8171 Yeah bro firebase usually uploads our files on internet so we can delete those files but if you wanted to change them than you should have access your last project which will be better to have in your PC.
      I hope this comment will be helpful for u.

    • @royalfamily2839
      @royalfamily2839 2 года назад

      @@peoples.say.masoom good answer bro

  • @arielmoisesmaradiagarodrig9707
    @arielmoisesmaradiagarodrig9707 2 года назад

    I see this message , instead my website "You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!"

  • @spacemulecode5861
    @spacemulecode5861 2 года назад +5

    I have probably watched this ten times! best instruction to simply deploy websites with firebase thanks! always a good reference

    • @noheeps
      @noheeps 2 года назад +1

      If it was great you were only going to watch it once.

    • @wintendedgamer2328
      @wintendedgamer2328 2 года назад

      ​@@noheeps lol this s--t is right

  • @RheCode
    @RheCode Год назад +1

    thanks man, it's really helpful!

  • @adri8115
    @adri8115 3 года назад +7

    Hello, I have a problem, it says: "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!"
    What I have to do? Please I need help. Thanks

    • @SameerSaini
      @SameerSaini  3 года назад

      This is happening because you have replaced your index.html with the default index.html that firebase offers. Redeploy the application using the same steps and this time the index.html in your (public) folder will override what you are seeing. Let me know how it goes

    • @aarjith2580
      @aarjith2580 3 года назад +2

      same problem here, did you find a solution?

    • @Vandousckie
      @Vandousckie 3 года назад +2

      @@aarjith2580 i got the same problem but i fixed it ,when he ask you"What do you want to use as your public directory?" you should write "public" or any other folder that contain "index"

    • @aarjith2580
      @aarjith2580 3 года назад

      @@Vandousckie Thankyou bro

    • @Vandousckie
      @Vandousckie 3 года назад

      @@aarjith2580 you are welcome

  • @kikomekomarcella5665
    @kikomekomarcella5665 3 года назад +1

    Everything went well but the CSS didn't work. Was requesting for some help about that problem

  • @edwinkreattor8675
    @edwinkreattor8675 3 года назад +3

    Thank you Sameer for the tutorial. Now I can deploy my demo work..

  • @TamaOne
    @TamaOne 2 года назад +1

    2022, works perfectly! Thanks for this video!

  • @TheCoachis_BA
    @TheCoachis_BA 2 года назад

    Thank you for your help. I do wish you could do another video with the updates. I still can't get mine to work with the extra steps they ask for.

  • @petershetematjila7633
    @petershetematjila7633 2 года назад +2

    Straight to the point. Thanks.

  • @sahilgupta9378
    @sahilgupta9378 2 года назад

    Will this be available on google search???? and Please tell how to connect Domain if we already have

  • @Gnsd45
    @Gnsd45 2 года назад +3

    I followed all these steps, but upon copying my website url from cmd to the browser (which for some reason has some random characters also added next to the name that i have set), instead of seeing my website i am seeing a window with a "Firebase Hosting Setup Complete" message with an "open hosting documentation" button that just sends me to the hosting section of the firebase site. Why is this happening, how can i get my website up and running?

    • @waqarhaider6820
      @waqarhaider6820 Год назад +1

      bro did you resolve it?

    • @maddyshorts267
      @maddyshorts267 Год назад

      Bro Did you resolve it?

    • @Gnsd45
      @Gnsd45 Год назад +1

      @@maddyshorts267 i dont remember the details with this method but i saved my self from all this bullshit from braindead methods that cant make it work properly and easily and i just went to netlify insteaad

    • @maddyshorts267
      @maddyshorts267 Год назад

      @@Gnsd45 thanks

  • @talhatariq5530
    @talhatariq5530 3 года назад +1

    Really! Million Dollars Video .. Saves my time a lot. Thank You so much.

  • @Its_sarthak_again
    @Its_sarthak_again 3 года назад +1

    Thanks dear it is 100% working.
    Pls make more tutorials like this. ❤️

  • @marcuspoon4525
    @marcuspoon4525 2 года назад +1

    thank you, watching your video is way easy than reading docs and faster,lol

  • @andrewg1445
    @andrewg1445 Год назад

    HEY! Thank you for this!

  • @sp3ct3r71
    @sp3ct3r71 2 года назад +1

    crystal clear video.. please make video also to how coonect firebase database with our firebase host application

  • @serixofficial
    @serixofficial 2 года назад

    Is it working for Dynamic website?
    If we embed machine learning code in the webpage...
    Is it worked or not?

  • @hassyddevil
    @hassyddevil 3 года назад

    Hey man do we need to buy node server or keep node server on our pc on for this to work?
    Will it work with pc turned off

  • @anirudhganesh
    @anirudhganesh 3 года назад +3

    do I remove the project if I want to remove it from public? is there a way to disable it temporarily so that I can edit my site and re-enable it? Awesome video

    • @SameerSaini
      @SameerSaini  3 года назад +1

      Yes, totally possible,
      Run "firebase hosting:disable" from the firebase CLI and this should disable the website. Then you can go to firebase.console google website and under the hosting tab from the left menu, go on and delete the deployment.

    • @advancexz0
      @advancexz0 3 года назад +2

      Hi, I dont know how it works, im relatively new on this, but there is this beta feature: 'firebase hosting:channel:deploy preview_name' to test changes before going live

    • @SameerSaini
      @SameerSaini  3 года назад +2

      @@advancexz0 Thanks for the contribution. Appreciate it :)

    • @anirudhganesh
      @anirudhganesh 3 года назад

      @@SameerSaini Hi Sameer, Thanks for your reply. Do you know where the files are stored in firebase? Few images are not appearing when I deploy the site but works fine in the local machine. I have those images in a second level folder (eg: folder1/folder2/image)

  • @ManpreetKaur-py8id
    @ManpreetKaur-py8id Год назад

    Thank you so much for this information it helps a lot to me

  • @kingsaabh
    @kingsaabh Год назад

    After hosting can other be able to visit our website on google by simpley typing the name like for other website do....???
    Or it is just same as github hosting

  • @raghavendrajangam3923
    @raghavendrajangam3923 3 года назад

    I followed all the steps correctly

  • @lacihor8039
    @lacihor8039 Год назад

    Thank you my friend !

  • @nannenymous
    @nannenymous 2 года назад

    I was able to deploy my first firebase app using your tutorial! Now I have another one I want to deploy but the terminal is still referring to my first project. How can I connect the second one and deploy it?

  • @KailasSBhat
    @KailasSBhat 3 года назад +4

    thanks mate!

  • @bkr_418
    @bkr_418 2 года назад +1

    This was very helpful, thank you.

  • @arturxurshudyan9179
    @arturxurshudyan9179 2 года назад +2

    I do not succeed, instead of the site it says Welcome
    Firebase Hosting Setup Complete․ What should I do?

    • @SameerSaini
      @SameerSaini  2 года назад

      Use the same firebase command again, make sure your index.html is in the public folder

  • @rtabhinaya2858
    @rtabhinaya2858 4 года назад +2

    Was searching for the same. Doing great keep going...!👍

  • @thegamedevclub
    @thegamedevclub 3 года назад

    Hey ladies and gentlemen, i hope the following description is clear enough... i am trying to use the command "firebase init" with the right path of my project select. I am using windows and use the windows terminal as i am not able to do "firebase login" with the vs terminal. I also use the commend "firebase use --add" to select the right project. I select build for the direction folder while initializing and everything seems to work well but it does not create a firebase.json file. Neither in the project nor anywhere else on the device. Can someone pls help me🙏

  • @Savedbygrace777-k9u
    @Savedbygrace777-k9u 2 года назад

    Thank you so much!

  • @rahulgawale
    @rahulgawale 2 года назад

    Very nice, thank you! Should I also deploy the pages for authenticated users in the public folder?

  • @abdousamadhydara
    @abdousamadhydara 3 года назад

    Nice! keep it up, I cannot installs "npm -v" I don,t know why?

  • @123kingvlad
    @123kingvlad 2 года назад

    what if made changes to the index HTML or any files? should I just redeploy?

  • @nllentfaw
    @nllentfaw 3 года назад +2

    Amazing tutorial. Thank you so much!

  • @nishantkumartiwari6025
    @nishantkumartiwari6025 Год назад

    Really a very helpful video, your channel deserves more subscribers and it will happen for sure. One permanent subscriber of your channel increases today.

  • @thabopitso7245
    @thabopitso7245 3 года назад +1

    Thank you Sameer for the tutorial

  • @Violethood
    @Violethood Год назад

    Yeah it's working great. Thanks. But how can I remove .html extension when I open new page ? can anyone help

  • @proflead
    @proflead 9 месяцев назад

    Nice one! Thanks! 😀🙏

  • @sarthak.5966
    @sarthak.5966 2 года назад

    Thanks. It works!

  • @MyGURUPREET
    @MyGURUPREET 3 года назад +1

    I have separated the files in folder like HTML,CSS,JS do it will take the HTML file in that case ,also please suggest which file path should I have to give inside the project where I have 3 folders - HTML,CSS,JS or inside HTML folder ? please reply fast

    • @SameerSaini
      @SameerSaini  3 года назад +2

      for any hosting server, the starting point is an index.html, this has to be in the main folder outside the HTML folder in your structure, only then it will have a starting point

  • @tazulislam2698
    @tazulislam2698 2 года назад

    It is helpfull indeed. But will it run python, php and node.js? Please!

  • @rick_from_yr
    @rick_from_yr Год назад

    Extremely nice video, thanks a lot

  • @kennw3244
    @kennw3244 2 года назад

    can you please do a demo using a mac? What steps would be different?

  • @noureddinhariri2979
    @noureddinhariri2979 2 года назад +1

    thanks Mr Sameer it was so helpful !

  • @griffnetstudios1123
    @griffnetstudios1123 Год назад

    the command isn't working, what do I have to install before coping those command texts

  • @Shubham-gu3uw
    @Shubham-gu3uw 4 месяца назад

    Sir i wanted to deploy (Angular + .Net api + SQL) website can i deploy on the hostinger because in my local i am using a separate port for api and one separate port for angular please guide

  • @hifaaz9346
    @hifaaz9346 3 года назад +5

    thanks for this amazing tutorial just have a small query.
    Is it possible to change the firebase cli features later in the future ? if yes can you tell me how
    thanks again

    • @SameerSaini
      @SameerSaini  3 года назад

      If this is for another app, you would have to set up the features for that app separately, if this is for the same app, you would have to delete the firebase file in your local system (inside your project) and then start this process again.

  • @mohitkumarbansal3486
    @mohitkumarbansal3486 2 года назад +1

    thanks video helped me a lot

  • @MaryAdams-f9o
    @MaryAdams-f9o Год назад

    I am having a problem getting my public folder option when I use firebase init. Please advice

  • @S__DhruvTrehan
    @S__DhruvTrehan 2 года назад +15

    "You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!" What should I do next??

    • @SameerSaini
      @SameerSaini  2 года назад +1

      Great, now make sure the index.html file is in the public folder and then use the firebase deploy command again.
      It will surely work

    • @akasha1030
      @akasha1030 2 года назад +1

      @@SameerSaini it created an index.html page for me in public again I use firebase deploy command same result as before it comes what to do next

    • @promagician9914
      @promagician9914 2 года назад

      @@akasha1030 Replace all files in the Public folder with yours!

  • @vaibhavcs6084
    @vaibhavcs6084 3 года назад

    Thank you for the tutorials... So I successfully deployed my static business website through google firebase console..
    I have previously deployed my static website through google cloud storage. It was really tough way to deploy my website. But this video is really easy for hosting any website.
    I have some doubt regarding hosting url.
    I want my hosting url as same as my domain name. Can you help me to solve this. It will be really helpful for others and me too.

  • @asnawas6153
    @asnawas6153 2 года назад

    what is the time period for it bro??
    and can we host diff type of sites?? in fire base
    and can we change the domain name??

  • @PORKII-lw9um
    @PORKII-lw9um 2 года назад +1

    perfect, Thank you so much I appreciate it.

  • @AMCGKriSHnA
    @AMCGKriSHnA 2 года назад

    Hey!….I am having Ubuntu and I code on that so Is there any way I can host from Ubuntu?….like the configuration code is different in the Ubuntu Terminal I guess

  • @JimzZel
    @JimzZel 2 года назад

    Thank you for this video! :)

  • @Rahul-pf5kw
    @Rahul-pf5kw 2 года назад +1

    Thank you so much sir. It is really helpful. 😊

  • @foacademy9926
    @foacademy9926 2 года назад

    Brother very good information. Can we Enable in this Free Firebase website, Ad Networks like Google adsense and other Non Google Ad networks here.

  • @GeorgiKaralov1
    @GeorgiKaralov1 3 года назад

    Many thanks for the tutorial! I'm stuck at uploading the website. I don't know what files I need to create to upload :( I just want a basic html page to host.

  • @RajkumarDgupta
    @RajkumarDgupta 2 года назад

    "npm install -g firebase-tools" command works but after that "firebase login" is not working ..
    error: 'AppData\Roaming
    pm/node_modules/node/bin/node: line 1: This: command not found'

  • @omya222
    @omya222 Год назад

    Error: Failed to get Firebase project omkarqacv. Please make sure the project exists and your account has permission to access it.

  • @iben1195
    @iben1195 4 года назад +4

    I have a few backend scripts and npm packages, two collections, one database (using MongoDB) and the site is a single page application. Am not sure how to deploy this on firebase for free. Thanks though!!!

  • @bruskin9369
    @bruskin9369 3 года назад +1

    thanks

  • @FreeTips4
    @FreeTips4 2 года назад

    sir please give me background music otherwise tell me this video background music name

  • @gameflixzk9583
    @gameflixzk9583 2 года назад

    I tried hosting my website but everytime it get's to the 404 and index, the firebase log gets taken out and it just tells me that it couldnt find the 404 although I let him write it it says wrote 404. giving me this error: HTTP Error: 404, Requested entity was not found.

  • @mamamia2486
    @mamamia2486 2 года назад +1

    Sameer Saini... Please I need your help, firebase is not adding files to my project folder and I think that is the reason the hosted link is not redirecting to my page. What can I do about that?

    • @SameerSaini
      @SameerSaini  2 года назад

      Is it throwing any error message?

  • @retrowood1849
    @retrowood1849 3 года назад

    How can I signed out of firebase account? How can I create a bigger space on my laptop for an external space? Can I use a different gmail email logged o my laptop to create a firebase account on CLI?

  • @didiDanaila
    @didiDanaila Год назад

    Can I do this with a flutter web app that has data on firebase in the same project? If I want to update the web app?

  • @thiruneelagandan2799
    @thiruneelagandan2799 2 года назад

    The final step is done but when i copy my site link and paste it on chrome the page is not shown the link shows firebase site

  • @Learn_with_nikhilg
    @Learn_with_nikhilg 2 года назад

    Firebase hosting setup complete page is displayed and in public folder there is no firebase indext .html

  • @lemonyth
    @lemonyth 3 года назад +1

    I thank you so much for this tutorial.

  • @appugs2202
    @appugs2202 3 года назад +1

    Hy bro I have started to learn code and I'm learning it but I don't know where or in which should i code in my pc or create a website can u help me please 🙏

    • @SameerSaini
      @SameerSaini  3 года назад

      You should start learning HTML, CSS and then JAVASCRIPT, You need a free text editor called Visual Studio Code, Install that and learn HTML to start creating some websites. Try to watch my Login page video as a start.

  • @streemsofwater
    @streemsofwater 2 года назад +1

    Can I use Cloud SQL (SQL) with Firebase? Or if I use Firebase, am I bound to Firestore (NoSQL)?

    • @SameerSaini
      @SameerSaini  2 года назад

      Your static website can talk to an API and the api can talk to any database SQL or NoSql

  • @shivam7929
    @shivam7929 3 года назад +1

    Sir i hosted my javascript calculator on it but i can only see my page....
    its not functional like i can't perform any calculations

    • @SameerSaini
      @SameerSaini  3 года назад

      Hi Shivam, Have you posted all your javascript files as per the correct folder structure in the public folder? Can you press F12 in your browser when on the website and go to console to check what the console says?

  • @just_day583
    @just_day583 2 года назад +1

    After I select Use an existing project, I keep getting an error in firebase, that keeps telling me: HTTP Error: 401, Request had invalid authentication credentials. Expected OAuth 2 access token, login cookie or other valid authentication credential. Any idea what to do with this?

    • @SameerSaini
      @SameerSaini  2 года назад +1

      Logout from all the browsers, and login back using that command in the video, it's most likely confusing between 2 sessions

    • @just_day583
      @just_day583 2 года назад

      @@SameerSaini thank you so much, actually worked. You’re a livesaver

  • @EngHamseabdi
    @EngHamseabdi 2 года назад +1

    Thanks bro.👏

  • @TAMBAMGAMES
    @TAMBAMGAMES 3 года назад +1

    Really great. Make video on custom domain name

  • @RakibHasan-ry2qb
    @RakibHasan-ry2qb Год назад +1

    Thank you

  • @madebytl
    @madebytl 3 года назад +1

    Hello, sir, I have problems it shows like that 'firebase' is not recognized as an internal or external command,
    operable program or batch file. When I put firebase login

    • @rokketz_
      @rokketz_ 3 года назад +2

      Make sure you open Node.js command prompt and make sure you run npm install -g firebase-tools

  • @sasss7060
    @sasss7060 3 года назад +1

    very helpful! thank you

    • @SameerSaini
      @SameerSaini  3 года назад

      You're welcome!

    • @martynbirdem189
      @martynbirdem189 3 года назад

      ruclips.net/video/618R0L3OrnA/видео.html To initialize Firebase project using cmd

  • @DineshKumar-hd2ex
    @DineshKumar-hd2ex 2 года назад

    is that we also get monetization by hosting on firebase?

  • @nitheesha5253
    @nitheesha5253 Год назад

    Hai sir ,this is working for one main page but i have about section contact us section multiple web pages how to generate for those

  • @tanveeransari4510
    @tanveeransari4510 3 года назад +1

    I want my own custom url for the website. How i can do it?

    • @SameerSaini
      @SameerSaini  3 года назад

      Hi Tanveer, If you go back to console.firebase.google.com and under the hosting tab, you will find a add custom domain tab, click on it and follow the steps that google suggests.

  • @vanditha07
    @vanditha07 3 года назад +1

    thank you so much!!