Segala yang pelanggan lihat dan guna dalam app.
Macam muka kedai: papan tanda, rak susun, butang. Apa pelanggan nampak dan sentuh. - Dibina dari blok kecil dipanggil component, contohnya satu kad produk yang diulang untuk setiap item.
- Uruskan state, iaitu keadaan semasa skrin seperti flavor mana ditapis atau berapa item dalam cart.
- Mesti responsive: kemas di telefon, sebab kebanyakan pelanggan buka link di WhatsApp guna telefon.
componentstateresponsive
AI builder hasilkan kod frontend dari prompt anda, jadi tugas anda ialah mengarahkannya dengan jelas.
Bahagian yang buat kerja sebenar di belakang tabir.
Macam dapur dan kakitangan belakang: pelanggan tak nampak, tapi semua kerja jadi di situ. - Terima permintaan dari frontend, proses, dan balas. Komunikasi ini melalui API.
- Tempat business logic duduk: kira jumlah harga, semak stok, format mesej WhatsApp.
- Paparan salah biasanya masalah frontend; data atau pengiraan salah biasanya backend.
APIbusiness logic
Katalog mudah: backend ringan. Tambah simpan order betul atau notifikasi, anda sentuh backend terus.
Maklumat yang app simpan supaya kekal.
Macam buku rekod kedai: produk, harga, stok, order. Kekal walaupun app ditutup. - Disimpan dalam database, dibayangkan sebagai jadual: satu baris setiap produk, lajur untuk nama, harga, stok.
- Empat operasi asas dipanggil CRUD: Create, Read, Update, Delete.
- Tanpa database, app lupa segala perubahan bila page di-refresh.
databaseCRUD
Mula dengan data contoh dalam app, sambung database betul bila perlu simpan order sebenar.
Terbitkan app ke internet supaya orang boleh buka melalui link.
Macam buka kedai depan jalan: dari latihan di rumah, kini ada alamat yang orang boleh datang. - Sebelum deploy, app cuma jalan di localhost, iaitu komputer anda sahaja.
- environment variables simpan rahsia dan tetapan supaya tidak terdedah dalam kod.
- domain: guna alamat percuma penyedia dahulu, beli nama sendiri seperti namaapp.my bila bersedia.
localhostenvironment variablesdomain
Live bermakna sudah deploy DAN link betul-betul boleh dibuka di telefon. Uji sebelum kongsi.
Cara app sahkan siapa pengguna dan apa mereka boleh buat.
Macam kunci pintu belakang kedai: hanya admin boleh masuk urus, pelanggan di ruang depan. - authentication sahkan siapa pengguna; authorization tentukan apa mereka dibenarkan buat.
- role: admin boleh tambah dan ubah produk, pelanggan hanya lihat dan order.
- session: simpan login supaya pengguna tak perlu login semula pada setiap page.
authenticationrolesession
App awam mudah selalunya tak perlu auth penuh dahulu. Bila tambah, guna penyedia teruji, jangan bina sendiri.
Tabiat asas supaya app dan pelanggan anda selamat.
Macam jangan tampal kunci kedai di tingkap: rahsia mesti tersembunyi, bukan dipamer. - Jangan tulis rahsia (API key, password, token) dalam kod frontend; simpan di environment variables.
- Validate input pengguna supaya orang tidak boleh hantar data berniat jahat.
- Kumpul hanya data pelanggan yang anda betul-betul perlukan, dan jangan dedahkannya.
secretsvalidate
Satu kebocoran boleh musnahkan kepercayaan. Tanda AWAS sepanjang laluan bina tabiat selamat.