Logo
© 2019 - 2026 SantriKoding.
All Levels

Membangun Website dan Aplikasi Android Desa Dengan Laravel, React.js dan React Native

4.9 (14 ulasan)
233 members
DISKON 60%
Rp. 999.000
Rp. 399.600

TENTANG


FullStack Developer merupakan profesi yang banyak dicari di dalam industri IT, pasalnya dengan menguasai skill tersebut seseorang bisa mengembangkan sebuah aplikasi mulai dari Backend, Frontend dan juga Mobile (Android/iOS).

Karena memiliki semua skill tersebut, maka tidak heran jika gaji seorang FullStack Developer sangat fantastis, sehingga banyak dari kita berlomba-lomba belajar menguasai skill tersebut.

Pada eBook kali ini, saya mengajak teman-teman semuanya belajar bagaimana cara menjadi seorang FullStack Developer dengan cara membangun sebuah website dan aplikasi Desa menggunakan Laravel (Backend), React.js (Frontend) dan React Native (Mobile Android).

Laravel merupakan Framework yang sangat populer dan banyak digunakan oleh orang-rang terutama di dalam industri IT. Dan nanti-nya kita akan gunakan untuk membuat sebuah Rest API yang bisa digunakan dan dipanggil melalui React.js (Frontend) dan React Native (Mobile Android).

Di dalam Laravel kita akan belajar banyak hal, seperti implementasi JWT atau JSON Web Token, Roles dan Permissions dan API Resources. Sedangkan di dalam React.js kita akan belajar banyak hal, seperti Authentication, menampilkan menu secara dinamis sesuai dengan role, deployment dan masih banyak lagi lainnya.

kemudian kenapa kita menggunakan React.js sebagai Frontend ? Alasannya sederhana, karena React.js ini sangat populer di Dunia dan memiliki ekosistem yang sangat besar. Sehingga saat mengembangkan sebuah aplikasi kita tidak akan kesusahan jika mencari sebuah library atau thrid party lainnya. Dan React.js ini memiliki komunitas yang sangat besar, baik di Indonesia maupun di Dunia.

Karena Frontend menggunakan React.js, maka kita akan menggunakan React Native untuk membangun aplikasi Mobile Android-nya. Alasannya juga sederhana, karena kita tidak perlu susah-susah belajar banyak bahasa pemrogramman ataupun framework, karena React.js dan React Native memiliki sintaks kode yang sama, sehingga teman-teman akan lebih cepat dalam mengembangkan website dan aplikasi mobile.

Di dalam React Native kita akan belajar banyak hal juga, seperti membuat navigasi aplikasi yang elegan dan cantik, fetching data dari API, component, props, upload Play Store dan masih banyak lagi.

Dengan mempelajari isi dari eBook ini, diharapkan teman-teman bisa membuat website dan aplikasi yang bagus dengan standart internasional dan bisa mendapatkan skill FullStack Developer dengan lebih baik dan terarah.


DEMO URL
Demo Restful API (Laravel) https://desa-api.appdev.my.id/
Demo Admin (React.js) https://desa.appdev.my.id/login
Demo Web (React.js) https://desa.appdev.my.id/
Demo Aplikasi (Android) Install Apps dari PlayStore

DAFTAR ISI


Pendahuluan
Cover
Kata Pengantar
Lisensi
Tentang
Perancangan
Diagram Alur Webiste dan Aplikasi
Struktur Table dan Relasi Database (ERD)
Wireframe Aplikasi Android
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 Backend
Persiapan dan Tools Pendukung
Membuat Project Laravel Menggunakan Composer
Installasi Roles & Permissions
Apa itu Laravel Spatie Permissions ?
Installasi dan konfigurasi Roles & Permissions
Installasi JWT (JSON Web Token)
Apa itu JWT?
Installasi dan Konfigurasi JWT
Database
Konfigurasi Koneksi Database
Membuat Models dan Migrations
Relasi Database Menggunakan Eloquent Relationships
Eloquent Accessor, Mutator dan Casting
Membuat Seeder Roles
Membuat Seeder Permissions
Membuat Seeder User
Menjalankan Migration dan Seeding
RESTful API Admin
Membuat RESTful API Login
Membuat RESTful API Dashboard
Membuat RESTful API Permissions
Membuat RESTful API CRUD Roles
Membuat RESTful API CRUD Users
Membuat RESTful API CRUD Categories
Membuat RESTful API CRUD Posts
Membuat RESTful API CRUD Products
Membuat RESTful API CRUD Pages
Membuat RESTful API CRUD Photos
Membuat RESTful API CRUD Sliders
Membuat RESTful API CRUD Aparaturs
RESTful API Public
Membuat RESTful API Posts Public
Membuat RESTful API Products Public
Membuat RESTful API Pages Public
Membuat RESTful API Aparaturs Public
Membuat RESTful API Photos Public
Membuat RESTful API Sliders Public
Deployment (Backend)
Deploy Backend Laravel di cPanel (Shared Hosting)
Installasi & Persiapan Frontend
Membuat Project React.js (Vite)
Hapus File yang Tidak Dibutuhkan
Install Library Pendukung
Konfigurasi Endpoint API Backend
Integrasi Assets Template
Authentication
Konfigurasi Route Login
Membuat Proses Login
Membuat Halaman Forbidden
Halaman Dashboard
Membuat Layout Admin
Konfigurasi Private Route
Konfigurasi Route Dashboard
Menampilkan Statistik Data di Dashboard
Halaman Persmissions
Membuat Component Pagination
Konfigurasi Route Permissions
Menampilkan Data Permissions
CRUD Data Roles
konfigurasi Route Roles Index
Menampilkan Data Roles
Konfigurasi Route Role Create
Membuat Proses Create Data Role
Konfigurasi Route Role Edit
Membuat Proses Edit Data Role
Membuat Proses Delete Data Role
CRUD Data Users
Konfigurasi Route Users Index
Menampilkan Data Users
Konfigurasi Route User Create
Membuat Proses Create Data Users
Konfigurasi Route User Edit
Membuat Proses Edit Data User
Membuat Proses Delete Data User
CRUD Data Categories
Konfigurasi Route Categories Index
Menampilkan Data Categories
Konfigurasi Route Category Create
Membuat Proses Create Data Category
Konfigurasi Route Category Edit
Membuat Proses Edit Data Category
Membuat Proses Delete Data Category
CRUD Data Posts
Konfigurasi Route Posts Index
Menampilkan Data Posts
Konfigurasi Route Post Create
Membuat Proses Create Data Post
Konfigurasi Route Post Edit
Membuat Proses Edit Data Post
Membuat Proses Delete Data Post
CRUD Data Pages
Konfigurasi Route Pages Index
Menampilkan Data Pages
Konfigurasi Route Page Create
Membuat Proses Create Data Page
Konfigurasi Route Page Edit
Membuat Proses Edit Data Page
Membuat Proses Delete Data Page
CRUD Data Products
Konfigurasi Route Products Index
Menampilkan Data Products
Konfigurasi Route Product Create
Membuat Proses Create Data Product
Konfigurasi Route Product Edit
Membuat Proses Edit Data Product
Membuat Proses Delete Data Product
CRUD Data Photos
Konfigurasi Route Photos Index
Menampilkan Data Photos
Membuat Proses Upload Gambar Photo
Membuat Proses Delete Data Photo
CRUD Data Sliders
Konfigurasi Route Sliders Index
Menampilkan Data Sliders
Membuat Proses Upload Gambar Slider
Membuat Proses Delete Data Slider
CRUD Data Aparaturs
Konfigurasi Route Aparaturs Index
Menampilkan Data Aparaturs
Konfigurasi Route Aparatur Create
Membuat Proses Create Data Aparatur
Konfigurasi Route Aparatur Edit
Membuat Proses Edit Data Aparatur
Membuat Proses Delete Data Aparatur
Layouts Web
Membuat Component Navbar dan Footer Web
Membuat Component Alert Empty dan Component Loading
Membuat Component Sliders
Membuat Layout Web
Halaman Homepage Web
Konfigurasi Route Home Web
Menampilkan Sliders di Halaman Home
Menampilkan Data Products di Home
Menampilkan Data Posts di Home
Halaman Aparaturs Web
Konfigurasi Route Aparaturs Web
Menampilkan Data Aparaturs Web
Halaman Pages Web
Konfigurasi Route Pages Web Index
Menampilkan Data Pages Web
Konfigurasi Route Pages Detail Web
Menampilkan Detail Data Pages Web
Halaman Photos Web
Konfigurasi Route Photos Web Index
Menampilkan Data Photos Web
Halaman Posts Web
Konfigurasi Route Posts Web Index
Menampilkan Data Posts Web
Konfigurasi Route Posts Detail Web
Menampilkan Detail Data Posts Web
Halaman Products Web
Konfigurasi Route Products Web Index
Menampilkan Data Products Web
Konfigurasi Route Products Detail Web
Menampilkan Detail Data Products Web
Deployment (Frontend)
Build Project
Deploy Project di cPanel
Installasi & Persiapan Android
Konfigurasi Environment Development
Membuat Project React Native
Assets Aplikasi
Membuat Navigations
Install dan Konfigurasi React Native Navigation
Membuat Halaman Screens Aplikasi
Membuat Navigation Aplikasi
Membuat Bottom Tabs Navigation
Menampilkan Navigation Aplikasi
Halaman Home Screen
Konfigurasi Service API
Membuat Component Loading
Membuat Component Slider
Menampilkan Data Slider di Home Screen
Menampilkan Data products di Home Screen
Menampilkan Data Posts di Home Screen
Halaman Posts Screen
Menampilkan List Data Posts
Menampilkan Detail Data Post
Halaman Pages Screen
Menampilkan List Data Pages
Menampilkan Detail Data Page
Halaman Aparaturs Screen
Membuat Component List Aparatur
Menampilkan Data Aparaturs
Halaman Products Screen
Menampilkan List Data Products
Menampilkan Detail Data Product
Halaman Photos Screen
Membuat Component List Photo
Menampilkan Data Photos
Release Aplikasi ke Play Store
Membuat Bundle .abb
Upload Bundle di Play Store
Penutup
Source Code
Penutup

TOOLS

Tools yang digunakan dalam course ini

Laravel
Laravel

The PHP Framework for Web Artisans

See More
React.js
React.js

A JavaScript library

See More
React Native
React Native

Create native apps for Android and iOS

See More

SCREENSHOTS

Screenshot hasil projek dari course ini

Home Website
Home Website
Permissions
Permissions
Photos
Photos
Home Android App
Home Android App
Products Android App
Products Android App
Detail Post Android App
Detail Post Android App

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

Mujiana Ana

No bio available

"Ini benar benar sangat cocok untuk yang ingin belajar Laravel Api, Rest Api, React JS dan React Native, alurnya enak dipahami bagi pemula seperti saya yang sebelumnya terbiasa dengan PHP Native, kemudian di group juga sangat support ownernya, GAK RUGI Keluarkan Budget buat belajar disini."

Muhamad Reza

tentang saya

"Tutorialnya mantap, sangat detail dalam penjelasan dan menjelaskan setiap bagian kode dengan bahasa yang mudah dimengerti."

DANANG USMANTO

No bio available

"Saya sangat terbantu sekali sebagai pemula dalam mengikuti kursus di santrikoding ini sangat memudahkan tahap-demi tahap dalam pembuatan website/aplikasi..sukses untuk santri koding"

"TERBAIKKK, ISTIMIWIRRR POKONYA MAH! Laravel x React x React Native!"

"Saya baru saja menyelesaikan kelas "Membangun Website dan Aplikasi Android Desa Dengan Laravel, React.js dan React Native" dan saya sangat terkesan dengan pengalaman belajar yang saya dapatkan. Kelas ini sangat komprehensif dan mendalam, mencakup semua aspek penting dari pengembangan web dan aplikasi mobile modern. Instruktur dan Materi: Instruktur sangat berpengalaman dan mampu menjelaskan konsep yang kompleks dengan cara yang mudah dimengerti. Materi yang disampaikan sangat lengkap, mulai dari dasar-dasar hingga teknik lanjutan. Setiap modul disusun dengan sangat baik, memberikan panduan langkah demi langkah yang jelas dan terstruktur. Secara keseluruhan, kelas ini sangat saya rekomendasikan bagi siapa saja yang ingin memperdalam pengetahuan mereka tentang pengembangan web dan aplikasi mobile. Saya merasa lebih percaya diri dengan keterampilan yang saya peroleh dan siap untuk menerapkan ilmu ini dalam proyek-proyek nyata lainnya."

Widya Pratama

Guru kimia yang mencintai dunia koding dan be...

"Materi yang disajikan dalam course ini sangat bagus sekali dan mudah untuk dipelajari"

Husni Mubarok

Saya hanya orang biasa dari kampung

"Salah satu rekomendasi e-book programming berbahasa Indonesia yang bagi saya cukup mudah dipahami, dari tata bahasa dan struktur penjelasannya."

Arimbi Putri

Pengen Jadi Software Engineer

"Materi lengkap banget, terstruktur dan mentor sangat tanggap. Thanks Santri Koding"

Adam Prasetya

No bio available

"Materi sangat lengkap dan detail, sangat rekomendasi untuk yang punya basic laravel dan react. beberapa catatan terkait : sample code sebaiknya dibuat overflow ketika jumlah baris sangat panjang. hal ini membantu agar penjelasan kode (dibagian bawah) tidak tertutup, selain itu basic react sebaiknya disediakan materi refreshment (basic javascript sudah cukup) agar pemahaman terkait hooks dan fitur state masih sinkron dengan proyek. overall tutorial fullstack ini wajib dibeli."

Butuh Bantuan?