Cara Membuat Toko Online: Produk, Keranjang, Checkout dan Stok

Untuk membuat toko online, Anda memerlukan katalog produk, keranjang, checkout yang menerima pembayaran lewat penyedia seperti Stripe, cara mencatat pesanan dan mengurangi stok, serta tampilan admin untuk memproses pesanan. Aplikasi pembuat dengan AI dapat menyusun semua itu dari deskripsi yang jelas. Yang paling perlu dipikirkan bukan tampilan tokonya, melainkan bagian yang berkaitan dengan uang: kapan pesanan dianggap sudah dibayar, bagaimana stok dicadangkan, dan bagaimana Anda menangani pajak, ongkos kirim, dan pengembalian dana.

Toko kustom atau Shopify? Putuskan dulu

Jujurlah soal ini sebelum mulai membangun apa pun.

Platform perdagangan yang dihosting (Shopify, Squarespace Commerce, WooCommerce, dan sejenisnya) biasanya lebih baik jika:

Anda menjual produk fisik dengan tarif ongkir, label pengiriman, dan retur
Anda perlu menghitung pajak di banyak wilayah
Tim yang tidak paham teknis akan menambahkan produk dan memproses pesanan setiap hari
Anda menginginkan toko aplikasi berisi add-on seperti ulasan, email marketing, dan loyalitas
Anda menjual di beberapa kanal dan membutuhkan satu jumlah stok

Paket Shopify berlangganan bulanan dengan diskon jika dibayar tahunan, dan transaksi kartu dikenai biaya pemrosesan tambahan; cek halaman harga Shopify untuk negara Anda, karena harganya berbeda tiap wilayah.

Toko kustom biasanya lebih unggul jika:

Produknya tidak biasa: konfigurator pesanan khusus, kombinasi pemesanan dan produk, unduhan digital dengan lisensi, atau daftar harga B2B per pelanggan
Toko hanyalah bagian dari aplikasi yang lebih besar (platform kursus, situs keanggotaan, marketplace)
Anda menjual katalog kecil dan ingin kendali penuh atas desain dan alur checkout
Anda ingin memiliki kode sendiri dan menghindari ketergantungan pada satu platform

Banyak penjual kecil lebih cocok memakai platform. Jika kebutuhan Anda biasa-biasa saja, itu justru kabar baik. Ambil jalan pintas tersebut.

Apa yang dibutuhkan toko online

Data

Tabel	Kolom utama
Produk	Nama, slug, deskripsi, gambar, harga, aktif ya/tidak, kategori
Varian	Produk, nilai opsi (ukuran, warna), SKU, harga khusus, stok
Pesanan	Nomor, email pelanggan, alamat pengiriman, status, subtotal, ongkir, pajak, total, ID pembayaran
Item pesanan	Pesanan, varian, jumlah, harga satuan saat pembelian
Pergerakan stok	Varian, perubahan (+/−), alasan (penjualan, restok, pengembalian dana, koreksi), tanggal
Kode diskon	Kode, jenis, nominal, tanggal kedaluwarsa, batas penggunaan — nanti saja, bukan di awal

Simpan harga pada saat pembelian di setiap item pesanan. Jika bulan depan Anda mengubah harga, pesanan lama harus tetap menampilkan harga yang dibayar pelanggan.

Halaman

Toko: beranda, halaman kategori atau koleksi, halaman produk, keranjang, pengalihan ke checkout, halaman konfirmasi pesanan.
Admin: produk dan stok, pesanan dengan status (dibayar, dikemas, dikirim, dikembalikan dananya), pelanggan, angka penjualan sederhana.
Legal dan kebijakan: pengiriman, retur, privasi, dan syarat. Pembeli mencari halaman ini sebelum membeli, dan banyak wilayah mewajibkan sebagian di antaranya menurut hukum.

Izin akses

Biarkan pembeli berbelanja tanpa akun. Checkout tamu menghilangkan satu langkah, dan akun bisa menyusul nanti. Hanya admin yang boleh melihat pesanan dan mengubah produk. Lindungi area admin dengan login yang benar dan pemeriksaan di sisi server.

Cara kerja checkout yang baik

Pola paling aman untuk toko kustom adalah halaman checkout yang dihosting. Dengan Stripe:

Pembeli mengklik Checkout. Server Anda memeriksa ulang harga dan stok dari database — jangan pernah mempercayai apa yang dikirim browser — lalu membuat sesi Stripe Checkout.
Pembeli membayar di halaman Stripe. Data kartu tidak pernah sampai ke server Anda.
Stripe memanggil endpoint webhook aplikasi Anda untuk memberi tahu bahwa pembayaran berhasil. Baru setelah itu Anda menandai pesanan sebagai dibayar dan mengurangi stok.
Pembeli diarahkan ke halaman konfirmasi, dan Anda mengirim email konfirmasi.

Dua kesalahan yang harus dihindari: membuat pesanan "dibayar" dari pengalihan halaman sukses (orang menutup tab, dan pengalihan bisa dipalsukan) dan menghitung total di browser. Keduanya mudah keliru dilakukan AI kecuali Anda menyebutkannya secara eksplisit.

Harga standar Stripe berupa persentase ditambah biaya tetap per pembayaran kartu yang berhasil, tanpa biaya pendaftaran atau biaya bulanan (per September 2026); tarif pastinya bergantung pada negara dan jenis kartu. Bangun semuanya dulu di mode uji Stripe dengan nomor kartu uji. Panduan kami tentang menambahkan pembayaran ke aplikasi Anda membahas kunci API, mode uji, dan webhook.

Keputusan pajak, pengiriman, dan stok

Ini keputusan bisnis yang tidak bisa diambil AI untuk Anda:

Pajak. Apakah Anda wajib memungut pajak penjualan atau PPN, dan dengan tarif berapa, bergantung pada lokasi Anda dan pelanggan. Stripe menawarkan produk untuk ini (Stripe Tax), atau Anda bisa menetapkan tarif tetap jika situasinya sederhana. Tanyakan ke akuntan jika Anda ragu.
Pengiriman. Mulailah dengan beberapa tarif tetap (dalam negeri, internasional, gratis di atas batas tertentu). Tarif kurir real-time dan pencetakan label adalah bagian yang paling banyak menghemat kerja di platform seperti Shopify.
Stok. Tentukan apakah stok dicadangkan saat checkout dimulai atau hanya saat pembayaran berhasil. Untuk toko kecil, mengurangi stok saat pembayaran berhasil dan memeriksa ulang tepat sebelum checkout lebih sederhana; namun sesekali barang terakhir bisa terjual dua kali, jadi putuskan bagaimana menanganinya. Untuk pelacakan stok di luar toko, lihat cara membangun aplikasi manajemen inventaris.

Prompt pertama yang berhasil

Buatkan toko online untuk Loam & Clay, studio keramik kecil yang menjual mug, mangkuk, dan vas. Bagian toko: beranda dengan produk unggulan, halaman toko dengan filter kategori, halaman produk dengan galeri gambar, varian warna, dan status stok, serta keranjang yang bisa digeser dari samping. Simpan produk, varian, pesanan, dan item pesanan di database dan isi 10 produk yang realistis. Area admin (wajib login) untuk menambah dan mengedit produk, mengunggah gambar, mengubah stok, dan melihat pesanan dengan status dibayar / dikemas / dikirim. Tombol checkout boleh berupa placeholder dulu — kita tambahkan Stripe Checkout berikutnya. Desain hangat dan minimalis, mengutamakan tampilan ponsel. Jangan ada ulasan palsu atau klaim "gratis ongkir ke seluruh dunia".

Memulai dengan checkout sebagai placeholder itu disengaja: pastikan katalog dan admin sudah benar dulu, lalu pasang pembayaran di langkah terpisah yang bisa Anda uji dengan benar.

Langkah membangun

Katalog dan halaman produk, dengan nama, harga, dan foto produk yang sebenarnya.
Keranjang yang tetap ada setelah halaman di-refresh.
Admin: produk, varian, stok, unggah gambar. Lindungi dengan login.
Stripe Checkout dalam mode uji, dengan server yang memeriksa ulang harga dan stok.
Webhook yang menandai pesanan sebagai dibayar dan mengurangi stok. Uji dari awal sampai akhir dengan kartu uji.
Email pesanan ke pelanggan dan ke Anda.
Kebijakan dan SEO: halaman pengiriman dan retur, judul serta deskripsi produk, gambar untuk dibagikan. Lihat SEO untuk situs web yang dibuat dengan AI.
Rilis: ganti ke kunci Stripe live, lakukan pembelian kecil yang sungguhan sendiri, lalu kembalikan dananya.

Kesalahan umum

Mempercayai harga dari browser. Selalu hitung ulang di server.
Menandai pesanan dibayar di halaman sukses alih-alih lewat webhook.
Menimpa angka stok alih-alih mencatat pergerakan stok — Anda kehilangan riwayat alasan perubahan stok.
Meluncurkan tanpa halaman pengiriman dan retur.
Gambar produk yang sangat besar. Kompres dan sajikan dari penyimpanan file, bukan di dalam kode.
Membangun daftar keinginan, ulasan, dan poin loyalitas sebelum penjualan pertama.

Biaya operasional

Siapkan anggaran untuk: hosting dan database, biaya pemrosesan pembayaran di setiap penjualan, domain, penyedia email untuk konfirmasi pesanan, dan mungkin layanan pajak. Toko kustom menghindari langganan platform dan biaya aplikasi, tetapi Anda menanggung perawatannya: jika ada yang rusak di checkout, Andalah yang harus memperbaikinya.

Jika Anda ingin penjual lain selain diri sendiri — beberapa vendor, masing-masing dibayar — itu marketplace, dengan aturan pembayaran yang berbeda. Lihat cara membangun marketplace.

Membangunnya dengan Mythex

Di Mythex, Anda menjelaskan tokonya dan agen membangun katalog, keranjang, dan admin di pratinjau langsung, dengan database Postgres untuk produk dan pesanan serta penyimpanan file untuk gambar produk. Use case toko di dokumentasi merekomendasikan urutan yang persis seperti di atas: katalog dulu, checkout kemudian.

Pembayaran memakai akun Stripe Anda sendiri: Anda menambahkan kunci Stripe sebagai secret proyek dan meminta agen menambahkan Checkout, lalu menguji dengan kartu uji Stripe di pratinjau (resep Stripe). Webhook memerlukan URL publik, jadi publikasikan dulu sebelum Anda mengarahkan Stripe ke sana (resep webhook). Pajak, pengiriman, dan sinkronisasi stok bukan fitur bawaan Mythex, dan tidak ada integrasi Shopify asli — jika Anda membutuhkan semua itu sebagai produk jadi, Shopify adalah pilihan yang lebih baik. Sebagai titik awal, lihat template toko, misalnya toko e-commerce.

Pertanyaan

Bisakah saya membuat toko online dengan AI?

Bisa. Aplikasi pembuat dengan AI dapat membuat katalog, halaman produk, keranjang dan pengelolaan pesanan, lalu menghubungkan checkout ke penyedia pembayaran seperti Stripe menggunakan akun Anda sendiri. Pajak, ongkos kirim, dan aturan pengiriman barang tetap harus Anda tentukan dan uji dengan cermat.

Apakah saya harus memakai Shopify untuk berjualan online?

Tidak. Anda bisa berjualan dengan toko kustom dan penyedia pembayaran seperti Stripe. Shopify tetap pilihan yang lebih mudah jika Anda ingin stok, pengiriman, pajak, dan aplikasi ditangani dalam satu produk, atau jika tim yang tidak paham teknis akan mengelola toko setiap hari.

Bagaimana cara menerima pembayaran di toko online kustom?

Sebagian besar toko kustom mengarahkan pembeli ke Stripe Checkout, yaitu halaman pembayaran yang dihosting oleh Stripe, lalu membuat pesanan saat Stripe mengonfirmasi pembayaran melalui webhook. Data kartu tidak pernah menyentuh server Anda, sehingga lebih sederhana dan lebih aman.

Bagaimana cara menjaga stok tetap akurat?

Kurangi stok hanya setelah pembayaran dikonfirmasi, periksa stok lagi tepat sebelum membuat checkout, dan catat setiap perubahan (penjualan, restok, pengembalian dana) sebagai pergerakan stok, bukan dengan menimpa angka. Barang yang terjual di kanal lain juga harus memperbarui jumlah stok yang sama.