Logo
© 2019 - 2026 SantriKoding.
All Levels

Membangun Website Toko Online Dengan Laravel, Inertia.js & React.js

4.9 (14 ulasan)
165 members
DISKON 7%
Rp. 400.000
Rp. 372.000

TENTANG


Di dalam buku ini kita semua akan belajar menjadi seorang FullStack Web Developer dengan cara membangun sebuah website Toko Online yang dinamis menggunakan Laravel, Inertia.js dan React.js.

Tidak hanya itu, kita juga akan belajar mengimplementasikan RajaOngkir untuk mendpatkan biaya pengiriman secara otomatis dari jasa expedisi, seperti TIKI, JNE dan POS.

Setelah belajar mengimplementasikan RajaOngkir untuk mendapatkan biaya ongkos kirim, maka kita juga akan mengimplementasikan Payment Gateway untuk proses pembayaran secara otomatis. Dimana dengan menggunakan Payment Gateway kita bisa melakukan pembayaran secara otomatis melalui berbagai metode, seperti Bank Transfer, E-Wallet, Indomaret, Alfamart dan lain sebagainya.

Dengan menggunakan Payment Gateway, maka kita tidak perlu susah payah melakukan verifikasi pembayaran secara manual, karena semua sudah dikerjakan secara otomatis dan untuk Layanan Payment Gateway yang akan kita gunakan adalah Duitku. Dengan Payment Gateway ini kita akan diberikan kemudahan dalam integrasi dan biaya yang sangat terjangkau.

Di dalam aplikasi kita juga akan mempelajari tentang Role dan Permissions secara dinamis, tujuannya untuk memisahkan menu-menu berdasarkan level user yang ditentukan. Dengan fitur ini, kita akan sangat terbantu karena bisa menentukan user dengan level tertentu yang bisa mengakses halaman.

Disini kita juga akan menggunakan Inertia.js yang fungsinya menggantikan peran dari Rest API. Dengan menggunakan Inertia.js kita akan sangat terbantu untuk menghubungkan antara Laravel dengan React.js. Dan karena menggunakan React.js, maka website yang akan kita buat akan bersifat SPA atau Single Page Application.

Setelah proses pembuatan website sudah selesai, maka kita juga akan belajar bagaimana cara melakukan deployment atau meng-onlinkan aplikasi tersebut agar bisa diakses oleh banyak orang. Dan disini kita akan belajar melakukan Deploy menggunakan VPS.

Karena akan melakukan Deployment menggunakan VPS, maka kita juga akan belajar tentang LEMP stack atau kepanjangan dari Linux, Engine X, MySQL dan PHP. Maka secara tidak langsung, kita juga akan belajar tentang basic Devops.

Demo Website : https://geek-store.my.id/

DAFTAR ISI


Pendahuluan
Cover
Kata Pengantar
Lisensi Buku
Tentang Buku
Perancangan
Diagram Aplikasi
Struktur table dan Relasi Database
Fundamental ES6
JavaScript ES6
Variable
Default Parameter
Template String atau Literal
Arrow Function
Rest Parameter
Destructuring & Restructuring
Spread Operator
Array Map
Promise
Async Await
Installasi & Persiapan
Persiapan dan Tools Pendukung
Membuat project Laravel Menggunakan Composer
Konfigurasi Time Zone
Konfigurasi Roles & Permissions
Laravel Sptie
Installasi dan konfigurasi Roles & Permissions dengan Spatie
Konfigurasi Raja Ongkir
Apa itu RajaOngkir ?
Installasi dan Konfigurasi RajaOngkir
Konfigurasi Payment Gateway (Duitku)
Apa itu Payment Gateway ?
Installasi dan Konfigurasi Payment Gateway (Duitku)
Konfigurasi Inertia.js
Apa itu Inertia.js ?
Installasi dan Konfigurasi Inertia.js "server-side"
Installasi dan Konfigurasi Inertia.js "client-side"
Share Data di Inertia.js
Konfigurasi Permissions di Inertia.js dan React.js
Membuat Component Pagination
Membuat Component Search
Membuat Component Delete
Database
Konfigurasi Koneksi Database
Membuat Model dan Migration
Eloquent Relationships
Eloquent Accessor, Mutator dan Casting
Membuat Seeder Roles
Membuat Seeder Permissions
Membuat Seeder User
Menjalankan Migration dan Seeder
Insert Data Provinsi, Kabupaten dan Kecamatan
Authentication
Membuat Controller Register
Membuat Proses Register
Membuat Controller Login
Membuat Proses Login
Membuat Proses Logout
Halaman Dashboard
Membuat Controller Dashboard
Membuat Layout Account
Menampilkan Halaman Dashboard
Menampilkan Statistik di Dashboard
Menampilkan Chart atau Grafik di Dashboard
Permissions
Membuat Controller Permission
Menampilkan Data Permissions
CRUD Data Roles
Membuat Controller Role
Menampilkan Data Roles
Membuat Proses Insert Data Role
Membuat Proses Edit dan Update Data Role
Membuat Proses Delete Data Role
CRUD Data Users
Membuat Controller User
Menampilkan Data Users
Membuat Proses Insert Data User
Membuat Proses Edit dan Update Data User
Membuat Proses Delete Data User
CRUD Data Colors
Membuat Controller Color
Menampilkan Data Colors
Membuat Proses Insert Data Color
Membuat Proses Edit dan Update Data Color
Membuat Proses Delete Data Color
CRUD Data Categories
Membuat Controller Category
Menampilkan Data Categories
Membuat Proses Insert Data Category
Membuat Proses Edit dan Update Data Category
Membuat Proses Delete Data Category
CRUD Data products
Membuat Controller Product
Menampilkan Data Products
Membuat Proses Insert Data Product
Menampilkan Detail Product dan Gambar Product
Membuat Proses Upload Gambar Product
Membuat Proses Edit dan Update Data Product
Membuat Proses Delete Data Product
Transactions
Membuat Controller Transaction
Menampilkan Data Transactions
Menampilkan Detail Data Transaction
CRUD Data Sliders
Membuat Controller Slider
Menampilkan Data Sliders
Membuat Proses Upload Gambar Slider
Halaman Homepage
Membuat Controller Home
Membuat Layout Web
Membuat Component Slider
Membuat Component Card Category
Membuat Component Card Product
Menampilkan Halaman Homepage
Halaman Categories
Membuat Controller Category Web
Menampilkan Data Categories Web
Menampilkan Detail Data Category Web
Halaman products
Membuat Controller Product Web
Menampilkan Data products Web
Menampilkan Detail Data Product Web
Membuat Fitur Ubah Gambar Product
Membuat Fitur Ubah Harga Product
Halaman Carts
Membuat Controller Cart
Menambahkan Fungsi Add To Cart di Detail Product
Menampilkan Jumlah Cart di Menu
Menampilkan Data Carts
Halaman Checkouts
Membuat Controller Checkout dan Callback
Menampilkan Data Provinsi
Menampilkan Data Kota atau Kabupaten Berdasarkan Provinsi
Menampilkan Data Kecamatan Berdasarkan Kota atau Kabupaten
Membuat Fitur Cek Ongkos Kirim (Raja Ongkir)
Membuat Proses Checkout
Uji Coba Pembayaran Menggunakan Payment Gateway
Membuat Fitur Live Search
Membuat Controller Search
Membuat Fitur Live Search
Deployment
Membeli VPS (Virtual Private Server)
Konfigurasi LEMP Stack di Server VPS
Proses Deployment Project ke Server VPS melalui GitHub
Menghubungkan Domain ke Server VPS
Memasang SSL di Server VPS
Konfigurasi Callback Payment Gateway
Penutup
Source Code
Penutup

TOOLS

Tools yang digunakan dalam course ini

React.js
React.js

A JavaScript library

See More
Inertia.js
Inertia.js

Build Modern Single Page App

See More
Laravel
Laravel

The PHP Framework for Web Artisans

See More

SCREENSHOTS

Screenshot hasil projek dari course ini

Halaman Dashboard
Halaman Dashboard
Halaman Detail Product
Halaman Detail Product
Halaman Cart
Halaman Cart

BENEFITS

Manfaat yang akan Anda dapatkan dari course ini


Ebook

Source Code

Private Group Member

Konsultasi Belajar

Update Materi

Kupon Diskon Hosting

Sertifikat

Akses Selamanya

Real Studi Kasus

DISUSUN OLEH

Tim expert yang menyusun course ini

Fika Ridaul Maulayya
Fika Ridaul Maulayya
PREMIUM MEMBER

Full-Stack Developer, Content Creator and CEO & Founder SantriKoding.com


ULASAN MEMBERS

Apa kata mereka tentang course ini

"Materinya keren sangat membantu, dan ada grup privat jika ada kesulitan bisa nanya-nanya, mantap pokonya."

Izsal Qurlinas Afandi

No bio available

"Sangat bagus untuk saya memahami sebuah flow aplikasi e-commerce dalam dunia programming. makasih mas"

Yasin Yusuf

saya adalah aku

"Materinya bagus mudah diikuti, bagus untuk pemula"

Widya Pratama

Guru kimia yang mencintai dunia koding dan be...

"Sangat menarik dan mudah dipelajari serta dipahami materi-materi ini."

Nu'man Nasyar MZ

No bio available

"MaSyaa Allah, Alhamdulillah selesai dengan sempurna.. Modul ini sangat mengajarkan banyak sekali ilmu-ilmu baru tentang react.js, saya banyak sekali belajar dari sini hingga akhirnya bisa menyeleesaikan modul ini dengan sempurna, hasil buatan saya bisa dicek di https://nide-store.my.id/ Terima kasih kepada mas vika yang telah membantu saya banyak hal dari modul ini, semoga beliau selalu diberkahi Allah 'Azza wa Jalla.."

laodenajamuddin

Saya Ayah Saida

"Allhamdilillah dengan adanya ebook ini sasaran kinerja saya di kantor selesai, materinya sangat bagus dan mentornya ramah, respon cepat bila ada kendala dan pertanyaan cepat ditanggapi, terimakasih mas Fika, sukses terus Santri Koding"

"bukunya keren penulisnya ramah selalu ngasih solusi ketika ada bug...TOP BGT"

Aditya Pratama

No bio available

"Alhamdulillah .. tulisannya ringan di baca , cocok buat pemula yang baru mau belajar. Semoga makin rajin berkarya mas fika berkah selalu ilmunya"

yaserantariksa

WEB PROGRAMMER

"Tutorial Real World Project paling Oke, Source Code nya bersih dari error, Step Step nya di jelaskan dengan singkat dan terinci tanpa ada yang kelewat, dan Project yang di bikin fitur nya banyak dibanding tutorial yang lain. Thanks Santri Koding"

Edik

frontend dev

"Recomended sekali ebook nya , materi lengkap dan mentor sangat humble jika ada kendala. Tossssss mas fika 😬😬👍"

Ikhbar Nurinsani

Full-Stack Web Developer

"Tutorialnya mudah diikuti, tetapi materi pada bagian integrasi API pihak ketiga sepertinya perlu diperbarui karena sudah outdated"

Butuh Bantuan?