e-niaga-admin-nextjs
Situs web demo tidak lagi berfungsi karena PlanetScale menghentikan paket gratisnya.
Tanggal Mulai: 26 Juli 2023.
Keterangan
Dasbor Admin E-Commerce dengan Integrasi Stripe adalah aplikasi web tangguh yang dirancang untuk menyederhanakan dan meningkatkan pengelolaan situs web e-commerce. Dikembangkan menggunakan teknologi mutakhir seperti Next JS, TypeScript, Tailwind CSS, Shadcn UI, Planet Scale, Prisma, zustand, petugas auth, Cloudinary, dan Stripe, dasbor komprehensif ini memberi administrator perangkat canggih untuk mengawasi dan mengoptimalkan berbagai aspek pekerjaan. toko daring.
Fitur Utama
- Dasbor admin memungkinkan administrator situs web untuk membuat, memperbarui, dan menghapus informasi toko.
- Admin dapat mengelola baliho atau spanduk yang muncul di beranda website secara efisien. Mereka dapat mengunggah, memperbarui, dan menghapus spanduk promosi untuk menarik pelanggan dan menyoroti penawaran atau penjualan yang sedang berlangsung.
- Dengan dashboard admin, mengelola kategori produk, ukuran, dan warna menjadi mudah. Administrator dapat menambah, mengedit, atau menghapus kategori, ukuran, dan warna, memungkinkan situs web mengatur dan menampilkan produk secara efisien.
- Untuk memungkinkan komunikasi yang lancar antara aplikasi web front-end dan back-end, dasbor menyertakan rute API. Hal ini memastikan bahwa informasi produk diambil dan ditampilkan dengan lancar di situs web yang menghadap pelanggan.
- Dasbor admin menggunakan autentikasi Panitera untuk autentikasi yang aman, memastikan bahwa hanya personel yang berwenang yang dapat mengakses dan mengelola informasi sensitif.
- Dengan integrasi Planet Scale dan Prisma, aplikasi ini mendapatkan keuntungan dari database yang kuat dan terukur, yang mampu menangani inventaris produk yang terus bertambah dan meningkatkan lalu lintas situs web.
- Inti dari setiap situs web e-niaga terletak pada kemampuan manajemen produknya. Dasbor admin memberdayakan administrator untuk menambahkan produk baru, memperbarui produk yang sudah ada, mengarsipkan produk yang stoknya habis, menandai produk sebagai produk unggulan, dan menghapus produk yang tidak lagi tersedia. Mereka dapat mengatur detail produk seperti nama, kategori, harga, gambar, dan atribut spesifik produk lainnya.
- Manajemen pesanan yang efisien sangat penting untuk situs web e-niaga mana pun. Dasbor menyediakan alat komprehensif untuk melihat, memproses, dan mengelola pesanan masuk.
- Integrasikan Stripe dengan lancar sebagai gerbang pembayaran, memungkinkan pelanggan melakukan pembayaran online dengan aman dan nyaman. Admin dapat melihat riwayat transaksi dan memastikan pengalaman checkout yang lancar bagi pembeli.
Menguji Proyek
Untuk menguji proyek, unduh file zip dan buka di editor pilihan Anda. Kemudian, jalankan npm install di terminal untuk menginstal dependensi.
Setelah menginstal dependensi yang diperlukan, Anda harus membuat file .env di root folder proyek Anda. Variabel lingkungan yang diperlukan adalah sebagai berikut.
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/
DATABASE_URL=
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=
STRIPE_API_KEY=
FRONTEND_STORE_URL=
STRIPE_WEBHOOK_SECRET=
Ikuti langkah-langkah dari dokumentasi resmi untuk Clerk, Planet Scale, Cloudinary, dan Stripe untuk mendapatkan nilai variabel lingkungan. Setelah menyelesaikan langkah-langkah di atas, jalankan npm run dev untuk menguji proyek.
Jika Anda tidak ingin melalui semua masalah, Anda selalu dapat menguji situs demo untuk proyek ini.
