(window.webpackJsonp=window.webpackJsonp||[]).push([[2706],{3114:function(t,s,a){"use strict";a.r(s);var n=a(31),e=Object(n.a)({},(function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[a("h1",{attrs:{id:"flask"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#flask"}},[t._v("#")]),t._v(" Flask")]),t._v(" "),a("p",[t._v("Flask is a Python micro web framework used to run major websites including Pintrest, Twilio, and Linkedin. This topic explains and demonstrates the variety of features Flask offers for both front and back end web development.")]),t._v(" "),a("h2",{attrs:{id:"files-and-templates"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#files-and-templates"}},[t._v("#")]),t._v(" Files and Templates")]),t._v(" "),a("p",[t._v("Instead of typing our HTML markup into the return statements, we can use the "),a("code",[t._v("render_template()")]),t._v(" function:")]),t._v(" "),a("div",{staticClass:"language-py extra-class"},[a("pre",{pre:!0,attrs:{class:"language-py"}},[a("code",[a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" flask "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" Flask\n"),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" flask "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" render_template\napp "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" Flask"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("__name__"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n\n"),a("span",{pre:!0,attrs:{class:"token decorator annotation punctuation"}},[t._v("@app"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("route")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/about"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n"),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("def")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("about")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(":")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" render_template"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[t._v('"about-us.html"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n\n"),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("if")]),t._v(" __name__ "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("==")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[t._v('"__main__"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(":")]),t._v("\n app"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("run"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("host"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),a("span",{pre:!0,attrs:{class:"token string"}},[t._v('"0.0.0.0"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" port"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),a("span",{pre:!0,attrs:{class:"token number"}},[t._v("80")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" debug"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),a("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("True")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n\n")])])]),a("p",[t._v("This will use our template file "),a("code",[t._v("about-us.html")]),t._v(". To ensure our application can find this file we must organize our directory in the following format:")]),t._v(" "),a("div",{staticClass:"language-py extra-class"},[a("pre",{pre:!0,attrs:{class:"language-py"}},[a("code",[a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v(" application"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("py\n"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("/")]),t._v("templates\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v(" about"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("us"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("html\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v(" login"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("form"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("html\n"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("/")]),t._v("static\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("/")]),t._v("styles\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v(" about"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("style"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("css\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v(" login"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("style"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("css\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("/")]),t._v("scripts\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v(" about"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("script"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("js\n "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v(" login"),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("script"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("js\n\n")])])])])}),[],!1,null,null,null);s.default=e.exports}}]);