Ahmad Rosid

https://ahmadrosid.com The more I learn, the more I realize how much I don’t know.

May 28, 2018

Flask Render Templates

Menulis html pada aplikasi flask.

Html

Pada tutorial sebelumnya kita sudah bahas tentang static files pada aplikasi flask, kali ini kita akan beranjak sedikit tentang HTML.

Sebuah tampilan pada aplikasi web di tulis didalam bahasa HTML ( Hyper Text Markup Language ). Pada tutorial pendalaman flask sebelumnya kita telah membahas sedikit tentang jinja. Sebuah engine yang di pakai oleh flask untuk memanipulasi script html yang akan kita tampilkan kepada user.

Templates

OK yang pertama kita bahas templates pada flask, jadi templates pada flask yang dimaksud adalah file html yang bisa kita sisipi logic. Kenapa disisi logic? Ya supaya kita bisa mengoptimalkan penulisan html nya, salah satu studi kasusnya adalah kita bisa mengeksted template yang mana dengan begitu kita tidak perlu menulis kode yang sama berulang - ulang.


Yang pertama kita bahas terlebih dahulu adalah struktur project sederhana. Jadi file html yang akan di render secara default diletakkan pada folder templates. Berikut ini contoh strukturnya

          
|---app
    |---app.py
    |---static
        |---app.css
    |---templates
        |---index.html
          
        

Jadi folder templates adalah tempat kita menaruh segala file html yang akan kita gunakan, sedangkan folder static adalah tempat dimana kita akan menaruh file static seperti css misalnya.

Render Template

Ok sekarang bagaimana merender template atau html pada sebuah aplikasi flask? Gampang berikut ini contoh nya :

          
from flask import Flask, render_template
app = Flask(__name__)

@app.route('/')
def index():
  return render_template('index.html')

app.run()
          
        

Dan berikut ini untuk file index.html :

          
<!DOCTYPE html>
<html>
<head>
  <title> Welcome </title>
  <link rel="stylesheet" type="text/css" href="/static/app.css">
</head>
<body>
  <h1> Hello world </h1>
</body>
</html>
          
        

Next

© 2017 Codecast.id