workerbrian/fe-profile-umy repository overview

⁠Docker Image Overview: Profile Dosen FE UMY (Frontend)

⁠📌 Deskripsi Repositori

Image Docker ini berisi aplikasi Frontend Profil Dosen Fakultas Ekonomi dan Bisnis Universitas Muhammadiyah Yogyakarta (UMY).

Aplikasi ini dibangun menggunakan React 19, Vite, dan Tailwind CSS, serta disajikan menggunakan web server ringan Nginx (Alpine Linux) yang telah dikonfigurasi untuk menangani Single Page Application (SPA) routing.

• Docker Image Name: workerbrian/fe-profile-umy
• Tag Utama: latest
• Exposed Port: 80

⁠🚀 Cara Penggunaan Singkat

⁠1. Menjalankan dengan docker run

Jalankan container secara langsung dari Docker Registry:

docker run -d \
  --name profile-dosen-fe \
  -p 80:80 \
  workerbrian/fe-profile-umy:latest

Akses aplikasi melalui browser di http://localhost (atau alamat IP server Anda).

⁠2. Menjalankan dengan Docker Compose

Gunakan snippet docker-compose.yml berikut untuk penggelaran (deployment) server:

version: '3.8'

services:
  frontend:
    image: workerbrian/fe-profile-umy:latest
    container_name: profile-dosen-umy-fe
    restart: always
    ports:
      - "80:80"
    environment:
      - NODE_ENV=production

Jalankan service di latar belakang (detached mode):

docker compose up -d

⁠⚙️ Build Arguments & Konfigurasi API

Karena aplikasi berupa Single Page Application (SPA) yang dikompilasi oleh Vite, endpoint API backend ditentukan pada saat proses build image.

⁠Membangun Image Custom dengan Backend API Khusus

Jika Anda mem-build image sendiri untuk lingkungan tertentu (misal: production / staging):

docker build \
  --build-arg VITE_API_BASE=https://api-dosen.umy.ac.id \
  -t workerbrian/fe-profile-umy:latest .

⁠🏗️ Spesifikasi Image & Arsitektur

• Multi-stage Build:
  • Stage 1 (Build): node:20-alpine untuk kompilasi kode React/Vite menjadi file statis (dist).
  • Stage 2 (Production): nginx:alpine sebagai web server berukuran kecil dan cepat.
• SPA Routing Support: Menggunakan konfigurasi nginx.conf khusus dengan perutean fallback ke index.html agar React Router berjalan dengan normal saat di-refresh.

⁠🛠️ Perintah Operasional

• Melihat Status Container:

  docker ps -f name=profile-dosen-umy-fe
  

  Copy

• Melihat Log Server:

  docker logs -f profile-dosen-umy-fe
  

  Copy

• Menghentikan & Menghapus Container:

  docker stop profile-dosen-umy-fe && docker rm profile-dosen-umy-fe
  

  Copy