Membuat Prediction Image App menggunakan Tensorflow di Local dan Heroku

Hasil tampilan akhir di situs Heroku

Software Requirement
Python https://www.python.org/downloads/windows/
Heroku CLI https://devcenter.heroku.com/articles/heroku-cli
GIT https://git-scm.com/download/win

Langkah langkah pembuatan app

Sebelum memulai project, kita harus mengecek dulu apakah sistem yang akan dipakai sudah memiliki python dengan versi terbaru

Langkah 1
Open CMD di sistem, kemudian run as administrator

Langkah 2
Didalam CMD, masuk kedalam directory dimana project yang akan dibuat, disini saya menggunakan directory C:/

mkdir rio
cd rio

Langkah 3
Installasi Virtual Environment

python -m venv venv
pip install virtualenv

Jalankan perintah “pip install virtualenv”

Langkah 4
Aktifkan Virtual Environtmentnya

.\venv\Scripts\activate

Langkah 5
Installasi Library yang diperlukan :
1. Flask
2. Numpy
3. Pillow
4. Tensor flow

pip install flask

pip install numpy
pip install pillow

pip install tensorflow-cpu

Langkah 6
Membuat file dengan nama app.py & folder static, kemudian membuat file didalamnya dengan nama app.html

File app.py di folder project

File app.html di folder static yang telah dibuat

Langkah 7
Menjalankan Flask Development

set FLASK_ENV=development

Langkah 8
Menjalankan FLASK

flask run

Langkah 9
Buka Browser, lalu input 127.0.0.1:5000/static/app.html di search bar

Langkah 10
Setelah muncul tampilan prediction, masukkan gambar yang ingin diprediksi dengan cara choose file kemudian pilih gambar dari folder, kemudian langkah selanjutnya adalah dengan mengklik button Predict pada browser

Langkah 11
Requirement sebelum mengupload ke Heroku

1. Membuat file Procfile dan mengisinya dengan “web: gunicorn app:app”

2. Menginstall gunicorn

pip install gunicorn

3. Installasi Requirements

pip freeze > requirements.txt

Langkah 12
Upload Project ke situs Heroku menggunakan Heroku CLI
Catatan : Buka Situs Heroku terlebih dahulu, kemudian login menggunakan akun yang sudah dibuat

1. Buat app baru dalam Heroku

2. Masukkan nama app yang akan dibuat, kemudian klik create app

3. Pada konfigurasi CMD, buka folder project yang ingin di upload ke heroku
disini saya memakai folder C:\Users\BIGBOSS\Documents\-Matkul\rio

4. Konfigurasi URL

Sebelum project diupload ke Heroku, ada satu hal yang perlu diperhatikan, yaitu URL yang terdapat pada file app.html.

Jika sebelumnya saya dapat menjalankan project di local menggunakan URL : http://127.0.0.1:5000/predict, maka pada saat saya ingin mengupload project tersebut ke Heroku, URL harus diganti sesuai dengan link yang akan menuju ke situs app Heroku saya.

Disini saya akan mengganti URL menjadi :
https://uts-rio128.herokuapp.com/predict

Jika URL sudah diganti, maka project siap untuk diupload ke Heroku

5. Upload Project ke Heroku menggunakan Heroku CLI

heroku login -i

git init

heroku git:remote -a uts-rio128

git add

git commit -am "make it faster"

git push heroku main

6. Membuka app di browser Heroku

7. Menambahkan gambar dan testing prediction

Hasil Akhir
https://uts-rio128.herokuapp.com/static/app.html

Demikian Proses Pembuatan Predict App menggunakan Tensorflow di local dan situs Heroku

Akhir kata saya mengucapkan terimakasih kepada para pembaca, saya juga mohon maaf apabila terdapat penulisan kata yang kurang berkenan.

Terimakasih dan sampai Jumpa :D

Nama : Rio Al Rasyid
NIM : 19.01.53.0128

Video Presentasi Menyusul