{"id":66,"date":"2022-02-25T10:09:54","date_gmt":"2022-02-25T10:09:54","guid":{"rendered":"https:\/\/hamtronmedia.com\/dan\/?p=66"},"modified":"2022-02-25T10:09:54","modified_gmt":"2022-02-25T10:09:54","slug":"firebase-9-heroku-koa","status":"publish","type":"post","link":"https:\/\/djnh.xyz\/dan\/firebase-9-heroku-koa\/","title":{"rendered":"Firebase 9 \/ Heroku \/ KOA"},"content":{"rendered":"\n<h3 class=\"wp-block-heading\">Just documenting this process for reference&#8230;<\/h3>\n\n\n\n<p>Because I find that every time I do it, I have to search ffor the same things. So, I just wanted to put all the info in one place for necxt time I do it. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\">First step was getting setting up the Firebase project, and then getting the serviceAccountKey.json <\/h3>\n\n\n\n<p>Next, make sure you have heroku account, and login.<\/p>\n\n\n\n<p>Here&#8217;s a link to getting started on heroku:<\/p>\n\n\n\n<p><a href=\"https:\/\/devcenter.heroku.com\/articles\/getting-started-with-nodejs\">https:\/\/devcenter.heroku.com\/articles\/getting-started-with-nodejs<\/a><\/p>\n\n\n\n<p>And here&#8217;s how to prep code for deploymen<\/p>\n\n\n\n<p><a href=\"https:\/\/devcenter.heroku.com\/articles\/preparing-a-codebase-f\">https:\/\/devcenter.heroku.com\/articles\/preparing-a-codebase-f<\/a>t:<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">So after:<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>npm init<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">and:<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>git init<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">And then installing these packages:<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>  \"dependencies\": {\n    \"@koa\/cors\": \"^3.1.0\",\n    \"@koa\/router\": \"^10.1.1\",\n    \"koa\": \"^2.13.4\",\n    \"koa-bodyparser\": \"^4.3.0\",\n    \"koa-static\": \"^5.0.0\"\n  }<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">I could then make a little ping app.<\/h3>\n\n\n\n<h3 class=\"wp-block-heading\">server.js<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>const Koa = require('koa');\nconst cors = require('@koa\/cors');\nconst serve = require('koa-static');\nconst bodyParser = require('koa-bodyparser');\n\n\nconst router = require('.\/router.js');\n\n\nconst app = new Koa();\n\napp\n.use(cors())\n.use(serve('.\/images'))\n.use(bodyParser())\n.use(router.routes());\n\n\napp.listen(process.env.PORT || 5000, () =&gt; {\n    console.log('Server started on Port 5000');\n});<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">router.js<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>const Router = require('@koa\/router');\n\nconst router = new Router();\nrouter.get('\/ping',ping);\n\nfunction hello(ctx){\n    ctx.body = {\n        returnData:\"Hello Curled \ud83e\udd4c\"\n    }\n}\n\nfunction ping(ctx){\n    ctx.body = {\n        returnJson:\"You just got pinged!\"\n    }\n}\nmodule.exports = router;<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">When the ping app works:<\/h2>\n\n\n\n<p>Create a new app from the heroku dashboard with the name you want. Then grab that address and:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>heroku git:remote -a example-app<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Add a Procfile:<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>web: node server.js<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Make sure app listens on the right port:<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>app.listen(process.env.PORT);<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Do commits, and then:<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>git push heroku master<\/code><\/pre>\n\n\n\n<p>I wanted to have it on main instead of master as the modern naming convention everywhere else, but I&#8217;ll save that for another time. Just have to remember that cause I&#8217;m used to using main now.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Thats It!<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Once you can ping the app live online, you can now develop locally knowing the production app is only a commit and a push away.<\/h3>\n\n\n\n<h2 class=\"wp-block-heading\">Now for firebase&#8230;<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>npm install firebase@9.4.1 --save<\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ Initialize Cloud Firestore through Firebase\nimport { initializeApp } from \"firebase\/app\"\nimport { getFirestore } from \"firebase\/firestore\"\nconst firebaseApp = initializeApp({\n  apiKey: '### FIREBASE API KEY ###',\n  authDomain: '### FIREBASE AUTH DOMAIN ###',\n  projectId: '### CLOUD FIRESTORE PROJECT ID ###'\n});\n\nconst db = getFirestore();<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Converting require to import:<\/h2>\n\n\n\n<p><strong>The alternative to:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code> var Foo = require('foo');\n<\/code><\/pre>\n\n\n\n<p><strong>is:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code> import Foo from 'foo';<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Forget everything I said about firebase!!!<\/h2>\n\n\n\n<p>Because it&#8217;s a node server application, I can just use firebase-admin package rather than separate web packages that represent different firebase versions (V8 or V9). <\/p>\n\n\n\n<p>So I ended up :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>npm uninstall firebase<\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code\"><code>npm install firebase-admin<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Remove all the previous firebase code and add:<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>import {theKey} from '.\/theKey.js';\nimport admin from 'firebase-admin';\nimport {getFirestore} from 'firebase-admin\/firestore'\nadmin.initializeApp({\n    credential: admin.credential.cert(theKey)\n  });\n  \nconst db = getFirestore();<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Just documenting this process for reference&#8230; Because I find that every time I do it, I have to search ffor the same things. So, I just wanted to put all the info in one place for necxt time I do it. First step was getting setting up the Firebase project, and then getting the serviceAccountKey.json [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-66","post","type-post","status-publish","format-standard","hentry","category-blog"],"_links":{"self":[{"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/posts\/66","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/comments?post=66"}],"version-history":[{"count":0,"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/posts\/66\/revisions"}],"wp:attachment":[{"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/media?parent=66"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/categories?post=66"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/djnh.xyz\/dan\/wp-json\/wp\/v2\/tags?post=66"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}