(window.webpackJsonp=window.webpackJsonp||[]).push([[99],{621:function(e,t,s){"use strict";s.r(t);var a=s(56),r=Object(a.a)({},(function(){var e=this,t=e.$createElement,s=e._self._c||t;return s("ContentSlotsDistributor",{attrs:{"slot-key":e.$parent.slotKey}},[s("ul",[s("li",[s("a",{attrs:{href:"#hiding-our-mongodb-details-from-github"}},[e._v("Hiding our MongoDB details from GitHub")]),e._v(" "),s("ul",[s("li",[s("a",{attrs:{href:"#in-this-video-tldr"}},[e._v("In this video... (TL;DR)")])]),e._v(" "),s("li",[s("a",{attrs:{href:"#code-written-in-this-lecture"}},[e._v("Code written in this lecture")]),e._v(" "),s("ul",[s("li",[s("a",{attrs:{href:"#step-1"}},[e._v("Step 1")])]),e._v(" "),s("li",[s("a",{attrs:{href:"#step-2"}},[e._v("Step 2")])]),e._v(" "),s("li",[s("a",{attrs:{href:"#step-3"}},[e._v("Step 3")])]),e._v(" "),s("li",[s("a",{attrs:{href:"#step-4"}},[e._v("Step 4")])]),e._v(" "),s("li",[s("a",{attrs:{href:"#step-5"}},[e._v("Step 5")])])])])])])]),e._v(" "),s("h1",{attrs:{id:"hiding-our-mongodb-details-from-github"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#hiding-our-mongodb-details-from-github"}},[e._v("#")]),e._v(" Hiding our MongoDB details from GitHub")]),e._v(" "),s("h2",{attrs:{id:"in-this-video-tl-dr"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#in-this-video-tl-dr"}},[e._v("#")]),e._v(" In this video... (TL;DR)")]),e._v(" "),s("p",[e._v("Let's look at the steps we need to take to hide our MongoDB details from our GitHub repo.")]),e._v(" "),s("p",[e._v("We will use environment variables to do so.")]),e._v(" "),s("p",[e._v("By defining the environment variables in Heroku "),s("em",[e._v("and in our local computers")]),e._v(", we can take them off our code. That way, the sensitive data is in Heroku and our computers, but not in our code.")]),e._v(" "),s("p",[e._v("Therefore, when we share our code in GitHub, the data won't be there.")]),e._v(" "),s("div",{staticClass:"custom-block warning"},[s("p",{staticClass:"custom-block-title"},[e._v("WARNING")]),e._v(" "),s("p",[e._v("If you have already put your MongoDB details in your repository, then that data will still be there even if you change the files.")]),e._v(" "),s("p",[e._v("What you should do is re-generate your MongoDB username and password if you ever want to make your repository public.")])]),e._v(" "),s("h2",{attrs:{id:"code-written-in-this-lecture"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#code-written-in-this-lecture"}},[e._v("#")]),e._v(" Code written in this lecture")]),e._v(" "),s("h3",{attrs:{id:"step-1"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#step-1"}},[e._v("#")]),e._v(" Step 1")]),e._v(" "),s("p",[e._v("Create a "),s("code",[e._v(".env")]),e._v(" file in our project and place this in it:")]),e._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[e._v("MONGODB_URI=mongodb+srv://:@/microblog\n")])])]),s("h3",{attrs:{id:"step-2"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#step-2"}},[e._v("#")]),e._v(" Step 2")]),e._v(" "),s("ul",[s("li",[e._v("Install "),s("code",[e._v("python-dotenv")]),e._v(" and add it to "),s("code",[e._v("requirements.txt")])])]),e._v(" "),s("p",[e._v("Then load the environment variables in "),s("code",[e._v("app.py")]),e._v(" (before the "),s("code",[e._v("create_app()")]),e._v(" function)")]),e._v(" "),s("div",{staticClass:"language-diff extra-class"},[s("pre",{pre:!0,attrs:{class:"language-diff"}},[s("code",[s("span",{pre:!0,attrs:{class:"token inserted-sign inserted"}},[s("span",{pre:!0,attrs:{class:"token prefix inserted"}},[e._v("+")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v("from dotenv import load_dotenv\n")])]),e._v("\n"),s("span",{pre:!0,attrs:{class:"token inserted-sign inserted"}},[s("span",{pre:!0,attrs:{class:"token prefix inserted"}},[e._v("+")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v("load_dotenv()\n")])])])])]),s("h3",{attrs:{id:"step-3"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#step-3"}},[e._v("#")]),e._v(" Step 3")]),e._v(" "),s("p",[e._v("Instead of the MongoDB URI we've got as a string, use the environment variable by reading it from "),s("code",[e._v("os.environ.get()")]),e._v(":")]),e._v(" "),s("div",{staticClass:"language-diff extra-class"},[s("pre",{pre:!0,attrs:{class:"language-diff"}},[s("code",[s("span",{pre:!0,attrs:{class:"token inserted-sign inserted"}},[s("span",{pre:!0,attrs:{class:"token prefix inserted"}},[e._v("+")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v("import os\n")])]),e._v("\n"),s("span",{pre:!0,attrs:{class:"token unchanged"}},[s("span",{pre:!0,attrs:{class:"token prefix unchanged"}},[e._v(" ")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v("def create_app():\n")]),s("span",{pre:!0,attrs:{class:"token prefix unchanged"}},[e._v(" ")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v(" app = Flask(__name__)\n")])]),s("span",{pre:!0,attrs:{class:"token deleted-sign deleted"}},[s("span",{pre:!0,attrs:{class:"token prefix deleted"}},[e._v("-")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v(' client = MongoClient("mongodb+srv://:@/microblog")\n')])]),s("span",{pre:!0,attrs:{class:"token inserted-sign inserted"}},[s("span",{pre:!0,attrs:{class:"token prefix inserted"}},[e._v("+")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v(' client = MongoClient(os.environ.get("MONGODB_URI"))\n')])]),s("span",{pre:!0,attrs:{class:"token unchanged"}},[s("span",{pre:!0,attrs:{class:"token prefix unchanged"}},[e._v(" ")]),s("span",{pre:!0,attrs:{class:"token line"}},[e._v(" app.db = client.microblog\n")])])])])]),s("h3",{attrs:{id:"step-4"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#step-4"}},[e._v("#")]),e._v(" Step 4")]),e._v(" "),s("p",[e._v("We "),s("em",[e._v("do not")]),e._v(" add this "),s("code",[e._v(".env")]),e._v(" file to GitHub since it contains our private MongoDB details. Instead, we'll create a "),s("code",[e._v(".env.example")]),e._v(" file and add that.")]),e._v(" "),s("p",[e._v("That file should contain just "),s("em",[e._v("what")]),e._v(" should be added, but no actual values:")]),e._v(" "),s("div",{staticClass:"language-diff extra-class"},[s("pre",{pre:!0,attrs:{class:"language-diff"}},[s("code",[e._v("MONGODB_URI=\n")])])]),s("h3",{attrs:{id:"step-5"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#step-5"}},[e._v("#")]),e._v(" Step 5")]),e._v(" "),s("p",[e._v("Since we haven't added "),s("code",[e._v(".env")]),e._v(" to Heroku, Heroku won't know what our MongoDB URI is.")]),e._v(" "),s("p",[e._v("Therefore we must tell it.")]),e._v(" "),s("p",[e._v("Instead of using the "),s("code",[e._v(".env")]),e._v(" file in Heroku, we'll just give Heroku the value of our environment variable. Heroku can store it internally and use it, even without the "),s("code",[e._v(".env")]),e._v(" file.")])])}),[],!1,null,null,null);t.default=r.exports}}]);