Belajar Flask Bagian 4 || Routing Statis dan Dinamis dengan Variable Rule

 

Selamat datang kembali di seri pembelajaran Belajar Flask! Pada bagian sebelumnya, kita telah membuat program aplikasi sederhana dengan satu rute. Bagian keempat dari seri ini akan fokus pada pemahaman tentang routing statis dan dinamis dengan penggunaan Variable Rule di Flask, dengan membuat halaman home, about, dan contact.

Fungsi return dalam Flask

Fungsi return dalam Flask memiliki peran penting dalam membangun aplikasi web. Berikut beberapa penjelasan mengenai fungsi return:

1. Mengembalikan Respons ke Klien:

Fungsi return digunakan untuk mengembalikan respons ke klien web yang membuat permintaan. Respons ini dapat berupa teks, HTML, JSON, atau format data lainnya.Pada bagian sebelumnya kita telah membuat file bernama app.py yang mereturn tulisan 'Selamat datang di Aplikasi Flask Sederhana!'

Nah, Sebenarnya Fungsi return ini juga dapat merender sebuah HTML Langsung

Contoh:

maka browser akan menampilkan halaman seperti berikut

Yang menjadi pertanyaan selanjutnya adalah tidak mungkin atau tidak lazim sebuah web itu menrender langsung sebuah laman, bagaimana kalau laman tersebut memiliki lebih dari 1 atau banyak laman ?, maka yang paling efektif adalah kita akan melakukan Fungsi return dapat digunakan untuk merender template Jinja2. Template Jinja2 adalah file HTML yang berisi kode Python untuk menghasilkan tampilan web yang dinamis.secara sederhana Fungsi return ini digunakan untuk mengarahkan ulang URL ke alamat lain. Dalam Praktek lai ini adalah kita akan membuat contoh 3 laman yaitu halaman home, about, dan contact.

pertama kita akan melakukan perubahan pada file app.py

Kemudian setelah kita menyimpan dan meruning pada browser kita , masing masing halaman yang kita tuju akan ditunjukan pada menu diblelakan /

Perhatikan pada halaman home memang sengaja default ke alamat aplikasi, jadi secara otomatis pengunjung nanti akan dihadapkan pada halaman home sedang jika ingin ke menu lainnya perlu menambahkan imbuhan menu yang dituju dibelakang tanda /

Menggunakan Variable Rule untuk Routing Dinamis

Routing dinamis adalah routing yang memungkinkan URL untuk menerima variabel. Variabel ini dapat digunakan untuk membuat URL yang lebih fleksibel dan dinamis. Berikut contoh routing dinamis:

Python

@app.route("/user/<username>")
def user(username):
    return f"<h1>Halaman Pengguna {username}</h1>"

Kode di atas memetakan URL /user/<username> ke fungsi user. Variabel <username> dapat diisi dengan nilai apa pun, dan nilai tersebut akan diteruskan ke fungsi user sebagai parameter.

Variable Rule:

Flask menyediakan beberapa variable rule untuk mendefinisikan format variabel dalam routing dinamis. Berikut beberapa contoh variable rule:

• String: /<string:username>: Variabel username harus berupa string.
• Integer: /<int:user_id>: Variabel user_id harus berupa integer.
• Float: /<float:price>: Variabel price harus berupa float.
• Path: /<path:file_path>: Variabel file_path dapat berupa path yang berisi karakter spesial.
• UUID: /<uuid:user_uuid>: Variabel user_uuid harus berupa UUID (Universally Unique Identifier).

Routing Dinamis dengan Berbagai Tipe Data

1. String: Variabel rule dengan tipe data string adalah yang paling umum digunakan. Ini memungkinkan kita untuk menangkap bagian dari URL yang bersifat teks.

   Contoh:

   python
   @app.route('/user/<username>')
   def user_profile(username):
       return f'Ini adalah halaman profil untuk pengguna dengan nama {username}'

2. maka kode app.py akan menjadi

3. 
   
   

   
   

4. 
   

   penjelasan untuk tiap baris kodenya adalah:

   Baris ini mendefinisikan routing untuk halaman home. Ketika pengguna mengunjungi alamat /, fungsi home akan dijalankan dan teks "Ini adalah halaman Home" akan dikembalikan.

   • Halaman About:
   Python

   @app.route('/about')
   def about():
       return 'Ini adalah halaman About'
   

   
   

   Baris ini mendefinisikan routing untuk halaman about. Ketika pengguna mengunjungi alamat /about, fungsi about akan dijalankan dan teks "Ini adalah halaman About" akan dikembalikan.

   • Halaman Contact:
   Python

   @app.route('/contact')
   def contact():
       return 'Ini adalah halaman Contact'
   

   
   

   Baris ini mendefinisikan routing untuk halaman contact. Ketika pengguna mengunjungi alamat /contact, fungsi contact akan dijalankan dan teks "Ini adalah halaman Contact" akan dikembalikan.

   4. Routing Dinamis:

   • Halaman Profile:
   Python

   @app.route('/profile')
   def profile():
       return 'Ini adalah halaman profile'
   

   
   

   Baris ini mendefinisikan routing untuk halaman profile. Ketika pengguna mengunjungi alamat /profile, fungsi profile akan dijalankan dan teks "Ini adalah halaman profile" akan dikembalikan.

   • Halaman Profile dengan Username:
   Python

   @app.route('/profile/<username>')
   def user_profile(username):
       return f'Ini adalah halaman profil untuk pengguna dengan nama {username}'
   

   
   

   Baris ini mendefinisikan routing dinamis untuk halaman profile dengan username. Ketika pengguna mengunjungi alamat /profile/<username>, fungsi user_profile akan dijalankan dengan parameter username. Nilai username dapat diisi dengan nama pengguna apa pun.

   5. Jalankan Aplikasi:

   Python

   if __name__ == '__main__':
       app.run(debug=True)
   

   
   

   Baris ini mengecek apakah kode dijalankan sebagai modul utama. Jika ya, maka aplikasi Flask akan dijalankan dengan mode debug aktif. Mode debug memungkinkan Anda untuk melihat error dan traceback pada browser web. Maka yang tampil dibrowser kita akan check adalah

   
   
   
   
   Perhatikan dibelakang /profile saya menambahkan username idiarso artinya halaman profileditambahkan variable yaitu username.jika kita ganti siaj misalkan maka akan tetap muncul username yang kita inputkan
   
   

1. Integer: Variabel rule dengan tipe data integer digunakan untuk menangkap angka bulat dalam URL.

   Contoh:

   python
   @app.route('/post/<int:post_id>')
   def post_detail(post_id):
       return f'Ini adalah halaman detail untuk postingan dengan ID {post_id}'

2. 
   
   
   
   
   
   Jika kita jalankan dibrowser dengan mengetikan nama maka hasilnya

3. 
   Kenapa error, ingat tadi yang kita masukan nilainya adalah integer maka format yang harus dimasukan adalah tipe data integer.Dalam kode di atas, kami menambahkan rute /profile/<int:user_id> yang menggunakan pola routing dinamis integer dengan placeholder <int:user_id>. Ketika pengguna mengakses URL seperti /profile/123, fungsi user_profile() akan dipanggil dengan nilai user_id=123. Hal ini memungkinkan kita untuk menampilkan halaman profil yang sesuai dengan ID pengguna yang diberikan dalam URL.
   
   
   
   
   
   
   kita juga bisa memasukan dengan operasi bilangan contohnya :
   
   
   

   Dalam kode di atas, kami menambahkan dua rute baru: /add/<int:num1>/<int:num2> dan /multiply/<int:num1>/<int:num2>. Pertama, rute /add akan melakukan operasi penjumlahan antara dua bilangan yang diberikan sebagai parameter, dan kedua, rute /multiply akan melakukan operasi perkalian antara dua bilangan tersebut.

   Anda dapat mengakses halaman ini melalui URL seperti /add/5/3 untuk melakukan penjumlahan atau /multiply/4/6 untuk melakukan perkalian.

   
   
   

4. 
   
   

   
   

5. 
   

6. Float: Variabel rule dengan tipe data float digunakan untuk menangkap angka desimal dalam URL.

   Contoh:

   python
   @app.route('/price/<float:product_price>')
   def product_price(product_price):
       return f'Harga produk ini adalah {product_price}'

1. Path: Variabel rule dengan tipe data path digunakan untuk menangkap bagian dari URL yang berisi garis miring (/), sering digunakan untuk menangkap jalur direktori atau nama file.

   Contoh:

   python
   @app.route('/files/<path:file_path>')
   def get_file(file_path):
       return f'Ini adalah file yang terletak di jalur {file_path}'

2. 
   
   
   

3. 
   

4. UUID: Variabel rule dengan tipe data UUID digunakan untuk menangkap UUID (Universally Unique Identifier) dalam URL.

   Contoh:

   python
   @app.route('/user/<uuid:user_id>')
   def get_user(user_id):
       return f'Ini adalah halaman untuk pengguna dengan ID {user_id}'

Penggunaan berbagai tipe data dalam routing dinamis memberikan fleksibilitas lebih dalam menangani permintaan dengan pola URL yang berbeda. Dengan menggunakan Variable Rule ini, Anda dapat dengan mudah menangkap dan memproses informasi yang diberikan dalam URL untuk digunakan dalam aplikasi Flask Anda.

Kesimpulan

Dengan menambahkan rute untuk halaman home, about, dan contact, serta menggunakan Variable Rule untuk routing dinamis, kita telah meningkatkan fungsionalitas aplikasi Flask kita. Sekarang, kita memiliki lebih banyak halaman yang dapat diakses oleh pengguna. Pada bagian berikutnya dari seri ini, kita akan melihat cara mengintegrasikan template untuk membuat tampilan yang lebih menarik dan terstruktur.

Sekian untuk bagian keempat ini. Teruslah bersemangat dalam perjalanan belajar Flask. Sampai jumpa di bagian berikutnya!

Seri Belajar Flask

https://www.idiarso.my.id/2024/03/belajar-flask-bagian-1-instalasi-python.html

https://www.idiarso.my.id/2024/03/belajar-flask-bagian-2-instalasi-python.html

https://www.idiarso.my.id/2024/03/belajar-flask-bagian-3-membuat-program.html

https://www.idiarso.my.id/2024/03/belajar-flask-bagian-4-routing-statis.html

https://www.idiarso.my.id/2024/03/belajar-flask-bagian-5-web-security.html