Quickstarters
Cara Mengembangkan Aplikasi CRUD dengan Flask?

32min
Ikhtisar
Tutorial ini akan memandu Anda melalui pembuatan aplikasi CRUD (buat, baca, perbarui, hapus) menggunakan Flask. 
Kami akan mengintegrasikan Back4app sebagai layanan backend kami untuk menyederhanakan manajemen data. Anda akan belajar cara mengatur proyek Back4app, merancang struktur data yang fleksibel, dan menerapkan fungsionalitas CRUD menggunakan Flask.
Dalam panduan ini, Anda akan terlebih dahulu membuat proyek Back4app bernama Basic-CRUD-App-Flask yang menawarkan solusi penyimpanan data non-relasional yang kuat. 
Anda akan mendefinisikan skema data Anda dengan kelas dan bidang baik secara manual atau menggunakan AI Agent Back4app.
Setelah mengonfigurasi backend Anda dengan antarmuka Admin Back4app, Anda akan menghubungkan aplikasi Flask Anda ke layanan melalui panggilan REST API. Tutorial ini juga mencakup manajemen akses yang aman untuk data Anda.
Pada akhir, Anda akan memiliki aplikasi Flask yang siap produksi yang mampu melakukan operasi CRUD bersama dengan autentikasi pengguna yang aman dan penanganan data.
Apa yang Akan Anda Pelajari
Cara membuat aplikasi CRUD berbasis Flask dengan backend non-relasional.
Cara menyusun backend Anda di Back4app dan mengintegrasikannya dengan proyek Flask.
Cara memanfaatkan antarmuka Admin Back4app untuk mengelola operasi CRUD dengan mudah.
Cara menerapkan aplikasi Flask Anda, termasuk menggunakan Docker untuk kontainerisasi.
﻿
Prasyarat
Sebelum Anda mulai, pastikan Anda memiliki:
Akun Back4app dengan proyek yang dikonfigurasi.
Butuh bantuan? Lihat Memulai dengan Back4app.
Lingkungan pengembangan Python yang sudah disiapkan.
Gunakan editor seperti VSCode atau PyCharm dan instal Python 3.8 (atau lebih baru).
Pengetahuan dasar tentang Python, Flask, dan REST API.
Konsultasikan dokumentasi Python jika perlu.
﻿
Langkah 1 – Pengaturan Proyek Awal
Membuat Proyek Back4app Anda
Masuk ke akun Back4app Anda.
Klik pada “Aplikasi Baru” dari dasbor Anda.
Masukkan nama proyek: Basic-CRUD-App-Flask dan selesaikan proses pengaturan.
Buat Proyek Baru
﻿
Setelah dibuat, proyek Anda muncul di dasbor, berfungsi sebagai dasar untuk konfigurasi backend Anda.
﻿
Langkah 2 – Membangun Skema Data
Mendefinisikan Struktur Data Anda
Untuk aplikasi ini, Anda akan menetapkan beberapa kelas dalam proyek Back4app Anda. Di bawah ini adalah contoh kelas inti dan bidangnya yang penting untuk operasi CRUD.
1. Kelas Item
Bidang
Tipe
Deskripsi
_id
ObjectId
Pengidentifikasi unik yang dihasilkan secara otomatis.
judul
String
Nama atau judul item.
deskripsi
String
Gambaran singkat tentang item tersebut.
dibuatPada
Tanggal
Timestamp ketika item dibuat.
diperbaruiPada
Tanggal
Timestamp untuk pembaruan terbaru.
2. Kelas Pengguna
Bidang
Tipe
Deskripsi
_id
ObjectId
Pengidentifikasi unik yang dihasilkan secara otomatis.
nama pengguna
String
Nama pengguna yang unik untuk pengguna.
email
String
Alamat email yang unik.
hashKataSandi
String
Kata sandi yang di-hash dengan aman untuk otentikasi.
dibuatPada
Tanggal
Timestamp ketika akun pengguna dibuat.
diperbaruiPada
Tanggal
Timestamp untuk pembaruan akun terakhir.
Anda dapat membuat kelas ini dan menambahkan field langsung di dasbor Back4app Anda.
Buat Kelas Baru
﻿
Anda dapat menambahkan kolom dengan memilih jenis data, memberi nama pada field, mengatur nilai default, dan menandainya sebagai wajib.
Buat Kolom
﻿
Memanfaatkan AI Agent Back4app untuk Pembuatan Skema
AI Agent di dasbor Anda dapat secara otomatis menetapkan skema berdasarkan instruksi Anda. Alat ini menyederhanakan proses dan memastikan model data Anda optimal untuk tugas CRUD.
Cara Menggunakan AI Agent:
Buka AI Agent:
Masuk ke dasbor Back4app Anda dan temukan AI Agent di bawah pengaturan proyek.
Deskripsikan Skema Anda:
Berikan prompt rinci yang mencantumkan kelas dan bidang.
Konfirmasi Pengaturan:
Tinjau skema yang diusulkan dan setujui perubahan.
Contoh Prompt
Text
Create the following classes in my Back4app project:

1) Class: Items
- Fields:
  - _id: ObjectId (auto-generated)
  - title: String
  - description: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)

2) Class: Users
- Fields:
  - _id: ObjectId (auto-generated)
  - username: String (unique)
  - email: String (unique)
  - passwordHash: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)
Create the following classes in my Back4app project:

1) Class: Items
- Fields:
  - _id: ObjectId (auto-generated)
  - title: String
  - description: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)

2) Class: Users
- Fields:
  - _id: ObjectId (auto-generated)
  - username: String (unique)
  - email: String (unique)
  - passwordHash: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)
﻿
Proses yang didorong oleh AI ini menghemat waktu dan menjamin model data yang konsisten dan efektif.
﻿
Langkah 3 – Mengaktifkan Antarmuka Admin & Menangani Operasi CRUD
Ikhtisar Antarmuka Admin
Antarmuka Admin Back4app menyediakan solusi tanpa kode untuk mengelola data backend Anda. Dengan fitur seret dan lepas, Anda dapat dengan mudah melakukan operasi CRUD—seperti menambahkan, mengedit, atau menghapus catatan.
Mengaktifkan Antarmuka Admin
Pergi ke menu “Lainnya” di dasbor Back4app Anda.
Pilih “Aplikasi Admin” dan klik “Aktifkan Aplikasi Admin.”
Buat akun admin Anda, yang juga mengatur peran awal seperti B4aAdminUser.
Aktifkan Aplikasi Admin
﻿
Setelah aktivasi, masuk ke antarmuka Admin untuk mengelola data proyek Anda.
Dasbor Aplikasi Admin
﻿
Menggunakan Antarmuka Admin untuk CRUD
Dalam antarmuka Admin, Anda dapat:
Masukkan Entri Baru: Klik “Tambahkan Rekaman” dalam sebuah kelas (misalnya, Item) untuk membuat data baru.
Lihat dan Modifikasi Entri: Pilih rekaman mana pun untuk melihat detail atau memperbarui bidang.
Hapus Rekaman: Hapus entri yang tidak lagi diperlukan.
Antarmuka yang mudah digunakan ini meningkatkan produktivitas dengan menyederhanakan manajemen backend.
﻿
Langkah 4 – Menghubungkan Aplikasi Flask Anda ke Back4app
Dengan backend Anda sudah disiapkan, langkah selanjutnya adalah menghubungkan aplikasi Flask Anda ke Back4app.
Membuat Panggilan API dari Flask
Karena tidak ada SDK Parse khusus untuk Flask, Anda akan menggunakan panggilan REST API. Di aplikasi Flask Anda, Anda dapat memanfaatkan requests pustaka untuk melakukan operasi CRUD.
Contoh: Mengatur Komunikasi API
Instal Library Requests:
Jalankan perintah berikut di terminal Anda:
Bash
pip install requests
pip install requests
﻿
Konfigurasi Modul Python untuk Panggilan API:
Buat file bernama back4app_api.py:
Python
# back4app_api.py
import requests

APPLICATION_ID = "YOUR_APPLICATION_ID"
REST_API_KEY = "YOUR_REST_API_KEY"
BASE_URL = "https://parseapi.back4app.com/classes"

HEADERS = {
    "X-Parse-Application-Id": APPLICATION_ID,
    "X-Parse-REST-API-Key": REST_API_KEY,
    "Content-Type": "application/json"
}

def get_items():
    response = requests.get(f"{BASE_URL}/Items", headers=HEADERS)
    return response.json()

def create_item(title, description):
    data = {"title": title, "description": description}
    response = requests.post(f"{BASE_URL}/Items", headers=HEADERS, json=data)
    return response.json()

def update_item(object_id, title, description):
    data = {"title": title, "description": description}
    response = requests.put(f"{BASE_URL}/Items/{object_id}", headers=HEADERS, json=data)
    return response.json()

def delete_item(object_id):
    response = requests.delete(f"{BASE_URL}/Items/{object_id}", headers=HEADERS)
    return response.json()
# back4app_api.py
import requests

APPLICATION_ID = "YOUR_APPLICATION_ID"
REST_API_KEY = "YOUR_REST_API_KEY"
BASE_URL = "https://parseapi.back4app.com/classes"

HEADERS = {
    "X-Parse-Application-Id": APPLICATION_ID,
    "X-Parse-REST-API-Key": REST_API_KEY,
    "Content-Type": "application/json"
}

def get_items():
    response = requests.get(f"{BASE_URL}/Items", headers=HEADERS)
    return response.json()

def create_item(title, description):
    data = {"title": title, "description": description}
    response = requests.post(f"{BASE_URL}/Items", headers=HEADERS, json=data)
    return response.json()

def update_item(object_id, title, description):
    data = {"title": title, "description": description}
    response = requests.put(f"{BASE_URL}/Items/{object_id}", headers=HEADERS, json=data)
    return response.json()

def delete_item(object_id):
    response = requests.delete(f"{BASE_URL}/Items/{object_id}", headers=HEADERS)
    return response.json()
﻿
Integrasikan Fungsi API dalam Rute Flask Anda:
Sebagai contoh, dalam app.py:
Python
# app.py
from flask import Flask, request, jsonify, render_template
from back4app_api import get_items, create_item, update_item, delete_item

app = Flask(__name__)

@app.route("/")
def index():
    items = get_items()
    return render_template("index.html", items=items.get("results", []))

@app.route("/add", methods=["POST"])
def add_item():
    title = request.form.get("title")
    description = request.form.get("description")
    result = create_item(title, description)
    return jsonify(result)

@app.route("/update/<item_id>", methods=["PUT"])
def modify_item(item_id):
    data = request.get_json()
    result = update_item(item_id, data.get("title"), data.get("description"))
    return jsonify(result)

@app.route("/delete/<item_id>", methods=["DELETE"])
def remove_item(item_id):
    result = delete_item(item_id)
    return jsonify(result)

if __name__ == "__main__":
    app.run(debug=True)
# app.py
from flask import Flask, request, jsonify, render_template
from back4app_api import get_items, create_item, update_item, delete_item

app = Flask(__name__)

@app.route("/")
def index():
    items = get_items()
    return render_template("index.html", items=items.get("results", []))

@app.route("/add", methods=["POST"])
def add_item():
    title = request.form.get("title")
    description = request.form.get("description")
    result = create_item(title, description)
    return jsonify(result)

@app.route("/update/<item_id>", methods=["PUT"])
def modify_item(item_id):
    data = request.get_json()
    result = update_item(item_id, data.get("title"), data.get("description"))
    return jsonify(result)

@app.route("/delete/<item_id>", methods=["DELETE"])
def remove_item(item_id):
    result = delete_item(item_id)
    return jsonify(result)

if __name__ == "__main__":
    app.run(debug=True)
﻿
Contoh ini menggambarkan bagaimana menggunakan panggilan REST dalam Flask untuk berinteraksi dengan backend Back4app.
﻿
Langkah 5 – Melindungi Backend Anda
Menerapkan Kontrol Akses
Lindungi data Anda dengan mengonfigurasi kontrol akses. Misalnya, saat membuat item baru, Anda mungkin membatasi akses hanya untuk penciptanya.
Berikut adalah contoh menggunakan panggilan API dengan akses terkontrol:
Python
import requests

def create_private_item(title, description, user_token):
    data = {"title": title, "description": description}
    headers = {
        "X-Parse-Application-Id": "YOUR_APPLICATION_ID",
        "X-Parse-REST-API-Key": "YOUR_REST_API_KEY",
        "X-Parse-Session-Token": user_token,
        "Content-Type": "application/json"
    }
    response = requests.post("https://parseapi.back4app.com/classes/Items", headers=headers, json=data)
    return response.json()
import requests

def create_private_item(title, description, user_token):
    data = {"title": title, "description": description}
    headers = {
        "X-Parse-Application-Id": "YOUR_APPLICATION_ID",
        "X-Parse-REST-API-Key": "YOUR_REST_API_KEY",
        "X-Parse-Session-Token": user_token,
        "Content-Type": "application/json"
    }
    response = requests.post("https://parseapi.back4app.com/classes/Items", headers=headers, json=data)
    return response.json()
﻿
Mengonfigurasi Izin Tingkat Kelas
Sesuaikan Izin Tingkat Kelas (CLP) langsung di dasbor Back4app untuk memastikan hanya pengguna yang terautentikasi yang dapat mengakses kelas tertentu.
﻿
Langkah 6 – Menerapkan Autentikasi Pengguna
Menyiapkan Manajemen Pengguna
Back4app menawarkan manajemen pengguna bawaan melalui kelas Penggunanya. Di aplikasi Flask Anda, Anda dapat membuat endpoint untuk pendaftaran dan login.
Contoh: Pendaftaran dan Login Pengguna
Python
# auth.py
import requests

APPLICATION_ID = "YOUR_APPLICATION_ID"
REST_API_KEY = "YOUR_REST_API_KEY"
HEADERS = {
    "X-Parse-Application-Id": APPLICATION_ID,
    "X-Parse-REST-API-Key": REST_API_KEY,
    "Content-Type": "application/json"
}

def register_user(username, password, email):
    data = {"username": username, "password": password, "email": email}
    response = requests.post("https://parseapi.back4app.com/users", headers=HEADERS, json=data)
    return response.json()

def login_user(username, password):
    params = {"username": username, "password": password}
    response = requests.get("https://parseapi.back4app.com/login", headers=HEADERS, params=params)
    return response.json()
# auth.py
import requests

APPLICATION_ID = "YOUR_APPLICATION_ID"
REST_API_KEY = "YOUR_REST_API_KEY"
HEADERS = {
    "X-Parse-Application-Id": APPLICATION_ID,
    "X-Parse-REST-API-Key": REST_API_KEY,
    "Content-Type": "application/json"
}

def register_user(username, password, email):
    data = {"username": username, "password": password, "email": email}
    response = requests.post("https://parseapi.back4app.com/users", headers=HEADERS, json=data)
    return response.json()

def login_user(username, password):
    params = {"username": username, "password": password}
    response = requests.get("https://parseapi.back4app.com/login", headers=HEADERS, params=params)
    return response.json()
﻿
Anda dapat membuat rute Flask yang sesuai untuk menangani pendaftaran dan login pengguna menggunakan fungsi-fungsi ini.
﻿
Langkah 7 – Men-deploy Aplikasi Flask Anda
Back4app menyederhanakan proses deployment. Anda dapat men-deploy aplikasi Flask Anda melalui beberapa metode, termasuk Docker.
7.1 Mengemas Aplikasi Flask Anda
Siapkan Aplikasi Anda:
Pastikan semua file dan dependensi yang diperlukan disertakan.
Uji Secara Lokal:
Jalankan aplikasi Anda secara lokal dengan:
Bash
flask run
flask run
﻿
7.2 Mengorganisir Struktur Proyek Anda
Struktur yang umum mungkin adalah:
Text
Basic-CRUD-App-Flask/
|-- app.py
|-- back4app_api.py
|-- auth.py
|-- templates/
|     |-- index.html
|-- static/
|-- requirements.txt
|-- Dockerfile
Basic-CRUD-App-Flask/
|-- app.py
|-- back4app_api.py
|-- auth.py
|-- templates/
|     |-- index.html
|-- static/
|-- requirements.txt
|-- Dockerfile
﻿
7.3 Menggunakan Docker
Sertakan sebuah Dockerfile di root proyek:
Dockerfile
# Use a lightweight Python image
FROM python:3.9-slim

# Set the working directory
WORKDIR /app

# Install dependencies
COPY requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

# Copy the application code
COPY . .

# Expose the port Flask runs on
EXPOSE 5000

# Start the Flask app
CMD ["python", "app.py"]
# Use a lightweight Python image
FROM python:3.9-slim

# Set the working directory
WORKDIR /app

# Install dependencies
COPY requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

# Copy the application code
COPY . .

# Expose the port Flask runs on
EXPOSE 5000

# Start the Flask app
CMD ["python", "app.py"]
﻿
7.4 Penyebaran melalui Penyebaran Web Back4app
Hubungkan Repositori GitHub Anda:
Pastikan kode Anda telah dipush ke GitHub.
Konfigurasi Pengaturan Penyebaran:
Di dasbor Back4app, gunakan fitur Penyebaran Web untuk menghubungkan repositori Anda (misalnya, Basic-CRUD-App-Flask) dan pilih cabang Anda.
Tentukan Perintah Build:
Tentukan perintah build (misalnya, pip install -r requirements.txt) dan lokasi aplikasi Anda.
Sebarkan:
Klik Sebarkan dan pantau log hingga aplikasi Anda aktif.
﻿
Langkah 8 – Menyelesaikan dan Arah Masa Depan
Kerja bagus! Anda telah berhasil membuat aplikasi CRUD berbasis Flask yang terintegrasi dengan Back4app. 
Anda telah mendirikan proyek bernama Basic-CRUD-App-Flask, mendefinisikan model data untuk Item dan Pengguna, dan mengelola backend Anda melalui antarmuka Admin Back4app. 
Selain itu, Anda menghubungkan aplikasi Flask Anda menggunakan panggilan REST API dan menerapkan langkah-langkah keamanan.
Apa Selanjutnya?
Perluas Fungsionalitas:
Pertimbangkan untuk menambahkan fitur seperti pencarian lanjutan, tampilan item yang lebih detail, atau pembaruan waktu nyata.
Tingkatkan Layanan Backend:
Jelajahi fungsi cloud, integrasikan API pihak ketiga, atau terapkan kontrol akses berbasis peran.
Perdalam Keterampilan Anda:
Kunjungi dokumentasi Back4app dan sumber daya lainnya untuk lebih menyempurnakan aplikasi Anda.
Selamat coding dan semoga sukses dengan aplikasi CRUD Flask Anda!
Bidang	Tipe	Deskripsi
_id	ObjectId	Pengidentifikasi unik yang dihasilkan secara otomatis.
judul	String	Nama atau judul item.
deskripsi	String	Gambaran singkat tentang item tersebut.
dibuatPada	Tanggal	Timestamp ketika item dibuat.
diperbaruiPada	Tanggal	Timestamp untuk pembaruan terbaru.
Bidang	Tipe	Deskripsi
_id	ObjectId	Pengidentifikasi unik yang dihasilkan secara otomatis.
nama pengguna	String	Nama pengguna yang unik untuk pengguna.
email	String	Alamat email yang unik.
hashKataSandi	String	Kata sandi yang di-hash dengan aman untuk otentikasi.
dibuatPada	Tanggal	Timestamp ketika akun pengguna dibuat.
diperbaruiPada	Tanggal	Timestamp untuk pembaruan akun terakhir.
Diperbarui 17 Feb 2025
Apakah halaman ini membantu Anda?
SEBELUMNYA
Cara Membangun Aplikasi CRUD dengan Python?
BERIKUTNYA
Cara Membangun Aplikasi CRUD Dasar dengan Java?