POS Kasir

 

🧠 ARSITEKTUR (PRODUCTION-READY, tapi tetap lean)

🔩 Stack yang masuk akal

• Frontend: Vanilla JS (cepat & ringan) atau naik ke React
• Backend: Node.js (Express)
• Database: MySQL (atau PostgreSQL)
• Realtime: Socket.IO
• Auth: JWT
• Deploy: VPS / Railway / Render

Prinsip: mulai simple → modular → scale.

---

🧱 STRUKTUR DATABASE (INI TULANG PUNGGUNG)

-- users (kasir/admin)
CREATE TABLE users (
  id INT AUTO_INCREMENT PRIMARY KEY,
  username VARCHAR(50),
  password VARCHAR(255),
  role ENUM('admin','kasir')
);

-- products
CREATE TABLE products (
  id INT AUTO_INCREMENT PRIMARY KEY,
  kode VARCHAR(20),
  nama VARCHAR(100),
  harga_beli INT,
  harga_jual INT,
  stok INT
);

-- transactions
CREATE TABLE transactions (
  id INT AUTO_INCREMENT PRIMARY KEY,
  tanggal DATETIME,
  total INT,
  bayar INT,
  kembalian INT,
  kasir_id INT
);

-- transaction_items
CREATE TABLE transaction_items (
  id INT AUTO_INCREMENT PRIMARY KEY,
  transaksi_id INT,
  product_id INT,
  qty INT,
  harga INT,
  subtotal INT
);

---

⚙️ BACKEND (API INTI)

🚀 Setup Express

// server.js
const express = require('express');
const app = express();
app.use(express.json());

const db = require('./db'); // koneksi MySQL

// ambil produk
app.get('/products', async (req, res) => {
  const [rows] = await db.query("SELECT * FROM products");
  res.json(rows);
});

// transaksi
app.post('/transaksi', async (req, res) => {
  const { items, bayar, kasir_id } = req.body;

  let total = items.reduce((sum, i) => sum + i.qty * i.harga, 0);
  let kembalian = bayar - total;

  const [trx] = await db.query(
    "INSERT INTO transactions (tanggal,total,bayar,kembalian,kasir_id) VALUES (NOW(),?,?,?,?)",
    [total, bayar, kembalian, kasir_id]
  );

  for (let item of items) {
    await db.query(
      "INSERT INTO transaction_items (transaksi_id,product_id,qty,harga,subtotal) VALUES (?,?,?,?,?)",
      [trx.insertId, item.id, item.qty, item.harga, item.qty * item.harga]
    );

    // update stok
    await db.query(
      "UPDATE products SET stok = stok - ? WHERE id=?",
      [item.qty, item.id]
    );
  }

  res.json({ success: true, total, kembalian });
});

app.listen(3000, () => console.log("POS jalan di port 3000"));

---

🖥️ FRONTEND (KASIR CEPAT)

<h2>GoSmart Web POS</h2>

<select id="produk"></select>
<input type="number" id="qty" placeholder="Qty">
<button onclick="tambah()">Tambah</button>

<div id="cart"></div>

<input type="number" id="bayar" placeholder="Bayar">
<button onclick="checkout()">Bayar</button>

<script>
let cart = [];

async function loadProduk(){
  let res = await fetch('/products');
  let data = await res.json();

  let select = document.getElementById('produk');
  data.forEach(p=>{
    select.innerHTML += `<option value="${p.id}" data-harga="${p.harga_jual}">${p.nama}</option>`;
  });
}

function tambah(){
  let select = document.getElementById('produk');
  let id = select.value;
  let nama = select.options[select.selectedIndex].text;
  let harga = select.options[select.selectedIndex].dataset.harga;
  let qty = document.getElementById('qty').value;

  cart.push({id,nama,harga,qty});
  render();
}

function render(){
  let html = "";
  cart.forEach(c=>{
    html += `<p>${c.nama} x${c.qty}</p>`;
  });
  document.getElementById('cart').innerHTML = html;
}

async function checkout(){
  let bayar = document.getElementById('bayar').value;

  let res = await fetch('/transaksi',{
    method:'POST',
    headers:{'Content-Type':'application/json'},
    body: JSON.stringify({items:cart,bayar,kasir_id:1})
  });

  let data = await res.json();
  alert("Kembalian: " + data.kembalian);
  cart = [];
}
loadProduk();
</script>

---

🔥 FITUR WAJIB LEVEL ALFAMART

✔ Multi Kasir Login

• JWT auth
• Role: admin / kasir

✔ Realtime Dashboard

• Socket.IO → update penjualan live

✔ Barcode Scanner

• Gunakan:
  • html5-qrcode (kamera HP)
  • atau scanner USB (langsung input ke field)

✔ Laporan Lengkap

• Harian / mingguan / bulanan
• Produk terlaris
• Margin

✔ Export

• Excel / PDF

---

🧨 FITUR “BOS MODE” (BIAR BEDA DARI YANG LAIN)

• 🔥 Notifikasi stok hampir habis (WhatsApp API)
• 🔥 Multi cabang (toko A, B, C)
• 🔥 Harga beda per cabang
• 🔥 AI prediksi barang laku
• 🔥 Integrasi printer thermal (struk)

---

⚠️ REAL TALK (STRATEGI BISNIS)

Kalau kamu bangun ini serius:

• Ini bukan cuma buat toko kamu
• Ini bisa jadi: 👉 Produk SaaS POS untuk UMKM

Model:

• Free basic
• Premium bulanan

---

🚀 ROADMAP EKSEKUSI (JANGAN NGACO)

1. Jalankan versi basic (hari ini)
2. Tambah login + auth
3. Tambah laporan
4. Tambah realtime
5. Deploy online

---