Next.js เป็น Framework ของ JavaScript ที่พัฒนาต่อยอดขึ้นมาจาก React.js อีกชั้นหนึ่ง (หรืออาจจะเรียกว่า React Framework ก็ได้ครับ) วัตถุประสงค์หลักของการใช้งาน Next.js ก็คือการเพิ่มฟังก์ชันอย่าง server-side rendering และ static websites/web applications สำหรับการใช้ React ครับ
ปัจจุบัน Next.js ถูกนำไปใช้สร้างเว็บไซต์มากมาย อาทิเช่น Netflix Jobs, Tiktok, Twitch, Hulu, TicketMaster, Tencent และอื่นๆ อีกมากมายเลยครับ ถ้าคุณอยากดูตัวอย่างเว็บไซต์ที่สร้างโดยใช้ Next.js สามารถดูได้ที่นี่
ดังนั้นถ้าคุณเป็น JavaScript Developer และโดยเฉพาะอย่างยิ่ง React Developer แล้ว การมีความรู้ในการใช้งาน Next.js เป็นทางเลือกที่น่าสนใจอย่างมาก เพราะจะช่วยเพิ่มความยืดหยุ่นในการพัฒนา รวมไปถึงศักยภาพเว็บไซต์หรือ web apps ให้ก้าวกระโดดอย่างมีนัยสำคัญครับ
ในโพสนี้ผมจะมาแนะนำคอร์สสอน Next.js ออนไลน์คุณภาพเยี่ยมที่เมื่อเรียนจบแล้ว คุณจะสามารถนำไปพัฒนาโปรเจคของคุณได้อีกมากมายเลยครับ หลังจากเรียนจบ คุณไม่จำเป็นต้องหา Next.js Tutorial อีกต่อไปแล้ว เพราะคุณได้เรียนทุกสิ่งเกี่ยวกับ Next.js ไปจากผู้เชี่ยวชาญแล้วนั่นเอง
ข้อควรทราบ:
- ราคาและเงื่อนไขในแต่ละคอร์สอาจจะเปลี่ยนแปลงไปได้ ก่อนที่จะซื้อผมแนะนำให้ตรวจสอบกับทางเว็บไซต์ผู้ให้บริการอีกครั้งหนึ่งครับ
- ในการเรียน Next.js คุณจะต้องมีความรู้การใช้งาน HTML, CSS, JavaScript (ES6) รวมไปถึง React.js ในระดับหนึ่งก่อนที่จะเรียน แต่ไม่จำเป็นต้องเทพแต่อย่างใดครับ
คอร์สสอนการใช้งาน Next.js บน Udemy
Udemy เป็นหนึ่งในแพลตฟอร์มที่ผมชอบที่สุดในการเรียนออนไลน์ เพราะผมสามารถเรียนได้ทุกที่ทุกแห่งโดยใช้ PC, Smartphone, Smart TV และ Tablet และคุณยังสามารถดาวน์โหลดคอร์สมาเรียนแบบ offline ได้อีกด้วย
นอกจากนี้หลังจากที่คุณซื้อคอร์สไปแล้วการเรียนออนไลน์ใน Udemy ยังเรียนได้ตลอดชีพและไม่มีวันหมดอายุ ผมจึงไม่ต้องรีบเร่งเรียนให้จบภายในเวลาที่กำหนดเหมือนกับบางแพลตฟอร์ม อยากเรียนเมื่อไรค่อยเรียน แบบนั้นเลยครับ
แต่สิ่งที่ผมชอบที่สุดคือ การลดราคาที่มีแทบทุกสัปดาห์ และลดแรงถึง 90% ทำให้แต่ละคอร์สอยู่ในราคาไม่กี่ร้อยบาทเท่านั้นเอง ซึ่งนับว่าถูกสุดๆ ไปเลยครับ ดังนั้นสมมติว่าถ้าคุณเข้าเว็บไซต์ไปแล้วพบว่าคอร์สไม่ได้ลดราคา ผมแนะนำให้นำคอร์สเข้า Wish List แล้วรอ 2-5 วันค่อยกลับเข้าไปดูใหม่ว่ามีโปรโมชั่นหรือยัง หรือว่าจะให้ผมจัดการให้ด้วยการสมัครแจ้งเตือนกับ Victory Tale ด้วยก็ได้ครับ
จำนวนคอร์สสอน Next.js ที่อยู่ใน Udemy ก็มีมากมายด้วยเช่นกัน อย่างไรก็ดีคุณไม่ต้องหัวหมุนว่าจะเลือกเรียนคอร์สไหนดี เพราะผมเลือกมาให้แล้วครับ
1. Complete Next.js with React & Node – Beautiful Portfolio App
คอร์สนี้จะสอนการใช้งาน Next.js ควบคู่กับ React และ Node.js ตัวคอร์สสอนโดย Filip Jerga วิศวกรซอฟต์แวร์ที่มีประสบการณ์พัฒนา web apps โดยใช้ React มานานหลายปีครับ
สำหรับคอร์สนี้จะเป็นแนว project-based คุณจะได้สร้าง Portfolio App อันซับซ้อนที่สามารถใช้งานได้จริง โดยเนื้อหาต่างๆ และทฤษฎีจะถูกบรรยายประกอบกันไป คุณจะได้เรียนจากการลองทำจริง ทักษะของคุณจะถูกพัฒนาอย่างรวดเร็วแต่ยั่งยืนครับ
สิ่งที่คุณจะได้เรียนในคอร์สนี้ได้แก่
- Next.js Basics – คุณจะได้เรียนเนื้อหาส่วนนี้ผ่านการทำโปรเจค คุณจะได้เรียนการสร้าง Layout ของ Web Apps ครูผู้สอนของคุณจะแตก Layout ออกเป็นส่วนๆ เพื่อที่คุณจะได้เข้าใจง่ายที่สุด คุณจะได้สร้าง reusable components มากมายอย่างเช่น Navigation Bar หรือ Portfolio Card ฯลฯ
- เรียนรู้การทำงานของ Server Side Rendering และเทคนิค data fetching ที่แตกต่างกัน
- Authentication โดยใช้ Auth() Provider คุณจะได้เข้าใจวิธีการสร้าง restriction ในแต่ละหน้าของคุณ ฯลฯ
- Portfolio Features – คุณจะได้ลองสร้าง Portfolio, การใส่ข้อมูล, การสร้าง static pages โดยใช้ Next.js
- Blog Features – ในส่วนนี้จะสอนวิธีการสร้าง Blog โดยใช้ Slate Editor ลงใน Web Apps ของคุณ
- จัดการเรื่องของ SEO ในเว็บของคุณโดยใช้ Next.js
- การ Deploy app ของคุณลงใน Heroku และการทำ Optimization
- และอื่นๆ อีกมากมาย
คอร์สนี้สอนการใช้งาน Next.js ทุกอย่างแบบละเอียดมากตั้งแต่ต้นจนจบ โดยมีเนื้อหาแบบวีดิโอทั้งหมดรวมแล้วมากถึง 60 ชั่วโมงด้วยกัน และคุณจะได้สร้าง Web App ที่สมบูรณ์ขึ้นมาเป็นของตนเองตัวหนึ่งเลยครับ ซึ่งจะต่างจากบางคอร์สที่ให้แค่เนื้อหาแบบ lecture เท่านั้น
รวมแล้วคะแนนรีวิวคอร์สนี้ได้ไป 4.5/5.0 จากนักเรียนกว่า 4,700 คน โดยส่วนตัวผมมองว่าเป็นคอร์สสอน Next.js อันดับ 1 ใน Udemy เลยครับ
2. Next.JS with Sanity CMS – Serverless Blog App (w/ Vercel)
คอร์สนี้จะสอนโดย Filip Jerga คนเดิมครับ แต่จะสอน Blog App ที่ผนวกการใช้งาน Sanity.io ซึ่งเป็น CMS แบบ Headless เข้าไปในด้วย ถ้าคุณสงสัยว่า Headless CMS คืออะไร และต่างจาก CMS ทั่วไป (อย่างเช่น WordPress) อย่างไร และทำไม Sanity ถึงเหมาะกับ framework อย่าง Next.js ลองอ่านเพิ่มเติมได้ที่ Headless CMS Explained
อย่างไรก็ดีแนวทางการสอนก็จะเป็นแบบ Project-based เหมือนกับคอร์สแรก นั่นคือคุณจะได้ลงมือทำจริงภายใต้คำแนะนำของผู้สอนในแต่ละขั้นตอน โดยรวมแล้วคุณจะได้เรียนสิ่งต่อไปนี้
- เรียนรู้การใช้งาน Sanity โดยในส่วนนี้คุณจะได้ใช้ฟีเจอร์ของ Next.js อย่างเช่น getStaticPaths ด้วยเช่นกัน
- การ process รูปภาพ และใช้ stylings ใน code blocks
- การใช้ Filtering Options ใน Application View, การทำ pagination และ sorting
- การจัดการ theme ของ application
- ใช้งาน Preview Feature
- Deploy app ของคุณไปยัง Vercel Platform
- และอื่นๆ อีกมากมาย
สำหรับคอร์สนี้ ครูผู้สอนไม่ได้แจ้งว่าคุณจะต้องเรียน Next.js มาก่อน แต่ด้วยความที่คอร์สนี้จะใช้งานฟีเจอร์ใหม่ล่าสุดของ Next.js และไม่ได้อธิบายเนื้อหาเบื้องต้นของ Next.js เหมือนกับคอร์สแรก ผมจึงมองว่าคุณเรียนคอร์สแรกมาก่อนแล้วค่อยมาเรียนคอร์สนี้จะดีกว่าครับ
คอร์สนี้ได้คะแนนรีวิวสูงมากถึง 4.9/5.0 จากนักเรียนเกือบ 400 คนครับ โดยมีเนื้อหาให้เรียนทั้งหมด 12 ชั่วโมงด้วยกัน
3. Modern Server Side Rendering with React and Next.JS
คอร์สนี้จะสอนคุณสร้าง SSR app โดยใช้ React และ Next.js ตัวคอร์สจัดทำโดย Eduardo Silva นักพัฒนาที่มีความเชี่ยวชาญพิเศษในการใช้งาน React.js โดยมีประสบการณ์มาแล้วกว่าสิบปี ซึ่งเขาพร้อมแล้วที่จะถ่ายทอดความรู้ของเขาให้กับคุณครับ
ภายในคอร์สจะสอนสิ่งต่อไปนี้
- SSR App คืออะไร และโครงสร้างของ SSR App โดยรวม
- พื้นฐานของ Next.js และ components ที่ใช้งานบ่อยที่สุด
- การทำ data fetching บนฝั่ง server
- การทำ Navigation สำหรับฝั่ง Client
- ใช้ Styled-jsx ในการ style ตัว component ต่างๆ
- การจัดการ Static Files อย่างเช่น Custom Fonts
- การจัดการ Cookies ใน Next.js
- การสร้าง Custom Server สำหรับ Next.js app
- ใช้ Cookie-Based Approach ในการทำ User Authentication
- Deploy app ไปยัง Zeit
สำหรับเนื้อหาในคอร์สจะยาว 7.5 ชั่วโมง และจะเน้นไปที่การสร้าง SSR app โดยใช้ Next.js ส่วนการสอนจะเป็นแบบ project-based ซึ่งก็คือเรียนรู้ด้วยการลงมือทำจริง อีกสิ่งที่น่าสนใจคือผู้สอนจะให้ความสำคัญกับการจัดการปัญหาต่างๆ ที่เกิดขึ้นมาตามแนวทางของ agile process ครับ
คะแนนรีวิวของคอร์สนี้ได้ไป 4.4/5.0 จากนักเรียนมากกว่า 750 คนครับ
4. Next.js and Apollo – Portfolio App (w/ React, GraphQL, Node)
คอร์สนี้จะสอนคุณสร้าง Web App อย่างสมบูรณ์โดยใช้ Next.js กับ Apollo, React, GraphQL และ Node ซึ่งเป็นวิธีการที่ใช้จริงในหมู่นักพัฒนาทั่วไปในปัจจุบัน ตัวคอร์สจัดทำโดย Filip Jerga คนเดิมครับ
เนื้อหาโดยทั่วไปจะคล้ายกับคอร์สแรก นั่นคือคุณจะเริ่มต้นการสร้าง portfolio app ขึ้นมาจาก scratch แต่จะซับซ้อนกว่าตรงที่จะมีการใช้ฟีเจอร์ของ Apollo และ GraphQL เข้าไปด้วย ยกตัวอย่างเช่น Data fetching และ data mutations เป็นต้น
โดยส่วนตัวว่าคอร์สนี้น่าสนใจมากสำหรับใครที่มีประสบการณ์การใช้งาน Next.js มาระดับหนึ่งแล้วแต่ต้องการหาประสบการณ์เพิ่มเติม เนื้อหาของคอร์สนี้มีมากถึง 28.5 ชั่วโมง ซึ่งถือว่าเต็มเปี่ยมและเพียงพอสำหรับการเรียน Next.js ในระดับสูงขึ้นอย่างแน่นอนครับ
คอร์สนี้ได้คะแนนไป 4.6/5.0 จากนักเรียนเกือบ 700 คนครับ