Publish Angular App To Google Firebase - Easy Angular Website Hosting with Google Firebase

Рет қаралды 35,262

Күн бұрын

👉 Build ASP.NET Core Web API - Scratch To Finish
www.udemy.com/course/build-re...
👉 Build Amazing Apps With ANGULAR and ASP.NET Core REST API
www.udemy.com/course/real-wor...
👉 ASP.NET Core Razor Pages - Scratch to Finish
www.udemy.com/course/aspnet-c...
Real world full-stack application using Angular 12 and Asp.Net Core Web API course on Udemy -
In this video, we will deploy Angular application to the internet and we will use Google Firebase as our hosting provider.
Website hosting on google firebase is really easy and it's absolutely free.
The angular website that I am going to host today is a Student admin portal application that shows the list of students which the admin can filter, sort, and use pagination.
The admin can also add a new student and update an existing one, as well as uploading the image of the student from this application.
This lovely application is built with Angular and has an ASP.NET Core web api as it's backend talking to a sql server database using entity framework core.
I have a complete course on UDEMY where I create this full-stack application from scratch, and also publish this to Microsoft azure and google firebase.
The link to the course is in the video description below and students who use this link will get a staggering 90% discount. So hurry up.
Alright with that, let's go ahead and publish this angular application.
Let's browse to firebase.google.com
and login to your google account. Once you are logged in, click on the go to console button.
This will open console.firebase.google.com
Click on Add project,
and give a name for your project.
After that, click on the web icon and create a new web application.
Install Firebase Tools
Login to firebase using firebase login and authenticate using your browser.
Then in your terminal, initialize your project using firebase init.
Then build your Angular application using Angular CLI (ng build --prod)
Then use firebase deploy to deploy the application to google firebase.
As you just saw, hosting an angular application with google firebase is really easy and quick.
If you have any changes to your application, you just have to re-build your solution using ng build and deploy the changes using firebase deploy.
I hope you liked this video, press the like button if you did, share this with your friends, and subscribe to my channel to support. I will see you all in the next one.

Пікірлер: 59

@schub1dubymuller260 Жыл бұрын

Huge thank you for that video. Finally someone who explains it in an understandable way.

@brunorocha9898 2 жыл бұрын

Nice way to explain. Thank you

@SiLiDNB Жыл бұрын

Thank you, this is just what I needed.

@pranavjoshi7697 Жыл бұрын

Easy and straight to the point✌

@AakashYadav-oq3kk 9 ай бұрын

thanks man much appreciated!!

@dominik8195 Жыл бұрын

Thanks, worked instantaniosly

@rajeevkumararyan8138 Жыл бұрын

Hey man👨 your all steps or suggestion worked perfectly. i just want to say Thank you(very little sentence) and really appricate your work wish you a happy and healthy life for more and more content.

@ashutoshnakhe3318 Жыл бұрын

Thank you so much for your kind help 🤟

@ederraadmin4112 2 жыл бұрын

🙌🙌 Thanks for sharing

@mememaker376 9 ай бұрын

Thank you so much sir 🙏🏻😊

@Lee14G Жыл бұрын

Very helpful thank you!

@sunilkumarsatapathy8535 Жыл бұрын

Thanks for sharing 👍🏻

@entertainmentkiduniya3878 3 ай бұрын

Nice Tutorial

@ilaanisdead 2 ай бұрын

thanx a lot 🙏

@knowngate Жыл бұрын

thanks for sharing this, plz also share more on SEO with Angular website

@adamdono2090 8 ай бұрын

thanks this helped me

@wisnuhasenvironmental1236 9 ай бұрын

thank you so much 😇

@krishjotsarai425 Жыл бұрын

Hello Sameer can you please tell me how you get the backend and database running with this application? I want to see the students names on the Angular webpage. Thanks!!

@sajidbhat2374 5 ай бұрын

Thanks buddy - We also need to choose the firebase active project

@omamachohan4177 Жыл бұрын

Greae Today i hosted my first angular app

@ericnjanga3245 Жыл бұрын

Thank you.

@darrenjosiah9246 Жыл бұрын

2:39 Macbook users: *sudo* npm install -g firebase-tools 5:11 Angular 14 now uses: ng build --configuration production

@sajadch6526 Жыл бұрын

thank you

@azharsubaircinemas Жыл бұрын

Thank you

@user-nh5jy3eu7d Жыл бұрын

Thanks brother

@whyworld8328 8 ай бұрын

it is nice video problem solve just in one short

@technodt5024 10 күн бұрын

I have a browser and server folder inside dist, when I am running npm build it creates two folders so which path I should use from dist?

@GraphicalBoss 2 жыл бұрын

But where is your backend? How do you host that part for example MongoDB

@Roulbestyoutuber Жыл бұрын

Host your api in a vps

@imheretosleep 2 жыл бұрын

sam, how did you deploy the server?

@faizal786786 Жыл бұрын

nice

@DecentProgrammer 4 ай бұрын

Thanks for the video.

@SameerSaini 4 ай бұрын

You are welcome!

@federicocolarte593 8 ай бұрын

My friend, u're a fkng genius, thanks for this video

@TASHKILAGroup Жыл бұрын

thank you very much , asking god enter you jannah.

@s.r.yvenkatesh9069 Жыл бұрын

the firebase is asking to upgrad the plan to pay-as-you-go . do you have any clue please let me know.

@Knowledgeforu007 Жыл бұрын

same process pin to pin i tried as per your video only angular pages are showing backend not working.

@abdullahquhtani4247 2 жыл бұрын

Do you have time to do paid freelance task?

@Krkeek0 Жыл бұрын

What about the database?

@dipakpaudel216 2 жыл бұрын

i tried this method as well but it is only showing blank page, when i inspect, i can see of the document but the is not rendering in the browser. is there any way you can help me?

@SameerSaini 2 жыл бұрын

Re checj if you have copied the files in the dist folder and then follow the deploy command again

@riajmazumder4434 Жыл бұрын

having this error when runing firebase init and selected hosting from this but its giving me this error, some one plese help "Error: Must select at least one feature. Use SPACEBAR to select features, or specify a feature by running firebase init [feature_name] "

@velrajavelraja7663 Жыл бұрын

Bro Actually I implement Api On my projects After deployment Not shown Any details

@ravitejabachala2983 11 ай бұрын

Sir ng build command not working sir

@thatguyvin Жыл бұрын

Hi! For some reason ng build --prod doesn't work, are there any alternative?

@ritasipekikovacs4570 Жыл бұрын

ng build -c production or ng build configuration=production

@tatosarjveladze6298 7 ай бұрын

Today '--prod' doesn't work today is '--configuration production'

@pranjalmathur9355 Жыл бұрын

I did the same steps but after going to Hosting URL, instead of getting my application, I am getting Welcome page of Firebase hosting. Can anyone help?

@skaffen 11 ай бұрын

Same issue here

@pranjalmathur9355 11 ай бұрын

@@skaffen Hey, sorry i didn’t delete my comment but i was able to resolve my issue ! I was able to check my application on hosting URL ..

@rewiter-5017 10 ай бұрын

i can't see my app with hosting url too :C@@pranjalmathur9355

@adamdono2090 8 ай бұрын

instead of ng build -- prod use ng build if it doesnt work