This post is the third in a series and was originally published on Dev.to.
FYI, I'm using a Mac, so there may be some Mac-specific commands.
Alright, part 3, deploying is the fun part. That’s when your site actually ends up on the internet. Like... people can visit it and stuff. It’s not just a project on your computer anymore. So let’s get into it..
Initialize Firebase on your site and deploy to Firebase
- Login to Firebase and create a project for you site. Make an account if you don’t already have one.
- Install the Firebase CLI and initialize your site's directory
- In terminal,
npm install -g firebase-tools
firebase logout(you may not have to do this step, but I did)
- Type 'y' to let Firebase collect usage and error reporting info. Type 'n' not to (I go with 'n') and press Enter
- Select your Google account that you use for Firebase
- In Terminal, the output should be something like
✔ Success! Logged in as [your.email]@gmail.com
cdto your site's root directory
- Select the Firebase project you created previously and press Enter
- For public directory, type 'public' and press Enter
- If asked to overwrite anything, type 'n' and press Enter
- Your terminal output should be:
- In terminal,
i Skipping write of public/index.html i Writing configuration info to firebase.json... i Writing project information to .firebaserc... ✔ Firebase initialization complete!
- Commit your changes to your repo
git add --all
git commit -a -m "Initialized Firebase"
git push -u origin main
That's right we committed right to main. Didn't fork and do a PR. You don't have to. I usually do, but didn't this time. It's a good habit to fork and PR though.
- Deploy your site to Firebase (when your site is ready to deploy)
firebase deploy --only hosting
- Your terminal output should be like the following...
=== Deploying to 'thtmnisamnstr'... i deploying hosting i hosting[thtmnisamnstr]: beginning deploy... i hosting[thtmnisamnstr]: found 135 files in public ✔ hosting[thtmnisamnstr]: file upload complete i hosting[thtmnisamnstr]: finalizing version... ✔ hosting[thtmnisamnstr]: version finalized i hosting[thtmnisamnstr]: releasing new version... ✔ hosting[thtmnisamnstr]: release complete ✔ Deploy complete! Project Console: https://console.firebase.google.com/project/thtmnisamnstr/overview Hosting URL: https://thtmnisamnstr.web.app
That's it for today. I'll post a tutorial next week on how to automate deployments with GitHub Actions. That was supposed to be part of this post, but I’ve been crazy busy at work (I ran go-to-market for open sourcing our instrumentation, and I ended up doing a bunch of work for our recent launch. Our new free tier is dope btw.).