Ben Austin simplesNotEZ

Static Site Deployment

These instructions will lead you through how to deploy a static website on firebase

Instructions

Sign up for an account on Firebase.
In your terminal, install the Firebase CLI tools. (This also updates you to the latest version of firebase.)

2021 Notes:

PREAMBLE: - make sure you have firebase cli installed: npm install -g firebase-tools in order to use the command line

Log into firebase and create a project: firebase login
- create a new firebase project in the firebase GUI in the console, or there will be an option to create it from CL later as an option during firebase init process.
Make sure npm isn’t running anything any place in any terminal
cd into the root directory of your project and run: firebase init
- Which Firebase feature do you want to use? Hosting

Associate this project dir w/ a Firebase project. [ A list of all your projects on Firebase will be output. Arrow down to the project and hit enter. ]

Setting Up New Project with Postgres, Knex, Express

All right, let's start :

-create a new repo on Github

git clone repo

-add a .gitignore and at the very least type in node_modules and .env

Make sure you have created a github repo for your project. Stage, commit, and push your files and changes to this github repo first. Then, from within the project directory:

$ heroku login //put in your credentials to log-in to heroku
$ heroku create (app_name) //this should automatically set-up a remote on heroku to push to
$ heroku addons:create heroku-postgresql:hobby-dev //this is required when deploying to heroku with a database
$ git remote -v

Set-up express project in folder

separate from any Galvanize forked & cloned project //so that your .git stuff is not mixed up with their .git stuff

$ npm init -y

//creates package.json which allows you to set-up your project dependencies--js libraries for your project

//create a start script in your package.json: "start": "node app.js"

//it may also be required to make sure that your "main" a couple lines above is like so: "main": "app.js",

Set-up github repo for project

-Create a separate repository in github

-Does your project have a package.json yet? If not, create one within your project directory:

$ npm init -y

-Create a .git directory in your project directory:

JavaScript Front-End-Framework Learning Materials

Video - Front-End | Face-Off

	Publishing Angular to firebase

	// Log into firebase and create a project
	// Make sure npm isn’t running anything any place in any terminal
	// Change to your angular app folder.
	//For me, I did the first dino drill in angular, and so I was in the version-1 folder, and my project folder was named drill1angular. So, from the version-1 folder, I typed `cd drill1angular`
	ng build --prod
	// creates a build folder and merges files into a compact build version.
	// Now...cd into your dist/project-folder. Again, I named my project folder drill1angular, and since I was already in version-1/drill1angular, I typed cd dist/drill1angular. _Yes, now there's two project folders named the same thing that are in different places._ Make _sure_ you're in the project folder inside the dist folder. For me, that path was version-1/drill1angular/dist/drill1angular
	firebase init

	Publishing react to firebase

	// Log into firebase and create a project
	// Make sure npm isn’t running anything any place in any terminal
	// Change to your react app folder
	npm run build
	// creates a build folder and merges files into a compact build version
	firebase init
	// select hosting
	// select your project

	# Logs
	logs
	*.log
	npm-debug.log*
	yarn-debug.log*
	yarn-error.log*

	# Runtime data
	pids
	*.pid