📘 Cara Kerja Aplikasi

• 1. Menampilkan Data dari 3 API:
  • Resep: Diambil dari https://dummyjson.com/recipes. Ditampilkan dalam bentuk kartu. Bisa difilter berdasarkan cuisine.
  • Produk: Diambil dari https://dummyjson.com/products. Ditampilkan dalam kartu. Bisa difilter berdasarkan category.
  • User: Diambil dari https://dummyjson.com/users. Ditampilkan dengan info dasar dan detail di modal.
• 2. Fitur Detail:
  • Setiap item memiliki tombol Detail untuk menampilkan informasi lengkap di modal Bootstrap.
• 3. Fitur Add to Cart:
  • Tombol Add to Cart menyimpan data ke localStorage.
  • Cart bisa berisi campuran data resep dan produk.
  • Jumlah item cart ditampilkan pada elemen dengan ID #totalcart.
• 4. Tampilan Cart:
  • Cart ditampilkan secara terpisah antara resep dan produk.
  • Data dibaca dari localStorage dan dirender dalam HTML.
• 5. Checkout ke Backend (Python FastAPI):
  • Checkout mengirim isi cart ke http://127.0.0.1:8000/submit.
  • Data dikirim sebagai JSON: { message: [...] }.
  • Token dikirim lewat header: Authorization: Bearer rahasiatoken123.
  • Jika berhasil, cart akan dikosongkan dan halaman diperbarui.
• 6. Setup dan Instalasi FastAPI (Backend):
  1. 📦 Buat folder project baru dan file main.py
  2. 💻 Install FastAPI dan Uvicorn:
     pip install fastapi uvicorn
  3. 📄 Isi file main.py seperti berikut:

     from fastapi import FastAPI, Request, HTTPException
     						from fastapi.middleware.cors import CORSMiddleware
     						from pydantic import BaseModel
     						
     						app = FastAPI()
     						
     						app.add_middleware(
     							CORSMiddleware,
     							allow_origins=["*"],
     							allow_credentials=True,
     							allow_methods=["*"],
     							allow_headers=["*"],
     						)
     						
     						class Data(BaseModel):
     							message: str
     						
     						@app.post("/submit")
     						async def submit_data(request: Request, data: Data):
     							token = request.headers.get("Authorization")
     							if token != "Bearer rahasiatoken123":
     								raise HTTPException(status_code=401, detail="Unauthorized")
     							return {"received_message": data.message}
     						

  4. 🚀 Jalankan server FastAPI:
     python -m uvicorn main:app --reload
  5. 🌐 Akses server di: http://127.0.0.1:8000 dan dokumentasi di /docs
  6. Ini hasil dari server dan python -m uvicorn main:app --reload pada cmd:
     
  7. Demo :
     
  8. Information : Website aplikasi ini telah terhubung dengan github
     https://github.com/AnanNasep/UAS_123103012_Nasep_PemrogramanAsinkron.git
     Developer dapat dengan mudah meng-update aplikasi menggunakan dit push dari server local ke github

Seluruh proses frontend menggunakan HTML, jQuery, Bootstrap, dan localStorage. Backend menggunakan Python FastAPI dengan komunikasi via fetch() dan token otorisasi.