REACT JS Web Pencari FILM Pake API Gratis - Dari 0
Tutorial react js frontend javascript membuat landing page pencarian website film sederhana, consume api untuk mendapatkan data film atau movies external tanpa menggunakan backend.
Untuk pemula dari 0 sampai jadi 1 projek portofolio tambahan.
2 fitur utama yaitu listing movies & search movies (pencarian list film) dari API gratis.
Hasil jadi website film gratis menggunakan react js:
deamoviemania.vercel.app/
Transfer DONASI: saweria.co/deaafrizal
Join this channel to get access to perks:
/ @deaafrizal
#programming #tutorial #coding
More About Me: linktr.ee/dea.afrizal
☕ Discord ☕
discord.io/cuyuniverse
🚀Tiktok @dea.afrizal / / dea.afrizal 🚀
IG: / dea.afrizal
=================
💌 Email (for business) 💌
dea.afrizal@icloud.com
==================
🔻🔻🔻 SUBSCRIBE 🔻🔻🔻
For More Update
🔺🔺🔺LONCENGNYA 🔺🔺🔺
Пікірлер: 152
setelah 5 bulan belajar mulai html,css,js. masuk belajar react dan sekarang mulai memahami, dan mulai nambah2 project belajar full react , entah kenapa gw masih seneng aja balik lagi ke chanel lu buat mengulang pemahaman lebih dalam, lo emng punya bakat jadi dosen programmer bro, makasih banyak kang
@jericko009
6 ай бұрын
Bener bgt, bahkan penjelasannya lebih asik dan mudah dipahami dari dosen matkul frontend gw wkwk
wih,, banyak" in bang konten kaya gini,, hehe. sambil praktek enak bgt,, apalagi langsung studi kasus kaya film gini,, mantab bener dahh,,,
Mantap bang, banyakin lagi dong tutorial kek gini dengan tema yg lain ✨
Mantap tutorial nya no error, saya kombinasi pake tailwind buat style nya
horeeeee 🙌🙌🙌
Semangat berkarya untuk Indonesia 🔥🔥
ini yg gua tunggu2 tutor react js kwkw
Brader Dea, mau tnya dong , itu di function searchMovies kn udah async dan await axios.... kenapa dipanggi lg di function search yang manggil searchMovies? kyk jadi double gitu.. atau emg ada alasan lain? Dan penggunaan hooks useEffect itu hanya diawal untuk fetch movie ya?? kalau si func search itu emg diluar gpp? Baru belajar nih Dea, gue lg nontonin turtorial2 dr lu haha. Mohon bantuan nya ya . Thank you
Hadir nyimak,hanupis tutor na kang,mantap
terima kasih atas ilmunya dan sukses selalu mas dea, jika boleh request tolong buatin tutorial react js login menggunakan jwt yang dapat refresh token 🙏...
Hadir nyimak belajar pak DOSEN🙏🙏
Makasih bang ilmunya. Abis makan siang langsung gaskeun
gas , nambah portfolio baru , makasih bang
Kak buat tutorial bikin view kayak method MVC di react js dong 🙏
Kalau mau nambahin fiture search tinggal ngasih useRef kan ya?
Keren bang, langsung praktek
Hadir kang
Niceee mang
Goks bang
keren bang, thanks atas tutorialnya
terimakasih baang buat tutorialnya
Bang lalu agar bisa memplay video nya gimana?... tahapan berikutnya apa lagi bang mohon arahan dan bantuan nya bang terimakasih.....
asik bahan belajar lagi nichhhh
mantab bang kebetulan saya lagi belajar ambil data gitu cuma kalo saya masih pakai fetch() blom pakai axios wkwkkwkw
bang cara ambil gambar kek thumbnil2 filim yg bebas copyright buat dihosting jg itu dimana ya bang
bang hosting nya pake apa project reactnya
mantap 👌👌
gue belom bisa api bang, gue masih stuck di api nya , itu kita buat dulu ya... nah dikolom url itu kita kasih url apa?
bang inikan buatnya masih di lokal ya tapi si create api di apithemoviedb nya minta url link itu diisi apa ya?
keren abis .... 👍
Kerenn bangg
Coba buat input id ml bang buat ngecek nickname kaya di web² top up gitu kalo di input id-nya nnti kluar nickname nya
ntabsssss
kalo data table react pake apa bang ?
kang dea punya gout pas tes sesi ngonsume api di console nya keluar error Access XMLHttpRequest at bla bla blocked by cors
Bang itu cara buat className dengan cara .classname itu gimana ya nyettingnya?
klo pake laravel 8 masih bisa lanjut ga bang?
Bang env saya gk bisa terbaca di api.js nya, jdinya di console.log undefined, gimna ya bang cara mengatasinya?
Bang ane make axios Napa uncaught System error : modul on top level yahh bang
kang dea itu buat line kirinya berwarna warni spil pake extension VS Code apa ya?
@officialluckyone
Жыл бұрын
indent-rainbow
bang kalo reactjs pake jquery panggil API nya bisa ga?
Bang Bikin Porto Polio Undangan Pernikahan Dari 0 sampai Selesai tuntas dan Mengirimkan Undangannya
kang bahas hls player atau videojs di react tks
Bang,ini website pencarian film nya,filmnya bisa ditonton juga gak bang?
a, next time kalo bikin tutorial... request tulisin tool apa aja yang di pake dideskripsi dong. ex : react, axios, redux, blaaa... blaa... blaa Thank you
@ghostghost5431
Жыл бұрын
nah bener ni, butuh stack yg dipake apa aja
mantap banget bang, next tutorial fullstack react laravel yang dipisah dong heheheheheh
@deaafrizal
Жыл бұрын
sudah ada bro di cek aja yaa, namanya laract
@fzrahmadan
Жыл бұрын
@@deaafrizal mantap banggg
Mantep Bang Dea Thanks Ilmunya Bang
@deaafrizal
Жыл бұрын
masamaa ted 🤲🏻
tutor nya 39 menit error nya 3 jam WKWKKW ty A dah works
32:59
wkwkkwk DEA MOVIE MANIA 🤣
A ini bisa dimonetize gak ya?
Bang tutorial buat web Marketplace pake react js + vs code + remix ide ethereum
react app token nya dapat dr mana bang, kenapa di blur
bang kenapa kalo gua deploy ke github pages kok web nya ga muncul ya?
Bisa dimasukan iklan ga bang :D ?
Bang dea kalo search nya beda component,cara biar bisa muncul hasil nya di halaman card gimana ?
@ilhamrifai3714
Жыл бұрын
nah ini, saya taro search di Navbar, tapi ga bisa muncul beda component, upppp
A kenapa pas saya upload ke vercel nge blank ya
mantap nih buat di tambahin fitur (Nonton Film) di halaman beranda website pribadi wkwkw, entah knpa tertarik banget sama dunia IT, kuliah jurusan manajemen, tapi tiap malam selalu belajar coding🗿
@zainalmt9404
Жыл бұрын
Malah gua pengen gitu bang :), nanti kuliah mau ambil bisnis digital,manajemen tapi belajar nya it✨
@nicholaslim2814
Жыл бұрын
gua lebih melenceng jurusan sastra tpi belajar coding hahahaXD
@tahirpriyambodo4938
11 ай бұрын
@@zainalmt9404 auto puyeng mas, gua aja it ogah ngoding dan tiap ngerjain project itu karena terpaksa walau pada kelar semua project gua, pengennya kerja ga ada kodingnya🤣
@34zackymausyaha.s82
9 ай бұрын
cara menampilkan film kyak di streaming2 film gitu gmna bang??buat projek sekolah ini hehe
GG Bang
Next pake api pokemont bang dea
bang dhea, di projectnya kok secara bawaan udah ada .env ya ? saya pake vite, pas saya buat sesuai tutorial ini, trs pass di panggil process tidak terdefensi. apa harus pake package dotenv ?
@deaafrizal
5 ай бұрын
iya cona install dotenv nya dlu bray
bang itu ganti format di mana
0:19 kaget pas muka mas adam wkwkwk
@deaafrizal
Жыл бұрын
yahhh salfok lu wkwk
Den den den den😂
bang pakai tema apa? keren warnanya
bang yaallah padahal gua butuh deadline tescoding kemaren tgl 17 :)) lu update nya tgl 18 wkwkwkwk
keren bang, tinggal di praktekan doang nih omong-omong cuy university Semester 3 masih bakal lanjut kah bang? atau naik jadi Semester 4?
@deaafrizal
Жыл бұрын
lanjut dongs pastinya, menunggu momentum dulu seperti biasa
@paisenmtvsky
Жыл бұрын
@@deaafrizal siap bang, ditunggu
bg klo axios error itu gmn
video nya cmn 40 menit kan yak nah aku ngikutin tutorial ini selesai 2 jam an wkwkwkwkw
@deaafrizal
Жыл бұрын
wkwkwk good luck 🐱🏍
Pulang soljum langsung belajar react
@deaafrizal
Жыл бұрын
gasssss
Bang saran bikin consume api pake recoil
tanya dong itu pakai extensions apa yah ? otomatis pas ketik .Movie-container enter ?, oh iya extension apa aja sih yg biasa dipakai bang ? #maapnubitol
@daffastack
Жыл бұрын
bukannya itu emmet bawaan react js ya? configure dulu di menu bawah kanan vs code nya
@solanafox8065
Жыл бұрын
Kalo Misal Belom diatur, Coba Filenya ekstensinya ubah jadi .jsx jangan .js
cara daftar di api nya harus ada url website kita,.sedangkankan kita belum punya website itu gmnabng ?
@renebi234
Жыл бұрын
Kak @Dea Afrizal mohon bantuannya kak🙏🏻
bang, klo buat nambahin next page 1 , 2 , 3 dst gimana bang
mau nanya font di vscodenya apa bang?
@deaafrizal
Жыл бұрын
jetbrains bro
gue stuck di tulisan atas bawahnya masih mepet sama garis
di tab network keliatan dong apikey nya
kang kalau blom ahli html, css, js,, trus lompat ke react bisa gak ??,,
@ghann5070
Жыл бұрын
Lebih baik jangan bang, gw juga nyesel lgsg lompat ke react padahal is dasar belum matang. Dan akhirnya milih balik lgi ke js dasar dan matengin
@parkerAmv
Жыл бұрын
Ga bisa lah bang, minimal harus bisa ketiga itu dlu baru lanjut ke react
bang nama snippetsnya apaan itu?
12:07
cara dapat apikey nya gimana bang
gambar gak muncul bang.... aku coba gak pakai react, cuma pakai html dan gambar lain juga gak muncul... kenapa ya bang?
@vorzagaming3230
Жыл бұрын
sudah bang, typo ternyata.. maap
bang dea koding api punya saya gak bisa ngebaca process.env, emng file api harus 1 folder penempatannya sama .env ya biar kebaca?
@iwansetiawan-hy5xk
11 ай бұрын
sama nih kasusnya, udah solve kah bang ?
@winterchannel333
4 ай бұрын
Saya udh install dotenv jg ga ada perubahan
@yanwardexuze4092
4 ай бұрын
@@winterchannel333 const baseurl = import.meta.env.REACT_APP_BASEURL; const apikey = import.meta.env.REACT_APP_APIKEY; pake cara itu bang klo vite,saya stuck di popularMovies nya undefined
@riohansonmanalu
Ай бұрын
bisa pakai import.meta.env kalo pakai vite
react-app terlalu gede bang, apa perlu buat create-react-app tiap project baru
@deaafrizal
Жыл бұрын
tidak perlu bro
@rohanarohana4474
Жыл бұрын
Pake vite bang
@yogyyconst
Жыл бұрын
@@deaafrizal berarti tinggal pindahin folder src aja ya
@yogyyconst
Жыл бұрын
@@rohanarohana4474 ohh, oke oke. nanti gw coba
api.jsx:3 Uncaught ReferenceError: process is not defined at api.jsx:3:16 ada yg bisa bantu kalo gini knpa ya??
@ikhwanwiratama1228
2 ай бұрын
Diganti dari process.env menjadi import.meta.env, kemudian nama api key yang REACT_APP_APIKEY awalannya harus ditambahkan VITE, menjadi VITE_REACT_APP_APIKEY
Bang punya gwejh gaada file .env nya ? Tolong bantu siapapun yang ngerti
@tahirpriyambodo4938
11 ай бұрын
buat aja manual .env
Request Version control lagi bang
@deaafrizal
Жыл бұрын
dah ada di video sebelum ini, cek aja seputar kolaborasi 👍
Rate limit maksudnya gimana a?
@googlestreetviewofficial
Жыл бұрын
kamu nanya? kamu bertanya-tanya?
@pawronz
Жыл бұрын
request api nya di batesin, misal rate limit 5/req per 1 minute atau buat SaaS yang free tier pasti ada rate limitnya jg. kalau berlebihan ada response error nya.. biasa buat di backend API itu salah satunya juga buat antisipasi bruteforce ,ddos dll, contoh simplenya pake library express rate limiter, untuk backend expressJS
kok img nya not found ya ada yang bisa bantu?
@mhmdriduan.13
Жыл бұрын
sama nih bang
@mhmdriduan.13
Жыл бұрын
apa emg dari database nya ya?
bang di menit 7:38 itu ganti ke react pake apa bang?
@royyandisini
Жыл бұрын
solved thanks
@IzzanAbdul
11 ай бұрын
caranya itu gimana ya bang?
@user-zf1uj9dl1i
5 ай бұрын
@@IzzanAbdul coba cek status bar di bagian bawah VSCode. Di sebelah kanan status bar
@riohansonmanalu
Ай бұрын
@@IzzanAbdul ctrl + shift + p trus ketik change language mode trus cari react, atau bisa pakai shortcut ctrl + k m
Bang mohon coba di kasih cache bang pake Map atau module supaya ketika dia di load gak terus menerus request ke API nya, kan jadi kasihan API nya bang jadi berat :)
@marioanjeliko5010
Жыл бұрын
betul atau pake react query udh ada nanggulangin cache pada query
@chloroside9433
Жыл бұрын
itu cara sign up di ovie databasenya suruh pake url,kita kan blmm ada url jadi gimmana ya ?
@ilhamrifai3714
Жыл бұрын
@@chloroside9433 pake url local aja, cuma syarat doank
Gambarnya ga mau muncul knpa ya,.urlnya udh sama padahal
@mhmdriduan.13
Жыл бұрын
gua juga sama bang
@mhmdriduan.13
Жыл бұрын
apa yg salah ya
Bikin authorization bang
Bang cara nyari api nya bang
Udah semi2 Jaksel ya skarang
Penjelasannya terlalu cepat.
ududnya sangat peperepetan abang yg satu ini
@deaafrizal
Жыл бұрын
makin pusing makin udud pak 😂
klo pake laravel 8 masih bisa lanjut ga bang?
28:10