# Flask實作_基礎_05_render_template ###### tags: `python` `flask` 在[Python Flask實作_基礎_01_建立第一個app](https://hackmd.io/s/SyP4YEnef)中利用`return string`成功的將內容渲染在網頁上，但是實作上不可能將整個HTML硬刻在上面，這次要討論如何利用`render_template`來做樣板的渲染。 ## 作業說明 `render_template`是flask的內建函數，字面上的意思大概是渲染模板，因此它需要一個『模板』來提供渲染的格式。 ```python= from flask import render_template ``` flask預設模板語法是[jinja2](http://jinja.pocoo.org/docs/2.10/)，這並不代表它只支援『jinja2』<a href='#note_1'><sub>(註1)</sub></a>，直觀來看，當`return render_template('html文件')`的時候，flask會先到專案資料夾『templates』去尋找相對應的html文件，因此，你需要先做的就是在專案底下建置一個資料夾，並且命名為『templates』<a href='#note_2'><sub>(註2)</sub></a>，如下圖： ![](https://i.imgur.com/HJbOGxv.png) 在templates資料夾內新增一個html文件並命名為`abc.html`，內容如下： * file name: abc.html ```htmlmixed= <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Hello Page</title> </head> <body> Flask APP </body> </html> ``` 接著修正python文件內容 * file name: hello_flask.py ```python= from flask import Flask from flask import render_template app = Flask(__name__) @app.route('/') def index(): return render_template('abc.html') if __name__ == '__main__': app.debug = True app.run() ``` 執行專案，開啟瀏灠器連結至`http://127.0.0.1:5000/`，我們已經很優雅的將`abc.html`的內容成功渲染。 ![](https://i.imgur.com/T9oPDHl.png) ### 註解說明 <span id='note_1'>註1</span>：flask除了支援jinja2，也支援Mako，但建議使用jinja2 <span id='note_2'>註2</span>：可以利用參數配置來調整，但預設情況下我們不會去異動。 ## 總結 這一節我們瞭解到flask提供了一個方便的function可以讓我們先建置好模板之後再來渲染，這讓我們開發過程中python的事python處理，html的事html處理，接續的我們要理解flask跟jinja2之間的配合如何處理。 ## 參考 [jinja2.7_簡中說明](http://docs.jinkan.org/docs/jinja2/) [jinja2.10_官方文件](http://jinja.pocoo.org/docs/2.10/) **上一話：**[Flask實作_基礎_04_什麼是app.debug?](https://hackmd.io/s/H10_LR2gz) **下一話：**[Flask實作_基礎_06_render_template + 參數](https://hackmd.io/s/SJpXnBTez)