ลอง Next.js 14 แบบ Quick overview กัน

[@mos_shr]

ช่องคุณภาพ❤ ผมดูมาเยอะ ให้ช่องนี้ที่1เลย เตรียมข้อมูลดีมาก พูดไม่ยืดเยื้อ มีแฝงอารมณ์ขัน เนื้อหาน่าสนใจ หลายๆคลิปผมดูไปชมไป สุดยอดจริงๆจากใจครับ

[@mikelopster]

ขอบพระคุณที่เข้ามารับชมอย่างยิ่งเช่นกันครับ 😁

[@beetpalm]

[@ภูมินทร์ชาญนรา-ง7ฬ]

เห็นด้วยครับ

[@suwatthamsena6313]

ชอบมากครับ บันเทิงดี ยิ่งดู x1.5-x2 ยิ่งมัน ขอบคุณมากๆ นะครับ

[@mikelopster]

คุณเป็นคนแรกเลยนะ ที่ดูความเร็วใกล้เคียงกับคนตัดต่อ 😆

[@iqcangsama]

ของไทยเราได้แค่1.5x อีกหูนึงฟังคลับเฮ้า แต่ถ้าคลิปฝรั่ง2x ดูเอาhint +คลับเฮ้า

[@Arona-nm8hl]

รอซีรีส์ยาวว❤ //รอบหน้าขอลองเพิ่ม dead air ให้หน่อยได้มั้ยครับ คัทชนแบบปัจจุบันนี้ ผมว่ามันไวไปไปนี๊ดนึงง หรืออยากให้เพิ่มจังหวะเว้นให้คิดตามหรือเขียนตามได้นิดหน่อยอะไรงี้อะครับ แต่ที่เหลือคือ the best!!

[@mikelopster]

ขอบคุณมากนะครับบ เดี๋ยวผมรับไว้พิจารณาน้า 😁

[@Arona-nm8hl]

@@mikelopster ชื่นชมงับ เดี๋ยวต้นเดือนมาซับรายเดือนให้เพิ่มครับ

[@mikelopster]

@@Arona-nm8hl ขอบคุณที่สนับสนุนกันมากๆเลยนะครับ 🙏

[@iheavymod592]

เป็นช่องที่อธิบายดี ละเอียด และสนุกมากๆครับ ทำอีกเยอะๆนะครับ

[@mfinity168]

ถึงแม้ว่าพูดเร็วไปหน่อย ก็ได้ความรู้เต็มอิ่มจุก ๆ เลยครับ ขอบคุณครับ

[@sikfreeze]

เป็นช่องที่ฟังเพลินมากเลยครับ สอนเข้าใจง่ายได้ใจความดีมากเลยครับ

[@bait0ngxaxaxa]

ทำไมเพิ่งมาเจอช่องนี้ !!!!! กราบงามๆเลยครับ อธิบายมันส์มาก และความรู้เนื้อๆทั้งนั้น ช่องคุณภาพของจริง 👍👍

[@mikelopster]

ขอบคุณที่ชื่นชอบนะครับ

[@tar.sathabhorn]

ขอบคุณครับ ผมเริ่มจาก 0 ดูคลิปนี้วนๆไม่รู้กี่รอบ ตอนนี้ขึ้นโปรเจคได้และขายงานได้ภายใน 2 เดือน ขอบคุณสำหรับความรู้ครับ 🙏

[@mikelopster]

แจ๋ว ได้ยินแบบนี้ชื่นใจครับ 😆

[@tar.sathabhorn]

@@mikelopster 😍😍😍

[@kritsana6170]

เป็นช่องที่ดูเเล้วต้องกดติดตาม คุณภาพมากครับ

[@youngmillionaires4344]

เป็นช่องที่ดีและมีสาระมากครับ อยากให้ทำกลุ่มสำหรับพูดคุยด้วยครับ ขอบคุณครับ..

[@i-styletoonDev]

สรุปเนื้อหาดีมากครับ กระชับ เนื้อเน้นๆ ฟังไม่ง่วงด้วย ดีมากครับ

[@lubpui3]

อธิบายดีมากเข้าใจง่ายจัดๆ อยากเห็นทำเรื่อง DevOps หรือ DevSecOps เลยครับ ปล.แอบชอบความแมวในทุกองประกอบมากน่ารัก~~~~~

[@taladzodchannel9393]

ค้นคว้าข้อมูลมาดีมาก สรุปได้ง่าย ชัดเจน ไม่เยิ่นเย้อ ขอบคุณความรู้ดีๆ

[@chacritpoonpipit]

ขอบคุณครับ พูดเร็ว และ มีประโยชน์มากครับ ไม่ลีลา ติดตามแล้วครับ

[@ChettaponMadwangseang-]

ช่องอะไรคับเนี้ยยยย ดีโคตรรรร แน่น กระชับ ได้ใจความสุด ขอบคุณครับมีประโยชน์มากๆ

[@LikhitYossrimuang]

ผมติดตามทุกคลิปที่ สอนเลย ดีมากๆ เลยครับ ข้อมูลแน่น เนื้อหาโอเคร น่าติดตามครับ

[@KKimSoulz]

ดูจบเเล้วครับรอมานานมากครับ ดูตั้งเเต่คริปแรกๆ ดู vue ยังไม่จบครับ react มา next มาต้องดู next ให้จบเเล้วครับชอบช่องนี้มากๆ ครับ รอดูอยู่ครับบ😅😅😅

[@KKimSoulz]

และที่สำคัญคือชอบปกคริปสุดๆ5555 แมวทุกคริปป

[@mikelopster]

กว่าจะ prompt ได้แต่ละรอบ บางทีก็ไม่ใช่เรื่องง่าย 😂

[@KKimSoulz]

@@mikelopster รอชมทุกคริปครับบบ (รอดูแมว5555)😄😄😄

[@freud4973]

อธิบายละเอียดมากครับ ใช้มา6เดือนพึ่งรู้ว่า layout ใช้ให้ถูกวิธียังไง😂

[@teacherhack6441]

โึครตเด็ด!! จากใจ กระชับได้ใจความ สมอง ทำงานไม่มีพัก 😂!!!

[@mustafaibrahimisb]

ขอบคุณครับ อธิบายกระชับ เข้าใจง่ายมากครับ

[@wichudaboonma8598]

โดนตกเป็นที่เรียบร้อย ขอบคุณที่สรุปออกมาได้เข้าใจง่ายมากๆเลยค่ะ 🎉😂❤

[@vishsiriwatana25]

เนื้อหาดีมากเลยครับ อิ่มๆเลย :)

[@Sound-karaoke]

ขอให้ทำเนื้อหาของ NextJS ออกมาเรื่อยๆ เยอะๆ นะครับ ถือว่าเป็นภาษาที่ดีและน่าจะเป็นที่นิยมอย่างมากแน่นอนครับ

[@Mr.Athiwat]

เยี่ยมจริงๆ เนื้อหาดีมากครับ

[@jojoolo5333]

ขอบคุณครับ รักษาสุขภาพด้วยนะครับ 🥰🥰

[@mikelopster]

ขอบคุณมากนะครับ 😁

[@Right-m4y]

ชอบนะครับ พูดจาฉะฉาน เหมือน เมาท์มทอยในวง สนทนาดี 555

[@MIKKUCN]

ขอบคุณมากกกครับ อาจารย์😮😮😮😮😮😮😮😮

[@karunkalantabutra4398]

เนื้อหาดีมากครับ ขอบคุณสำหรับความรู้

[@CXSORIOUS]

ผมซึ่งกำลังงม อยู่กับตัว Server เพื่อใช้รัน Next.js :)

[@secret1568]

ชอบมากครับ อธิบายได้กระชับและฟังง่ายฟังเพลินดีคับ👍

[@thanadunhianggan-z8g]

อธิบายดีมากๆ สนุกด้วยครับ

[@BAEJITA99]

ขอบคุณมากๆ นะครับผม ติดตามๆ เลยค้าบบ

[@TitiChangpoo]

อยากได้ลงลึกของ nextjs อีกครับ ขอบคุณมากครับบ

[@mikelopster]

อยากได้หัวข้อไหนของ next.js เป็นพิเศษไหมครับ 😁

[@ronnakritcheinvichai9677]

มาเเล้ววว❤

[@outdoornextdoor1756]

ดูมาหลายคนมากๆ แต่คนนี้คือที่สุดจริงๆทั้งน้ำเสียง ท่าทางการอธิบาย เหมือน 9arm เลย แต่ดูเรียบง่ายกว่า

[@mikelopster]

ขอบคุณมากครับ 9arm นี่ช่องโปรดผมเลย 😂

[@BesTZaKunGG]

อธิบายดีงามมากครับ

[@NaTeeMTeeM]

สุดยอดมากครับ เนื้อหาแน่นกระชับ ตอนจบแอบอยากได้ build เป็น docker images ไปใช้งาน ว่าต้อง build แยกไหม client, server ถ้ามีโอกาสได้ขึ้นโปรเจคใหม่ next.js แน่นอนครับ

[@mikelopster]

เดี๋ยวไว้ผมอาจจะหยิบมาเล่าน้า แต่พูดแบบเร็วๆมันคือ image nodejs นั่นแหละ เพียงแต่ - ถ้า ไม่แยก client กับ server = image nodejs อันเดียว ใช้ร่วมกัน (เป็น SSR ร่วมกัน) - ถ้า แยก client กับ server = build เป็น 2 image ส่วนฝั่งของ client ก็อาจจะใช้เพียง nginx ในการ run หน้าเว็บออกมาได้

[@SuwanMoonchomphu]

อยากให้แนะนำเรื่อง Hook, useSWR หน่อยครับ

[@deknoino5]

ชอบมากเลยคับ อธิบายสนุกมาก

[@nawin_po]

โครตดีครับ ทั้งจังหวะการอธิบาย หรือ example เป็น 1 ชั่วโมงที่ลื่นสุดๆ

[@mikelopster]

บอกแล้ว next อ่ะของดี 😁

[@golfsilly]

พัฒนาร่วมกับ Authentication : NextAuth Ui : Shadcn/ui + RadixUi Validation form : react hook form + zod หน่อยครับ

[@Thanadit231]

32:14 กำลังสงสัยว่า Server Component อยู่ฝั่ง server ทำไมถึงใช้ fetch ได้ ทั้งๆที่ fetch เป็นคำสั่งที่ทำงานฝั่ง client

[@mikelopster]

คำสั่ง fetch ใช้ได้ทั้ง Server และ Client น้า เป็นมาตรฐานคำสั่งของ javascript ที่ใช้ได้ทั้ง 2 ฝั่งในการยิง request ออกไปด้านนอกนะครับ

[@naijamesz]

และแล้วก็เข้าร่วมเป็นหนึ่งใน React community ซะแล้ววว

[@mikelopster]

ผมอุทิศหัวใจดวงเดียวให้ React เสมอ 😂

[@gapgamer7397]

สอนดีมากครับ รบกวนสอนการใช้ daisyui หน่อยครับ

[@mikelopster]

daisyui ลองดูพื้นฐานการใช้งานจากคลิปนี้ก่อนได้น้า อันนี้เป็นฉบับ Vue ก็จริง แต่วิธีใช้งานไม่ต่างกันนะครับ 😁 kzbin.info/www/bejne/Z4emaaOpbKp8Z5o

[@KabirSugoi]

ขอคำแนะนำหน่อยครับระหว่างทำnext.js ทั้ง font-back กับการทำ next.js font และ ใช้ nest.jsหรืออื่นๆเป็น back แบบไหนดีกว่า และมันเหมาะกับงานแบบไหนของการทำแต่ละแบบ

[@praponchinchan448]

buy you a coffee

[@mikelopster]

ขอบพระคุณสำหรับการสนับสนุนครั้งนี้มากนะครับ 😁

[@bunggoonesixeight8920]

พัฒนาร่วมกับใช้ Ant Design หน่อยครับ

[@mikelopster]

น่าสนใจ ผมยังไม่เคยลองนะ เดี๋ยวขอลองไปเล่นก่อนนะครับ 😁

[@kanphatjamkrajang]

พี่ไมค์ๆทำเป็น fullstack ซีรีย์แบบเดียวกับ vue firebase master classหน่อยครับ หลังจบ go ก็ได้นะครับไมติด😂😂เอาจริงๆผมชอบซีรีย์เรียนวันเสาร์พี่มากนะครับทำต่อไปนะครับผมจะได้มีprojectเข้าportfolioเพิ่ม

[@mikelopster]

ok เดี๋ยวพี่ขอหาไอเดียก่อน 😂

[@saysamone6144]

อยากให้พี่ทำคลิปแบบ การเริ่มต้นในการมาสาย dev ของพี่ด้วย อยาดฟังประสบการณ์และแนวทางในการเรียนด้วย❤

[@mikelopster]

มีโอกาสมาเล่าสู่กันฟังแน่นอน 😁

[@gapgamer7397]

อยากให้สอน deploy nextjs บน digital ocean หน่อยครับ

[@Rutthawit]

ขอบคุณครับ ได้ความรู้มากๆ

[@JamesCasterMan]

ภาพปกคลิปแมวสวยจังครับ แบ่งปันหน่อยได้มั้ยครับ จากใจทาสแมวคนหนึ่ง555

[@mikelopster]

แมวทุกตัว เกิดจากการใช้ ChatGPT 4 generate ภาพหมดเลยย 😂 แนะนำถ้าอยากได้ทรงๆนี้ให้เพิ่ม "anime cat" ลงใน prompt ที่สร้างภาพขึ้นมาครับ แล้วใส่รายละเอียดลงไป จะได้ภาพทรงๆนี้ออกมาได้ครับ

[@worish9764]

สอนดีมากเลยครับ แต่พอดีผมเขียนแบบ typescript เหมือนผมจะติดตรงเวลามีการ set cookies แล้วจะมีอาการ input field หน้า login มัน clear เองทั้ง email และ password ครั้งแรกที่ใส่ค่าถูกต้อง และตรง message ก็ได้ state ' ' ผมต้องตรวจสอบตรงไหนเพิ่มเติมหรอครับ ถ้าไม่ set cookies อาการนี้ไม่เกิดขึ้นเลยขึ้น login success

[@mikelopster]

น่าจะเกี่ยวกับ state น้า ลอง recheck code ส่วนของ state ดู ปกติ ไม่ว่าจะเป็น js หรือ ts action การทำงานมันจะเหมือนกันเป๊ะๆเลย แค่ ts มี type มากำกับน้า

[@worish9764]

@@mikelopster โอ้ววขอบคุณครับเดะผมจะลองไปเช็คดู

[@jamer2425]

คุณภาพมากครับ

[@visaumnadkiatgul7841]

ไม่ทำให้ผิดหวังจริงๆค้าบ

[@NattapongPUN]

อิอิ รอมานานแว้ววว

[@anuwatpongtee1205]

กระจ่างมาก ขอบคุณครับ

[@windowzeromyroom851]

quick จริงๆ

[@ad20112]

เยี่ยมมากคั

[@SarunDaunghirun]

ทำไมในตอนสุดท้ายถึงใช้ form onSubmit แทน action ละครับ หรือว่าจะใช้ server action ก็ได้เหมือนกัน

[@nanazap8348]

ปรับความเร็ว 0.75 คือเหมาะสำหรับมืิอใหม่ที่สุดครับ 55555 สมองรันตามไม่ทัน

[@apisitprompanjai7160]

จริงครับคิดตามเผลอดีเลย์ไป1วิ รู้ตัวอีกที อะไรวะเนี่ย😂

[@whatisthis9041]

ระหว่าง next.js กับ angular อันใหนดีคะ

[@mikelopster]

ดีทั้งคู่น้า ขึ้นอยู่กับเราถนัด แต่ Next.js ก็จะได้เปรียบตรงที่เป็น Fullstack framework ในขณะที่ Angular จะเป็นเพียง Frontend framework ที่จะต้องหาส่วน Backend มาเพิ่มเติมนะครับ

[@SafePawINTimeZ]

ขอ nextjs ที่เป็น best pactice ทีครับ พวกระบบที่ คนส่วนไหญ่จะต้องทำแน่ๆ เช่น CRUD, authenticate

[@mikelopster]

จริงๆ พวกนี้ไม่มี best practice น้า แต่ถ้าเป็นเคสพวกใช้ร่วมกับ authenticate เดี๋ยวอาจจะหยิบมาขยี้เพิ่มเติมนะครับ 😁

[@CrazDevelo]

อธิบายเรื่องยาวๆให้เข้าใจง่ายๆได้ดีมากเลยครับชื่นชม✌

[@เกียรติศักดิ์พาควารี-ห4ท]

อธิบายการทำ microservice ด้วยได้ไหมครับ พร้อมตัวอย่าง 😅

[@mikelopster]

หัวข้อ microservice มีโอกาสได้แวะเวียนมาทำแน่นอนครับ 😁

[@j.boonyarit9843]

สุดยอดครับ

[@jaisuperawesome]

ปกติ next จะ โลหดจาก server ทุก page แล้วส่งไปที่ client หรือว่า จะโหลด เฉพาะ page ที่ request อะครับ ขอบคุณครับ ผมติดตามพี่แทบทุกคลิปเลยครับ

[@mikelopster]

ปกติหลักการของ Next คือ - ถ้า page เป็น Server component = load จาก server ก่อนแล้วไป client - ถ้า page เป็น Client component = เปิด component มาอย่างเดียว (เหมือนเปิด React) ซึ่งปกติ default ของทุกหน้าของ Next เป็น Server component อยู่แล้ว ดังนั้นมันเลยจะโหลดจาก server ก่อนทุก page เสมอนะครับ (ถ้าไม่ได้มีการปรับหน้านั้นเป็น Client component เพื่อใช้ร่วมกับ State นะครับ)

[@theeranansiriphoka8058]

ขอคอนเทนต์ graphql หน่อยครับ

[@cypdev]

อยากจะรู้ว่า use sever มันรัน ffmpeg ได้ไหม

[@mikelopster]

ผมไม่เคยใช้โดยตรงน้า แต่ที่อ่านมา เหมือนจะ support node.js ถ้า support ตัวนั้นได้ ก็สามารถทำงานได้ไม่มีปัญหาอะไรนะครับ

[@thejin8429]

หลังจากขึ้นเรื่องใหม่ใน next ผมก็ตามฟังประมวลผลไม่ทันเลยครับ หลุดเป็นพักๆช่วง ตั้งแต่นาที 35เป็นต้นไปต้องปรับลดความไว้ลงแล้วเข้าใจไว้ขึ้นมากครับ รอบหน้าอยากพูดดึง framwork nest ได้ไหมครับ 5555555 ขอบคุณครับผม

[@mikelopster]

ขอบคุณที่ดูจนจบเช่นกันนะครับ ผมจะขอรับ nest ไว้ในอ้อมอกอ้อมใจนะครับ 😆

[@tkankath]

ของดี ขอบคุณมากครับ

[@rcpworld4013]

ขึ้น error ตรงทำหน้า actiion login ครับ key for the H 256 algorithm must be one of type KeyObject

[@mikelopster]

แชร์จุด code ที่มีปัญหาเพิ่มเติมได้นะครับ

[@yokeTH]

เพิ่งสังเกตว่า เป็น .js ไม่ใช่ .jsx แต่พอเป็น ts มันด่ายับเลย 🥹

[@mikelopster]

ถ้าคิดจะเข้าโลก ts ละก็ คุณต้องเตรียมเจอกับสงครามนะ 😆

[@Erdnalf]

Next เดี๋ยวนี้ Powerful กว่าสมัยตอนเล่นเมื่อก่อนเยอะเลยแฮะ 0w0! (สมัยก่อนที่ว่า....น่าจะก่อนโควิดสักปีสองปีนี่แหละมั้ง ?)

[@mikelopster]

ใช่แล้ว ผมลองตอน Next 12 มา พอมาอัพเดทตัวเองเป็น Next 14 ก็ว้าวหลายอย่างเหมือนกัน รู้สึกอยากลองเอามาพัฒนาจริงเลย 😁

[@icejmmm]

เป็นการสอนที่ใกล้เคียงกับใช้งานจริงที่สุด!!!

[@user-peaencom]

content นี้ทำให้ผมกด join

[@boynakub0027]

สวัสดีครับ คุณไม้

[@ฐิติช่างภู่]

เย้ๆ

[@goo__ood]

ยกให้เป็นเนื้อหาที่โครตรดีสำหรับ Next.js ที่ได้เรียนรู้ในปีนี้เลยครับ

[@copterbuddy]

คอร์สที่ลอยคอ

[@mikelopster]

รอคอย แฮร่!

[@ปฏิภาณก้อนคํา-พ9ท]

👍👍👍👍👍

[@bankthanaphat6240]

สนใจสอน spring boot ต่อไหมครับ 5555

[@mikelopster]

ผมขอเก็บไว้เป็นไอเดียก่อนน้า 😁

[@nanazap8348]

อาจารครับขอ nest angularด้วยครับ

[@mettps1408]

ไม่เข้าใจตรง client component กับ sever component ครับ ผมเข้าใจถูกมั้ยว่า ใน 1 page มีได้หลาย component สมมุติว่า ใน page นั้นมี sever component เป็น parent component แล้วมี client component เป็น child component ใน page นั้นจะเป็น csr หรือ ssr ครับ แล้วถ้ากลับกันถ้า client component เป็น parent component แล้วมี server component เป็น child จะเป็น csr หรือ ssrครับ 😂😂😂งงมาก

[@mikelopster]

ok อธิบายเพิ่มเติม 2 เคสนะครับ 1. ถ้า Server component เป็น parent ของ Client component = เป็นการเรียกใช้ Component แบบ SSR ทั่วไป (จุดเริ่มต้นจะเปิดจาก Server ก่อนถึงจะไปสู่ Browser) โดยจังหวะที่เปิดขึ้นมา Server ก็จะทำการ render component ทั้ง component ตัวเองและ Client component ออกมา และหลังจากนั้น Client component ก็จะไปทำงานต่อเองหลังจาก render มาแล้ว (ให้นึกถึงหน้าเว็บที่มี html, css, javascript แยกเป็นของตัวเอง แล้วเราไปดึงมาใช้ Client component จะเป็นแบบนั้นแหละครับ) 2. ถ้า Client component เป็น parent ของ Server component = ไม่สามารถทำได้ เนื่องจาก Server component มีคำสั่งจัดการจากฝั่งของ Server แต่จุดเริ่มต้นของ Client component คือ Browser (Browser > Server) จึงไม่สามารถทำเคสนี้ได้ เพราะ Browser ไม่สามารถใช้คำสั่งบน Server ได้ ** ยกเว้นแต่ Server Action ที่มีวิธีการใช้ร่วมกันในฝั่ง Client Component นะครับ (แต่กรณี Server Action ให้มองง่ายๆเหมือน Client Component ยิง API ปกติครับ มันเลยจะยังคงเป็น CSR เหมือนเดิมนะครับ)

[@mettps1408]

​@@mikelopster ขอบคุณครับ

[@saysamone6144]

ตอนเปิดคลิปมานึกว่ามือถือจอพัง ตรงขอบจอด้านล่างไมค์อ่ะ😅

[@mikelopster]

ตัดพลาดไปนิสส 😂

[@wk18k]

🥳🥳🥳🥳🥳🥳

[@pok2765]

ผมฟังไม่ค่อยทัน😅

[@mikelopster]

มีประเด็นไหนอยากให้ขยี้เป็นพิเศษไหมครับ 😁

[@ChanchaiChakam]

พาฝึกแก้โค้ด javascript ใน leetcode หน่อยครับ

[@NickDataa]

แนะนำความเร็ว 0.75

[@ลุงปอยเป็ดๆ]

[@jitpinanpaniwan9346]

[@PurrCat101]