← all posts

Panduan Dasar Keamanan Website Portfolio

7/3/2026

Panduan Dasar Keamanan Website Portfolio

Panduan Dasar Keamanan Website Portfolio

"Portfolio saya kecil, tidak ada yang mau meretas." — Ini mindset paling berbahaya. Kebiasaan buruk dalam keamanan akan terbawa ke proyek profesional.

Threat Model untuk Portfolio

+-----------------------------------------------------+
|  Ancaman              |  Dampak                     |
+-----------------------------------------------------+
| SQL Injection         |  Database bobol             |
| XSS (Cross-Site)      |  Pengguna terkena serangan  |
| CSRF                  |  Aksi tidak sah             |
| Exposed Secrets       |  API key, DB bocor           |
| DDoS                  |  Website down               |
| Dependency Vuln.      |  Backdoor terbuka           |
+-----------------------------------------------------+

Checklist Keamanan Wajib

1. Environment Variables

JANGAN PERNAH commit file .env ke git! Pastikan .gitignore berisi:

.env
.env.local
.env.production

2. Validasi Input di Server

Validasi client hanya untuk UX. Validasi server adalah keharusan:

export async function POST(request: Request) {
  const body = await request.json();

  // Validasi server-side — WAJIB!
  if (!body.email || !body.email.includes("@")) {
    return Response.json(
      { error: "Email tidak valid" },
      { status: 400 }
    );
  }

  // Sanitasi: hapus tag HTML untuk cegah XSS
  const sanitized = {
    name: body.name.replace(/<[^>]*>/g, ""),
    message: body.message.replace(/<[^>]*>/g, ""),
  };
}

3. Security Headers

// middleware.ts
const headers = {
  "Content-Security-Policy": "default-src 'self'",
  "X-Frame-Options": "DENY",
  "X-Content-Type-Options": "nosniff",
  "Referrer-Policy": "strict-origin-when-cross-origin",
};

4. Dependency Audit

npm audit        # Cek kerentanan
npm outdated     # Lihat library usang
npm update       # Update library

5. HTTPS Wajib

Vercel berikan HTTPS gratis. Self-hosting? Gunakan Let's Encrypt:

sudo certbot --nginx -d ulumdcode.web.id

Tabel Proteksi

AncamanProteksi
SQL InjectionPrisma ORM (parameterized query)
XSSEscape HTML, CSP header
CSRFNextAuth built-in protection
Brute ForceRate limiting (Vercel WAF)
Data LeakNo .env in git, least privilege

Kesimpulan: Keamanan adalah proses berkelanjutan. Mulai dari dasar, lalu tingkatkan bertahap.