Belajar Next.js 13 dari awal untuk PEMULA dalam 2 Jam
Вставка
- Опубліковано 1 сер 2024
- Belajar Next.js 13 dari awal untuk PEMULA dalam 2 Jam
Belajar Next.js 13 Pages Router, selain belajar NextJS disini juga akan belajar Javascript. Menggunakan global styling hingga menggunakan tailwindcss framework @flowbite .
Belajar Next.js 13 dalam Bahasa indoensia, lengkap, sampai bisa membuat website dan mempublishnya ke internet menggunakan Vercel.
Chapters:
00:00 Intro
00:10 Apa itu web framework?
00:55 Kenapa pilih NextJS?
01:40 NextJS untuk bikin website apa?
02:25 Install Terminal Item2
02:58 Install NodeJS
03:18 Install Web Browser
03:40 Text Editor Fleet
04:35 Install NextJS
06:12 Tour NextJS Folder
08:45 Running Website NextJS di Terminal
11:16 Membuat Page Baru
14:25 Nested Router
17:00 Membuat Layout
25:00 Membuat Layout
26:05 Dynamic Route
39:40 Navigasi dan Membuat Link
48:27 Custom 404 Page
50:50 i18n Membuat Website Multi Bahasa
57:25 SEO menggunakan Next Head Component
01:03:03 SEO Facebook Open Graph dan Twitter Card
01:07:47 Membuat MetaHead Component
01:11:25 Kenapa Butuh SEO yang Baik?
01:12:00 Rendering di NextJS
01:16:20 NextJS Client Side Rendering
01:26:10 NextJS Server Side Rendering
01:35:40 Perbedaan CSR dan SSR
01:45:32 NextJS Environment Variable
01:59:55 Styling di NextJS
02:03:01 Menggunakan TailwindCSS di NextJS
02:06:55 Kenapa Ga suka BootstrapCSS?
02:07:19 Membuat Website E-commerce Menggunakan Flowbite
02:17:00 Membuat Loading Skeleton
02:30:19 Menyimpan Source Code di Github
02:32:08 Deploy Website Ke Vercel
Desk setup:
Deskpad: tokopedia.link/YuORq72t7tb
Keyboard: tokopedia.link/5sADyaoD7Ab
Kaos: tokopedia.link/NJZtfaqD7Ab
Lampu: tokopedia.link/jp9GS8FD7Ab
Yang mau traktir kopi:
saweria.co/rezaola
Source Code:
github.com/caesareza/nextjs-b...
Follow us:
instagram: / rezaola.id
instagram: / caesareza
GitHub: github.com/caesareza/
#tailwindcss #nextjstutorial #nextjs13
Mantap, terima kasih banyak bang ilmunya
izin belajar bang.. makasih ilmunya.. semoga lancar rizkinya
Terimakasih Mas atas tutorialnya, cukup membantu untuk saya yang baru belajar Next.Js
izin subscribe bang, belajar juga makasih banyak
Top markotop suhu tngkiw ilmunya🙏
💖💖
Singkat, padat, jelas. Luar biasa! Thank you, kang!
mantapppp, semoga bermanfaat mas Iqbal
Wah hatur nuhun kang reza, sempet lier kesana kemari, ini yang nyaman penyampaian logic ke saya. semoga berkah kang
💖💖
mantep bang tutor nya pake js, jadi bagus buat pemula bang, terima kasih
bikin tutoriial nextauth bang, nextauth google dan dari API
Mantap banget mas videonya, saran saya sih setiap hari upload video yang beginian ditambah project beh makin cakep aja
kagak bisa lah kak, mau bikin tutor kan harus perencanaan dulu biar video gampang dimengerti, kecuali kalau livestream
tengkyu basicnya mas 🎉
🔥🔥
makasih banyak bang ilmunya. penjelasannya gampang di pahami buat saya yang mau migrasi dari react ke next👍
🔥🔥🔋
mantap
🔥🔥
Saya cuma takut keyboardnya rusak bang, tapi makasih ilmunya sangat mudah ditangkap buat pemula
💖😬
Manfaat banget, thanks bang
🔥🔥🔥
Juara banget
🔥
terimakasih bang sangat membantu
💖💖
Thx bg ilmu nya
🔥🔥
❤
Mantab bang
🔥🔥
keren om
🔥🔥
buat tutor studi kasus dong
Keren bang
❤️❤️
makasih bang, ditunggu tutor yang app dir nya
Siap mas Sandy
kenapa gak Next ts
bikin konten ttg redux dong bang,
karena di industri harus sudah mahir
makasih
Boleh mas, ini kebetulan lagi proses yang Redux, ditunggu ya :D
bang, nanya dong.
Kenapa ya punyaku kalo refresh halaman lama banget? apakah spek laptop atau internet mempengaruhi?
Thanks pak, bahas nuxt juga pak hehe
Vue / Nuxt asik si ya ..
@@andreasadry1635 yes betul mas hee
Boleh boleh. Udah lama.si pakai vue juga
bang thank you tutorialnya, bermanfaat banget buat ane.
btw, sekalian request tutorial buat middleware nya next js bang terutama buat protected route / pages untuk login bang.
sama bedanya SSR sama SSG apa ya bang? use case nya biasanya di fitur apa ya?
thank you bang
SSR bisanya buat page yang mengejar SEO. Kayak detail product detail artikel .
Kalo SSG
Ke arah page yang secara perubahan sangat jarang tapi mau SEO nya bagus.
Sepeti halaman visi misi. About us.
SSG adalah page yang terbentuk saat build time. Klo SSR saat request ke server
@@rezaola mantap, thank you bang. penjelasannya selalu on point dan ga bertele2.
ditunggu video2 selanjutnya bang
bang, bahas requirement minimum untuk masuk dunia industri dong. Apakah data fetching, slicing figma, routing sudah cukup?
Boleh mas nicolas
kalo mau belajar slicing dari figma design nya dapet dari mana ya bang?
bang deploy nya ke cpanel gimana, punya ku ga bisa
bang reza, itu bisa highlight color pake cursor pointer gunain software apa bang?
Namanya screen brush, ada di appstore
btw itu di itermnya gimana biar ketika ngetik ada preview foldernya gitu bang ?, mohon di spill
Ada disini mas ua-cam.com/video/L-aRG_KI040/v-deo.html
emang perlu wsl kah bang buat ngejalanin next js ?
bang, saran kualitas video nya ditingkatin lagi, soalnya saya pake 1080p masih burem videonya
Boleh bang. Nanti saya tingkatkan sampai 2k juga y
bang kenapa ya header ama footer gw ga muncul?
export function nya apakh sudah ada mas ?
numpang nanya bg. kalo untuk mobile development, mending ambil macbook air m2 atau macbook pro m1?
Air M2 midnight asik si. Kemarin malah baru dibahas pada milih air m1
@@rezaola kalo buat xcode panas bgt ga bang? kan fanless tuh air m2
Ini kemarin jawaban dari team mobile saya mas. Mereka pakai xcode dan adroid studio. Cuma kalo mau pakai Fan berarti ambil pro m1 aja
bangg sarann nihh fontnya digedeinn
Siap mas verry
camera nya apa om ?
Sony a7ii mas ...
Kenapa ga pake app dir bang?
app dir di next video mas ..
ditunggu ya ..
nanti kita compare juga pages vs app
@@rezaola oke makasih bang
bang, nanya dong.
Kenapa ya punyaku kalo refresh halaman lama banget? apakah spek laptop atau internet mempengaruhi?