Difference between revisions of "Dokumentasi API dengan Swagger"

From OnnoWiki
Jump to navigation Jump to search
(Created page with "Berikut adalah struktur materi untuk kuliah "Pengenalan Deployment Aplikasi Web menggunakan Python" yang terdiri dari empat bagian utama, masing-masing dengan tiga modul: **1...")
 
 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
Berikut adalah struktur materi untuk kuliah "Pengenalan Deployment Aplikasi Web menggunakan Python" yang terdiri dari empat bagian utama, masing-masing dengan tiga modul:
+
Kita akan pakai '''FastAPI + Swagger UI''' karena simpel dan cocok buat dokumentasi REST API secara otomatis.
  
**1. Dasar-dasar Pengembangan Web Menggunakan Python**
+
==Install Python dan pip==
 +
Ubuntu 24.04 biasanya udah include Python 3. Tapi kita pastikan dulu:
  
  - **1.1. Pengenalan Flask: Membuat Aplikasi Web Sederhana**
+
sudo apt update
    - Memahami konsep dasar Flask dan cara membuat aplikasi web sederhana.
+
sudo apt install python3 python3-pip -y
    - Contoh: Membuat halaman "Hello, World!" menggunakan Flask.
 
    - Referensi: [Tutorial Flask oleh Miguel Grinberg](https://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world)
 
  
  - **1.2. Struktur Proyek Flask dan Manajemen Template**
+
==Buat Virtual Environment (opsional tapi disarankan)==
    - Mempelajari struktur proyek yang baik dalam Flask dan penggunaan template untuk memisahkan logika dan tampilan.
 
    - Contoh: Menggunakan Jinja2 untuk membuat template dinamis.
 
    - Referensi: [Tutorial Flask Resmi](https://flask.palletsprojects.com/en/stable/tutorial/)
 
  
  - **1.3. Mengelola Basis Data dengan SQLAlchemy**
+
sudo apt install python3-venv -y
    - Integrasi Flask dengan SQLAlchemy untuk operasi basis data.
+
python3 -m venv venv
    - Contoh: Membuat model data dan melakukan operasi CRUD.
+
source venv/bin/activate
    - Referensi: [Membangun Aplikasi Web dengan Flask](https://www.digitalocean.com/community/tutorials/how-to-make-a-web-application-using-flask-in-python-3)
 
  
**2. Dasar-dasar Komunikasi Backend pada Web Python**
+
==Install FastAPI dan Uvicorn==
  
  - **2.1. Routing dan Metode HTTP dalam Flask**
+
pip install fastapi uvicorn
    - Memahami cara kerja routing dan berbagai metode HTTP (GET, POST, PUT, DELETE).
 
    - Contoh: Membuat endpoint dengan berbagai metode HTTP.
 
    - Referensi: [Tutorial Flask Resmi](https://flask.palletsprojects.com/en/stable/tutorial/)
 
  
  - **2.2. Mengelola Formulir dan Validasi Input**
+
==Buat File Project: `main.py`==
    - Menggunakan Flask-WTF untuk mengelola formulir dan validasi input pengguna.
 
    - Contoh: Membuat formulir login dengan validasi.
 
    - Referensi: [Membangun Aplikasi Web dengan Flask](https://www.digitalocean.com/community/tutorials/how-to-make-a-web-application-using-flask-in-python-3)
 
  
  - **2.3. Komunikasi Asinkron dengan JavaScript dan Flask**
+
# main.py
     - Mengintegrasikan Flask dengan JavaScript untuk komunikasi asinkron menggunakan AJAX.
+
     - Contoh: Memuat data secara dinamis tanpa me-refresh halaman.
+
from fastapi import FastAPI
     - Referensi: [Komunikasi Frontend dan Backend](https://www.reddit.com/r/learnprogramming/comments/8xdh5s/how_do_you_connect_the_frontend_and_backend/)
+
from pydantic import BaseModel
 +
 +
app = FastAPI(title="Swagger API - Metro TV", version="1.0")
 +
 +
# Contoh Model
 +
class Item(BaseModel):
 +
    name: str
 +
     price: float
 +
     is_offer: bool = None
 +
 +
# Route dasar
 +
@app.get("/")
 +
def read_root():
 +
     return {"message": "Hello, Metro TV"}
 +
 +
# Route dengan parameter
 +
@app.get("/items/{item_id}")
 +
def read_item(item_id: int, q: str = None):
 +
    return {"item_id": item_id, "q": q}
 +
 +
# POST endpoint
 +
@app.post("/items/")
 +
def create_item(item: Item):
 +
    return {"item": item}
  
**3. Keamanan Aplikasi Web Python**
+
==Jalankan API==
  
  - **3.1. Manajemen Autentikasi dan Otorisasi**
+
uvicorn main:app --reload
    - Implementasi sistem login dan kontrol akses pengguna.
 
    - Contoh: Menggunakan Flask-Login untuk manajemen sesi pengguna.
 
    - Referensi: [Tutorial Flask Resmi](https://flask.palletsprojects.com/en/stable/tutorial/)
 
  
  - **3.2. Mencegah Serangan Umum pada Aplikasi Web**
+
==Akses Swagger UI==
    - Memahami dan mencegah serangan seperti SQL Injection dan Cross-Site Scripting (XSS).
 
    - Contoh: Menggunakan parameterized queries dan escaping output.
 
    - Referensi: [Analisis Keamanan Aplikasi Web dengan Python](https://bytescout.com/blog/python-tutorial-web-app-security.html)
 
  
  - **3.3. Mengamankan API dengan Tokenisasi**
+
Setelah dijalankan, buka browser dan kunjungi:
    - Menggunakan token untuk mengamankan komunikasi antara klien dan server.
 
    - Contoh: Implementasi JSON Web Tokens (JWT) dalam Flask.
 
    - Referensi: [Membuat REST API dengan Flask](https://www.digitalocean.com/community/tutorials/create-a-rest-api-using-flask-on-ubuntu)
 
  
**4. Membangun RESTful API Menggunakan Python**
+
http://127.0.0.1:8000/docs
  
  - **4.1. Konsep Dasar RESTful API dan Implementasi dengan Flask**
+
Swagger UI akan otomatis tampil dan mendokumentasikan semua endpoint.
    - Memahami prinsip REST dan cara mengimplementasikannya menggunakan Flask.
 
    - Contoh: Membuat endpoint RESTful untuk operasi CRUD.
 
    - Referensi: [Membuat REST API dengan Flask](https://www.digitalocean.com/community/tutorials/create-a-rest-api-using-flask-on-ubuntu)
 
  
  - **4.2. Dokumentasi API dengan Swagger**
+
==Akses Redoc (Alternatif UI)==
    - Menggunakan Flask-Swagger untuk mendokumentasikan API yang dibuat.
 
    - Contoh: Menambahkan dokumentasi interaktif untuk endpoint yang tersedia.
 
    - Referensi: [Tutorial Flask-Swagger](https://github.com/flasgger/flasgger)
 
  
  - **4.3. Deployment Aplikasi Flask di Ubuntu 24.04**
+
http://127.0.0.1:8000/redoc
    - Langkah-langkah untuk mendeploy aplikasi Flask pada server Ubuntu 24.04 tanpa menggunakan alat dari Microsoft.
 
    - Contoh: Menggunakan Gunicorn dan Nginx untuk menjalankan aplikasi di lingkungan produksi.
 
    - Referensi: [Instalasi Flask di Ubuntu 24.04](https://support.hostinger.com/en/articles/10725412-how-to-install-flask-on-ubuntu-24-04)
 
  
Struktur ini dirancang untuk memberikan pemahaman komprehensif tentang pengembangan dan deployment aplikasi web menggunakan Python, dengan fokus pada praktik terbaik dan contoh nyata yang dapat diterapkan langsung.
+
==Export Dokumentasi ke JSON atau YAML==
 +
 
 +
Kalau kamu butuh file dokumentasi:
 +
 
 +
'''JSON:'''
 +
 
 +
http://127.0.0.1:8000/openapi.json
 +
 
 +
'''YAML (butuh converter, contoh pakai `json2yaml`):'''
 +
 
 +
pip install json2yaml
 +
curl http://127.0.0.1:8000/openapi.json | json2yaml > openapi.yaml
 +
 
 +
==Catatan:==
 +
 
 +
* Kita dapat integrasi Swagger manual (misalnya pakai Flask atau Express.js).
 +
* Saat ini, '''FastAPI sudah auto generate Swagger''' tanpa ribet coding dokumentasi manual.
 +
 
 +
 
 +
==Pranala Menarik==
 +
 
 +
* [[Web Programming]]

Latest revision as of 08:09, 8 April 2025

Kita akan pakai FastAPI + Swagger UI karena simpel dan cocok buat dokumentasi REST API secara otomatis.

Install Python dan pip

Ubuntu 24.04 biasanya udah include Python 3. Tapi kita pastikan dulu:

sudo apt update
sudo apt install python3 python3-pip -y

Buat Virtual Environment (opsional tapi disarankan)

sudo apt install python3-venv -y
python3 -m venv venv
source venv/bin/activate

Install FastAPI dan Uvicorn

pip install fastapi uvicorn

Buat File Project: `main.py`

# main.py

from fastapi import FastAPI
from pydantic import BaseModel

app = FastAPI(title="Swagger API - Metro TV", version="1.0")

# Contoh Model
class Item(BaseModel):
    name: str
    price: float
    is_offer: bool = None 

# Route dasar
@app.get("/")
def read_root():
    return {"message": "Hello, Metro TV"}

# Route dengan parameter
@app.get("/items/{item_id}")
def read_item(item_id: int, q: str = None):
    return {"item_id": item_id, "q": q}

# POST endpoint
@app.post("/items/")
def create_item(item: Item):
    return {"item": item}

Jalankan API

uvicorn main:app --reload

Akses Swagger UI

Setelah dijalankan, buka browser dan kunjungi:

http://127.0.0.1:8000/docs

Swagger UI akan otomatis tampil dan mendokumentasikan semua endpoint.

Akses Redoc (Alternatif UI)

http://127.0.0.1:8000/redoc

Export Dokumentasi ke JSON atau YAML

Kalau kamu butuh file dokumentasi:

JSON:

http://127.0.0.1:8000/openapi.json

YAML (butuh converter, contoh pakai `json2yaml`):

pip install json2yaml
curl http://127.0.0.1:8000/openapi.json | json2yaml > openapi.yaml

Catatan:

  • Kita dapat integrasi Swagger manual (misalnya pakai Flask atau Express.js).
  • Saat ini, FastAPI sudah auto generate Swagger tanpa ribet coding dokumentasi manual.


Pranala Menarik