Это видео недоступно.
Сожалеем об этом.
REACT JS Web Pencari FILM Pake API Gratis - Dari 0
HTML-код
- Опубликовано: 16 ноя 2022
- 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 🔺🔺🔺
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
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
terima kasih atas ilmunya dan sukses selalu mas dea, jika boleh request tolong buatin tutorial react js login menggunakan jwt yang dapat refresh token 🙏...
Semangat berkarya untuk Indonesia 🔥🔥
Makasih bang ilmunya. Abis makan siang langsung gaskeun
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
ini yg gua tunggu2 tutor react js kwkw
gas , nambah portfolio baru , makasih bang
Hadir nyimak belajar pak DOSEN🙏🙏
Kak buat tutorial bikin view kayak method MVC di react js dong 🙏
mantab bang
kebetulan saya lagi belajar ambil data gitu
cuma kalo saya masih pakai fetch() blom pakai axios wkwkkwkw
Keren bang, langsung praktek
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
Bang Bikin Porto Polio Undangan Pernikahan Dari 0 sampai Selesai tuntas dan Mengirimkan Undangannya
Goks bang
Kalau mau nambahin fiture search tinggal ngasih useRef kan ya?
32:59
Coba buat input id ml bang buat ngecek nickname kaya di web² top up gitu kalo di input id-nya nnti kluar nickname nya
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
nah bener ni, butuh stack yg dipake apa aja
gue belom bisa api bang, gue masih stuck di api nya , itu kita buat dulu ya... nah dikolom url itu kita kasih url apa?
keren abis .... 👍
bang cara ambil gambar kek thumbnil2 filim yg bebas copyright buat dihosting jg itu dimana ya bang
mantap 👌👌
kang dea punya gout pas tes sesi ngonsume api di console nya keluar error Access XMLHttpRequest at bla bla blocked by cors
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
Bang tutorial buat web Marketplace pake react js + vs code + remix ide ethereum
bang inikan buatnya masih di lokal ya tapi si create api di apithemoviedb nya minta url link itu diisi apa ya?
Bang itu cara buat className dengan cara .classname itu gimana ya nyettingnya?
horeeeee 🙌🙌🙌
kang bahas hls player atau videojs di react tks
tutor nya 39 menit error nya 3 jam WKWKKW
ty A dah works
bang kalo reactjs pake jquery panggil API nya bisa ga?
kalo data table react pake apa bang ?
Hadir kang
bang hosting nya pake apa project reactnya
Mantep Bang Dea Thanks Ilmunya Bang
masamaa ted 🤲🏻
mantap banget bang, next tutorial fullstack react laravel yang dipisah dong heheheheheh
sudah ada bro di cek aja yaa, namanya laract
@@deaafrizal mantap banggg
ntabsssss
bang kenapa kalo gua deploy ke github pages kok web nya ga muncul ya?
klo pake laravel 8 masih bisa lanjut ga bang?
kang dea itu buat line kirinya berwarna warni spil pake extension VS Code apa ya?
indent-rainbow
Bang,ini website pencarian film nya,filmnya bisa ditonton juga gak bang?
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🗿
Malah gua pengen gitu bang :), nanti kuliah mau ambil bisnis digital,manajemen tapi belajar nya it✨
gua lebih melenceng jurusan sastra tpi belajar coding hahahaXD
@@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🤣
cara menampilkan film kyak di streaming2 film gitu gmna bang??buat projek sekolah ini hehe
0:19 kaget pas muka mas adam wkwkwk
yahhh salfok lu wkwk
Niceee mang
video nya cmn 40 menit kan yak
nah aku ngikutin tutorial ini selesai 2 jam an
wkwkwkwkw
wkwkwk good luck 🐱🏍
A kenapa pas saya upload ke vercel nge blank ya
Kerenn bangg
keren bang, tinggal di praktekan doang nih
omong-omong cuy university Semester 3 masih bakal lanjut kah bang?
atau naik jadi Semester 4?
lanjut dongs pastinya, menunggu momentum dulu seperti biasa
@@deaafrizal siap bang, ditunggu
Bang dea kalo search nya beda component,cara biar bisa muncul hasil nya di halaman card gimana ?
nah ini, saya taro search di Navbar, tapi ga bisa muncul beda component, upppp
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 ?
iya cona install dotenv nya dlu bray
bang yaallah padahal gua butuh deadline tescoding kemaren tgl 17 :)) lu update nya tgl 18 wkwkwkwk
12:07
bg klo axios error itu gmn
gue stuck di tulisan atas bawahnya masih mepet sama garis
Pulang soljum langsung belajar react
gasssss
A ini bisa dimonetize gak ya?
Next pake api pokemont bang dea
Bang saran bikin consume api pake recoil
bang itu ganti format di mana
Bisa dimasukan iklan ga bang :D ?
di tab network keliatan dong apikey nya
cara daftar di api nya harus ada url website kita,.sedangkankan kita belum punya website itu gmnabng ?
Kak @Dea Afrizal mohon bantuannya kak🙏🏻
bang pakai tema apa? keren warnanya
Den den den den😂
bang, klo buat nambahin next page 1 , 2 , 3 dst gimana bang
bang nama snippetsnya apaan itu?
GG Bang
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?
sudah bang, typo ternyata.. maap
api.jsx:3 Uncaught ReferenceError: process is not defined
at api.jsx:3:16
ada yg bisa bantu kalo gini knpa ya??
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
kang kalau blom ahli html, css, js,, trus lompat ke react bisa gak ??,,
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
Ga bisa lah bang, minimal harus bisa ketiga itu dlu baru lanjut ke react
tanya dong itu pakai extensions apa yah ? otomatis pas ketik .Movie-container enter ?, oh iya extension apa aja sih yg biasa dipakai bang ? #maapnubitol
bukannya itu emmet bawaan react js ya? configure dulu di menu bawah kanan vs code nya
Kalo Misal Belom diatur, Coba Filenya ekstensinya ubah jadi .jsx jangan .js
Bikin authorization bang
mau nanya font di vscodenya apa bang?
jetbrains bro
Bang cara nyari api nya bang
Bang punya gwejh gaada file .env nya ? Tolong bantu siapapun yang ngerti
buat aja manual .env
bang dea koding api punya saya gak bisa ngebaca process.env, emng file api harus 1 folder penempatannya sama .env ya biar kebaca?
sama nih kasusnya, udah solve kah bang ?
Saya udh install dotenv jg ga ada perubahan
@@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
bisa pakai import.meta.env kalo pakai vite
Request Version control lagi bang
dah ada di video sebelum ini, cek aja seputar kolaborasi 👍
react app token nya dapat dr mana bang, kenapa di blur
sign to TMDB with account gmail
kok img nya not found ya ada yang bisa bantu?
sama nih bang
apa emg dari database nya ya?
react-app terlalu gede bang, apa perlu buat create-react-app tiap project baru
tidak perlu bro
Pake vite bang
@@deaafrizal berarti tinggal pindahin folder src aja ya
@@rohanarohana4474 ohh, oke oke. nanti gw coba
Gambarnya ga mau muncul knpa ya,.urlnya udh sama padahal
gua juga sama bang
apa yg salah ya
Rate limit maksudnya gimana a?
kamu nanya? kamu bertanya-tanya?
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
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 :)
betul atau pake react query udh ada nanggulangin cache pada query
itu cara sign up di ovie databasenya suruh pake url,kita kan blmm ada url jadi gimmana ya ?
@@chloroside9433 pake url local aja, cuma syarat doank
Udah semi2 Jaksel ya skarang
bang di menit 7:38 itu ganti ke react pake apa bang?
solved thanks
caranya itu gimana ya bang?
@@IzzanAbdul coba cek status bar di bagian bawah VSCode. Di sebelah kanan status bar
@@IzzanAbdul ctrl + shift + p trus ketik change language mode trus cari react, atau bisa pakai shortcut ctrl + k m
Penjelasannya terlalu cepat.
wkwkkwk DEA MOVIE MANIA 🤣
ududnya sangat peperepetan abang yg satu ini
makin pusing makin udud pak 😂
klo pake laravel 8 masih bisa lanjut ga bang?
28:10