Timestamp buat ngulang belajar: 6:08 Instalasi NextJS 10:22 Fungsi dari next.config.js 10:43 Fungsi dari tailwind config 17:34 Konsep routing dasar antar page 36:48 Fix Image bawaan NextJS 41:00 Persiapan env project 42:30 Mulai fetching data API 51:41 Penjelasan ulang alur fetching data + card dari awal 1:05:34 Buat navbar component
asik banget asli ngikutin pemelajaran bang dea,kek yang awalnya gw takut + parnoan make terminal sekarang jadi seneng make terminal ,yang awalnya ngeliat data json ini kok apaan banyak bat data buat apa eh skrng jadi lebih bisa memahami. FULL THANKS KANG👍👍👍👍
sedang ngikutin make react js hihi, sebisa mungkin masih di menit menit install, semoga lancar dan selesai sampai ahir, fetch nya mau make axios 😁, dan ada router router dom di video mang dea pas intallasi jadi instal react router dom juga, mencoba coba dulu 😉
bang biar ngoding sintak html di next nya enak pake apa ya? misal gw ketik h1 tp yg muncul h1 berupa text bukan sintak langsung auto complete jadi . apakah harus pake extension lagi?
bang mau nanya, di vscode saya gak ada autocomple buat Image sama Link, terus gak ada auto importnya juga, caranya seperti 36:02 itu gmana caranya ya, terima kasih 👍
bg kok, alias gua pas di sesi 4 ke atas, nggk bisa ya di pake, jdi can't reolve "@/app/globals.css" kek bgtu, knpa ya, pdhal sebelum" nya bisa, jdi gua harus ganti dah jdi "/src"
kalau misalnya mau manggil dari components tuh gabisa. gaada pesan error cuma ga nampil tulisan yang udah di import dari folder components itu kenapa ya?
bang kenapa saya install npx nya muncul seperti ini : node : The term 'node' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. At line:1 char:1 + node -v + ~~~~ + CategoryInfo : ObjectNotFound: (node:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException
@deaafrizal Om maap ni oot ,, kalo mau bikin databasenya gimana om misal 1 judul ada beberapa episode saya pusing dri kemarin mikirnya,, maklum om masih belajar.. :D
Bang mau tanya dong. Saya stuck dimenit 49:52. Padahal udah ngikutin dan bener bener sama, tapi pas bagian gambar malah munculnya gambar pecah😂. Udah coba ganti yg webp jadi jpg tetep muncul gambar pecah. Ini teh sebenernya jaringan saya yg jelek atau gimana yaa? Mohon info infonya suhu
@@deaafrizal udah kucoba cara itu juga bang, tp masih tetep.. apa karena aku pake .(titik )ya bang waktu importnya beda titik ama @ apa ya bang sama aja ato beda..
bang saya nemu 1 eror nih cara ngatasinnya gmana yaa? warning erornya: Image is missing required "src" property: di bagian inspec element trus di consolenya mohon bantuannya mungkin saya ada ke skip tadi soalnya di video tidak ada eror seperti saya🙏🙏
bang, kok gue error di npx create-next-app@latest ya? malah muncul: npm error code ENOENT npm error syscall lstat npm error path C:\Users\A S U S\AppData\Roaming pm npm error errno -4058 npm error enoent ENOENT: no such file or directory, lstat 'C:\Users\A S U S\AppData\Roaming pm' npm error enoent This is related to npm not being able to find a file. npm error enoent npm error A complete log of this run can be found in: C:\Users\A S U S\AppData\Local pm-cache\_logs\2024-10-21T11_48_07_402Z-debug-0.log mohon arahannya, bang.
Bisa dibikin folder khusus buat nampung file video ato gambar di server nya Ato yg agak mahal tp gampang maintenance, pake s3 storage ato server storage semacamnya , jadi file yg diupload ditaroh server khusus di luar server kita pakai untuk frontend/backend
@@deaafrizal emang kalau pake vscode ga perlu setup lagi bang? Kalau kaya gitu baiklah akan beralih ke vscode, bang minta saran juga extension apa yang baik nya yang harus ada di vscode. Sebelumnya terimakasih babangkuh
@@BACK-TO-BACK-YTngejalanin javascript mah ygnative cuma butuh browser dan jalanin lewat console devtools nya Kecuali situ pengen ngejalanin js sebagai server ya butuh macam nodejs
bang dea aku sedang belajar git,coba clone,saat di jalanin programnya ada error Error: Failed to parse URL from undefined/top/anime?limit=8,itu kenapa ya?
@@deaafrizal udah sama persis bg dari mulai bikin file .env sama sesuai isinya (NEXT_PUBLIC_API_BASE_URL ke url api jikan ) terus bikin const response = await fetch sesuai sama di video tapi masih undefined bg gimana ya
Timestamp buat ngulang belajar:
6:08 Instalasi NextJS
10:22 Fungsi dari next.config.js
10:43 Fungsi dari tailwind config
17:34 Konsep routing dasar antar page
36:48 Fix Image bawaan NextJS
41:00 Persiapan env project
42:30 Mulai fetching data API
51:41 Penjelasan ulang alur fetching data + card dari awal
1:05:34 Buat navbar component
best~! thankssss
@@deaafrizalBg kok gua error di webg.image_url itu apa ya penyebab nya?
@@deaafrizal bang, kok di saya ga muncul teks nama anime nya ya? terus g ada animasi saat cursor nya ke bagian gambar anime nya
bang kenapa punya ku bg-indigonya gak kebaca
asik banget asli ngikutin pemelajaran bang dea,kek yang awalnya gw takut + parnoan make terminal sekarang jadi seneng make terminal ,yang awalnya ngeliat data json ini kok apaan banyak bat data buat apa eh skrng jadi lebih bisa memahami.
FULL THANKS KANG👍👍👍👍
Trimakasih kak kontennya sangat bermanfaat🥰, aku jadi semangat belajar lagi❤🔥
mantap bgt bang..klo penjelasan disertai dikasih gamba r gitu auto masuk ke otak 99.9% ..sangat dimengerti
thanks for the content bang de, lagi ada project di kantor pake next JS ini. very usefull, godbless
the best brooo, semoga berkah dah ilmunya
bkin project" gini tuh bkin interesting orng" yg lagi belajar js atau next js, apalgi developer lain😁
gaskeun braderrr
alhamdulilah ada yang memberikan tutorial biar bisa ngoding, makasih bang :)
Akhirnya terimakasih bang Dea Afrizal video nya semoga subscribe nya naik 30 JT
Amin
Terima masih banyak atas ilmunya bang dhea
Mantap bang projek menarik gw suka
gassss
makasih bang udah share ilmu nya
masamaa breee
mantap kang
Bang lu cocok jadi guru dah enak banget belajar sama lu masuk mulu gw kalo ke chanel lu
Bang buat yang Eroor Unhandled : Images must be slash (/) on {images} menit ke 50:24 cara ngatasinya gimana?
keren nih pas banget belajar next js
gasss
sumpah ini yang gue tunggu2
ciyee lanjut nih.....👍👍
makasih bang
Akhirnya lanjut lagi cuyuniversenya😄
yoayyyyy
mantabs semoga bisa mengikuti sampai selesai project, terimakasih bang dea
karena beda versi next js sama Mang dea, ada beberapa yang beda, tapi aman ngikutin pembelajaran
makasih dosen online kuhhh
Belajar dari nol selalu ngikutin bang Dea dan nungguin bang Dea upload semoga bisa jadi programmer 😅😅
Maaksih Mas dea,, ilmu nya
Gasss langsung smt 4 aja dah hahaha
sedang ngikutin make react js hihi, sebisa mungkin masih di menit menit install, semoga lancar dan selesai sampai ahir, fetch nya mau make axios 😁, dan ada router router dom di video mang dea pas intallasi jadi instal react router dom juga, mencoba coba dulu 😉
Aku senang next.js 😋
🔥
Pake express juga bisa kek nya deh bang dea ... totorial dong pake jade/pug dan express js pake render gitu kan .. atau beda next js sama express ...
Mantapp bang rizal
kapan live lagi kang khusus ngobar next react
Hadir pak
gassss
ntab lanjut bang sesi 2 nya, gabakal nanya gambar kok penyok nih hehe
good brarti ngikut, best 👍🏻😉
hadir pak dosen!🖐🏻
gaskeun bray
selama bang dea belum upload semester 4 aku mengembara ke bang teo, pak dhika.... akhirnya aku kembali ke rumah
gassssss
Bang ko gw pas import animelist terus gw ketikin di dalem divnya ga muncul isian animelistnya? Padahal ga ada typo sama sekali
kalau gak ada yg tipo mungkin ada yg kurang bro
Oalah, oke banh tq
No Dea no party 🤟
ditunggu sesi 2 nya bang
Bang bikin video yg ngejelasin tentang three js🙏
bang biar ngoding sintak html di next nya enak pake apa ya? misal gw ketik h1 tp yg muncul h1 berupa text bukan sintak langsung auto complete jadi . apakah harus pake extension lagi?
punten kang, API khusus donghua yg gratisan / mirip jikan API aya teu kang? nuhun!
9:37
bang mau nanya, di vscode saya gak ada autocomple buat Image sama Link, terus gak ada auto importnya juga, caranya seperti 36:02 itu gmana caranya ya, terima kasih 👍
install ekstension auto complete tag
Bang di menit 50:25 punya saya masih eror "must he slash(/) on {images} itu gimana?
dia punya tutupan bgitu
bg kok, alias gua pas di sesi 4 ke atas, nggk bisa ya di pake, jdi can't reolve "@/app/globals.css" kek bgtu, knpa ya, pdhal sebelum" nya bisa, jdi gua harus ganti dah jdi "/src"
Kak minta tutorial buat website top up dari awal 🙏 terimakasih ya ilmunya
kalau misalnya mau manggil dari components tuh gabisa. gaada pesan error cuma ga nampil tulisan yang udah di import dari folder components itu kenapa ya?
bang gw kok error terus ya selalu ada tulisan "error unsupported server component type" di terminalnya
API url nya gak valid gimana dah dri jam 19.00-01.26 belum fix mo nangis😢
pake extensions apa biar gampang nulis codingan nya? jadi bingung karena tiba2 bisa muncul
bang kok punya gwe error mulu ya pas mau instalasi
akhirnya weebs, emang programmer yang terkuat dimuka bumi
Mael Le Preman terkuat di bumi
Cellos Botak terkuat di bumi
Dea afrizal programmer terkuat di bumi
😂😂😂😂
Hadir
heloooo
Di hp cuma sanggup di nodejs ver. 12.x.x gimana caranya biar ngikutin yak
pusing itu hanya awalnya, selanjutnya...
Izin bertanya sepuh saya baru mau belajar² coding ni jadi kek download terminal nya gitu kek mana ya?
asekkkkkk
Bang muncul eror kaya gini gimana ya?
Unhandled Runtime Error: Failed to parse URL from undefined/top/anime
sama, udah ketemu errornya dimana bre
Udh ketemu eror nya?
Belum bang
Sama dah nyera gw 3 hari kagak ketemu
owkwkw sama cuyy , ada yg udah fix kah?
bang Error: fetch failed kenapa yah?
bang kenapa saya install npx nya muncul seperti ini :
node : The term 'node' is not recognized as the name of a cmdlet, function, script file, or operable program. Check
the spelling of the name, or if a path was included, verify that the path is correct and try again.
At line:1 char:1
+ node -v
+ ~~~~
+ CategoryInfo : ObjectNotFound: (node:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
belum masuk system path nya mungkin
bg dea kalo autoprefixer gak ada pas install aman ga ya
@deaafrizal Om maap ni oot ,, kalo mau bikin databasenya gimana om misal 1 judul ada beberapa episode saya pusing dri kemarin mikirnya,, maklum om masih belajar.. :D
harus punya table master untuk episode, jadi nanti tinggal kawinin aja.
Bang mau tanya dong. Saya stuck dimenit 49:52. Padahal udah ngikutin dan bener bener sama, tapi pas bagian gambar malah munculnya gambar pecah😂. Udah coba ganti yg webp jadi jpg tetep muncul gambar pecah. Ini teh sebenernya jaringan saya yg jelek atau gimana yaa? Mohon info infonya suhu
coba cek sample code nya di deskripsi bro
Udah aman bang. Tengkyu bang🙏
#ask gw pas install gk ada auotprefixer itu knp ye ?
bang bikin project baru lagi pake html css, (atau framework css) dan js sebagai pelengkap nya,
bang sesi" selanjutnya khusus backend aja dong hehe
nanti bakal masuk juga kok bre
mau nanya dong puh..di menit 49:39 itu kiat kan make title,images dari page.js..kok gk perlu import dlu ya ?
kan datanya jadi params / properti yang dilempar dari page bro
maksud tanda {} itu apa ya mas?..seperti {title,images}@@deaafrizal
pas ketik di cmd kok ada text npx is not recognized itu kenapa bang?
tlongin bang kok componentsnya ga bisa dipindahkan ke src ya 1:32:36
mau nanya bang gua nggabisa ngejalanim npm run dev itu kenapa yaa?
Punya gw kok gambar nya ga tampil ya , code nya ga error tapi img ny kaya lag gitu ga ke render di web nya
Bang cara kerja iklan di website itu gmn?
nanti coba kita pasang wkwkwk 😄
Ditunggu nih bang
@@deaafrizal wkwk makasih bang dari dulu penasaran gw😂
selamat sore bang kenapa setelah pake fetch muncul eror yah
Error: fetch failed
1 | import AnimeList from "./components/AnimeList"
2 | const Home = async () => {
> 3 | const response = await fetch (`${process.env.NEXT_PUBLIC_API_BASE_URL}/top/anime`)
| ^
4 | const anime =await response.json()
5 | console.log(anime)
6 | return (
bang, kenapa setelah di npm run dev, pas awal dibuka backgroundnya ngga muncul item gitu ya, tapi kaya warna gradasi?
itu bawaannya next js bro, bisa cek ke code styling di file bawaannya
bang dea list anime gw gabisa dibuat 8 pdhl dah buat Limit 8nya
mantap bang, btw app tldraw yg buat coret2 tu download darimana bang?
bang ni folder componentsku kok nggak mau dipindah ya bang ketika dipindah nggak kedetect ku balikin ke dalam app baru bisa lagi..
matiin dulu service nya bro, atau close dlu vscode, pindahin manual dari folder di windowsnya
@@deaafrizal udah kucoba cara itu juga bang, tp masih tetep.. apa karena aku pake .(titik )ya bang waktu importnya beda titik ama @ apa ya bang sama aja ato beda..
anjir ngakak pas nulis peler wkwkw asli sih mtode pembelajaran yg kek gini yg d butuhkan
lanjut terus 1 hari upload 1 video bang, wkwkwkkwkkwkw
kalau bisa 3
siap untuk sesi 2 bro?
sama, kenapa gambarnya ga muncuk yak, judulnya padahal ada
ada yang kepikiran bikin web kaya xnx ga bre?.. hehehe
Bg buat konten hacking yg baik dan berguna misal nya melalu termux..
bang izin bang, images nya ga muncul, kenapa ya ini?
Ada error dibagian image bang
"image is missing required "src" property:" cara benerinnya gmn
bang saya nemu 1 eror nih cara ngatasinnya gmana yaa? warning erornya: Image is missing required "src" property:
di bagian inspec element trus di consolenya mohon bantuannya mungkin saya ada ke skip tadi soalnya di video tidak ada eror seperti saya🙏🙏
bang mau nanya klo sourcenya dari google drive gmn caranyta bang,,,
bang, kok gue error di npx create-next-app@latest ya? malah muncul:
npm error code ENOENT
npm error syscall lstat
npm error path C:\Users\A S U S\AppData\Roaming
pm
npm error errno -4058
npm error enoent ENOENT: no such file or directory, lstat 'C:\Users\A S U S\AppData\Roaming
pm'
npm error enoent This is related to npm not being able to find a file.
npm error enoent
npm error A complete log of this run can be found in: C:\Users\A S U S\AppData\Local
pm-cache\_logs\2024-10-21T11_48_07_402Z-debug-0.log
mohon arahannya, bang.
sekali kali bkin saingbara bkin apps frontend ,, walaupun hadiahnya kecil gpp ,,biar kta juga ke up juga sbgain developer kecil
Bg klo bikin web forum" yg bisa upload gambar ama video gmn?
Bisa dibikin folder khusus buat nampung file video ato gambar di server nya
Ato yg agak mahal tp gampang maintenance, pake s3 storage ato server storage semacamnya , jadi file yg diupload ditaroh server khusus di luar server kita pakai untuk frontend/backend
correct
Bang kok engga ada localhostnya
Bang Rizal tlong buatin konten tentang flutter dong
Page not found dimenit 20 pak padahal ngikutin tutorialnya bener? Itu bagian apanya ya yg salah?
bang gimana caranya masukin next js ke pgsql vercel
Soalnya saya ngikutin di dokumentasi ngga terhubbung terus?
emang agak ribet bro, ntr moga bisa gue buatin tutornya. tp gatau kapan
Okay Bang di tnggu tutorialnya
Bang, cara menjalankan JavaScript di sublime text gimana ya bingung saya awam banget soalnya, bikin tutorialnya dong bang,
paksain pake vscode bro enak loh 😀
@@deaafrizal emang kalau pake vscode ga perlu setup lagi bang? Kalau kaya gitu baiklah akan beralih ke vscode, bang minta saran juga extension apa yang baik nya yang harus ada di vscode. Sebelumnya terimakasih babangkuh
@@deaafrizal bang ko vs kode saya gabisa download extension ya, gimana bang caranya
@@BACK-TO-BACK-YTngejalanin javascript mah ygnative cuma butuh browser dan jalanin lewat console devtools nya
Kecuali situ pengen ngejalanin js sebagai server ya butuh macam nodejs
coba cari2 dlu aja bang di google
@@BACK-TO-BACK-YT
Halo bang
huyyyy
Tetep ikut walau ngoding di hp😅
kang dhea suka warna janda euy bg-indigo wkwkwk
nanya bang, link dc kok udah gak pernah di taruh deskripsi lagi? akunku dc ilang ini mau join lagi gak tau linknya, apakah udah dibubarin tuh server?
Masih kok, coba deh search cuy universe
masih ada cuma gue gak aktif dc bro.
bang dea aku sedang belajar git,coba clone,saat di jalanin programnya ada error Error: Failed to parse URL from undefined/top/anime?limit=8,itu kenapa ya?
bang itu untuk gambar sketsa gitu pake apa
code: 'ERR_INVALID_URL',
input: 'undefined/top/anime'
kenapa ya bg dea, eror di bagian fetch padahal dah persis sama yang di video
cek itu link url api di nya gak kepanggil bro "undefined"
@@deaafrizal udah sama persis bg dari mulai bikin file .env sama sesuai isinya (NEXT_PUBLIC_API_BASE_URL ke url api jikan ) terus bikin const response = await fetch sesuai sama di video tapi masih undefined bg gimana ya
@@nilwanseptianandarf5701 sama gw juga
Tolong dong yang faham , kendala nya sama nih