#4 Membuat App CATATAN BELANJA | Tutorial REACT "Paling Masuk Akal" untuk PEMULA 🤩🌐
Dengan menggunakan pemahaman kita dari video-video sebelumnya, mari kita membuat aplikasi React SEDERHANA 😁
Source Code Starter Template:
https://github.com/sandhikagalih/belajar-react-untuk-pemula/tree/main/4-catatan-belanja/starter-template
Referensi React:
– https://react.dev/learn/
– https://id.react.dev/learn/
Console Ninja
https://marketplace.visualstudio.com/items?itemName=WallabyJs.console-ninja
Repository Belajar React WPU
https://github.com/sandhikagalih/belajar-react-untuk-pemula
Jalur Belajar React:
1. HTML Dasar
https://www.youtube.com/playlist?list=PLFIM0718LjIVuONHysfOK0ZtiqUWvrx4F
2. CSS Dasar
https://www.youtube.com/playlist?list=PLFIM0718LjIUBrbm6Gdh6k7ZUvPIAZm7p
3. CSS Layouting
https://www.youtube.com/playlist?list=PLFIM0718LjIUu4Ju9GUL5zpLcuq08TKYr
4. Javascript Dasar
https://www.youtube.com/playlist?list=PLFIM0718LjIWXagluzROrA-iBY9eeUt4w
5. Javascript DOM
https://www.youtube.com/playlist?list=PLFIM0718LjIWB3YRoQbQh82ZewAGtE2-3
6. Javascript Lanjutan
https://www.youtube.com/playlist?list=PLFIM0718LjIUGpY8wmE41W7rTJo_3Y46-
7. Git & GitHub
https://www.youtube.com/playlist?list=PLFIM0718LjIVknj6sgsSceMqlq242-jNf
8. NodeJS & NPM
https://www.youtube.com/playlist?list=PLFIM0718LjIW-XBdVOerYgKegBtD6rSfD
— CHAPTERS —
00:00:00 Intro
00:00:45 Hasil akhir app
00:07:26 Instalasi React
00:13:26 Konversi HTML ke React
00:21:45 Menyiapkan data awal
00:24:30 Menampilkan data ke komponen list
00:27:34 Mencoret barang
00:32:46 Generate quantity option
00:36:14 Menyiapkan item baru
00:51:16 Lifting state up
00:55:37 Mengelola items
00:59:33 Menghapus items
01:04:29 Checklist barang
01:10:03 Menjalankan fitur action
01:18:25 Fitur stats
01:25:35 Merapihkan komponen
01:32:05 Closing
—
🔥 SUPPORT WPU 🔥
👕 Beli Hoodie & T-Shirt di WPU Official Store 👕
https://shopee.co.id/wpustore.id
👾 Gabung Server Discord WPU 👾
https://discord.gg/S4rrXQU
– Donasi Channel WPU (OVO / GoPay / Dana / LinkAja)
https://saweria.co/sandhikagalih
https://karyakarsa.com/sandhikagalih
—
📢 FOLLOW SOCIAL MEDIA 📢
– https://www.instagram.com/sandhikagalih
– tiktok.com/@sandhika.galih
– https://twitter.com/sandhikagalih
– https://github.com/sandhikagalih
terimakasih dan #janganlupatitikkoma!
@sandhikagalih
#4 Membuat App CATATAN BELANJA | Tutorial REACT "Paling Masuk Akal" untuk PEMULA 🤩🌐
#4 Membuat App CATATAN BELANJA | Tutorial REACT "Paling Masuk Akal" untuk PEMULA 🤩🌐
🔥🔥🔥
🔥🔥🔥
Pertama pak🙌🏻
Ini yang sedang ditunggu" paakkk
First pak
Akhirnya upload playlist React lagi
Pak maaf, kok video tentang BDD gak ada lagi yaa ?? 😭😭😭😭😭
Mantap,berkah buat pak dosen..🔥
LANJUTIN SAMPE MERN PAKKK🔥🔥🔥
Hadir pak, gokil bgt tutorialnya 🔥🔥🔥🔥🔥
Keren, mantap pak, semoga berkah ilmu, makasih banyak
AlhamdulIllah, Terimakasi Pak
Kenapa gak menggunakan tailwind pak?
👍
mantap, berkas pak dosen
Yang banyak pak tutorialnya 😊
Mantap pak
Mantap 👍 Bikin aplikasi React untuk belajar bagi pemula yang pas juga, daftar belanja lebih dari sekadar todo list karena ada quantity juga.
Btw kita bisa improve dikit codenya untuk rename title di HTML nya menjadi "Catatan Belanjaku". Lalu juga input quantity dengan input number, bukan select option, biar bisa lebih dari 10 barang.
Kita juga bisa submit form data belanjanya dengan cara uncontrolled component, tanpa useState, yang mungkin juga bisa dibahas pada video berikut2nya.
Mantapp pak, langsung gas belajar🤩
Mungkin video kedepannya bisa bikin project yang berkaitan dengan data yang diambil dari local database / public api pak.
Ilmu mahal mantap pak. 🚀🔥
Pak website undangan lanjut lagi dong😂
Like ke 100 😁☝️
Lgi diwarkop liat pak dika upload otw pulang nyalain pc gas,,,,,😂😂😂
Pak, kalo untuk pembahasan Css Modular apakah sudah ada pembahasannya di channel WPU?
Pa sandhi ada lanjutannya ga ya yg undangan pernikahan itu😊
Terimakasih pak sandhika 😢😢, materinya mudah di pahami 🙏🙏🙏
dari smk saya nunggu materi dan pembelajaran typescript dari pak sandhika, semoga aja dibuatkan hehe
Pak guru boleh request buat. Web aplikasi warehouse. Complete with database.
Admin hanya bisa buka menu admin. Bisa akses all
User buka menu user hanya liat2.
Dulu ini jadi bahan skripsi saya hanya saja kurang menarik waktu itu tapi berfungsi. Siapa tau pak guru bisa bikin yang bagus sekalian belajar lagi..
Terimakasih
Mantap Content nya pak
Tapi kita bisa ber improvement dengan menggunakan localStorage
Kalau pakai label di React, pakai attribut htmlFor daripada for. Fungsinya untuk menyandingkan label dengan idnya input.
lanjut terus pak materi react nya buat belajar. bikin seperti playlist laravel bikin crud nya mvc nya pak sampai backend nya pak. login auth nya juga hehe butuh refresni react 2023 pak. tutorial yt lain pada udah 1-2 tahun yang lalu kebanyakan. yang terbaru paling bahasa inggris tutornya, susah memahaminya juga apa lagi yang terbaru tercampur dengan typescript, belom lagi yang tutorial inggris india hadeh . kadang bikin pusing liat tutoral yt lain pak. Terimakasih sekian komentar saya .semangat pak Dika bikin konten nya!
pak bikin tutorial veu js dong
Lanjut lagi dong pak seri reactnya hehe
Izin bertanya, ini pak Dhika masih make css vanilla ya? kalau nyambungin ke tailwind bagaimana ya?trmksh