Thanawat Yodnil @littleboycoding
GitHub Facebook
ย้อนกลับ

Next.js คืออะไร ควรใช้มันจริงหรือ ? 🤔

📅 1 เมษายน 2563

หน้าหลักของเว็บไซต์ทางการของ Next.jsหน้าหลักของเว็บไซต์ทางการของ Next.js

ขอเกริ่นก่อนว่าบทความนี้ไม่ได้มาสอนการใช้งาน แต่มาอธิบายว่า Next.js คืออะไร และควรนำไปใช้ในชิ้นงานหรือไม่ 💻

Next.js คืออะไร

ข้อมูลจากเว็บไซต์หลักของ Next.js ได้อธิบายไว้ว่า "Next.js คือ Framework ที่ใช้สำหรับสร้างเว็บ (หรือเว็บแอพ) โดยใช้ขุมพลังของ React ซึ่งช่วยให้กระบวนการสร้างนั้นง่ายขึ้น"

ยังไง ?

Next.js สามารถใช้งานได้ง่าย (แต่ต้องมีความรู้เกี่ยวกับ React ก่อน) สามารถใช้งานได้ทันที Learning curve ค่อนข้างต่ำ ซึ่งความสามารถก็มีคร่าวๆดังนี้

  • มีระบบ Route ให้ในตัว ซึ่งทำงานคล้ายกับ PHP
  • Server-Side Rendering
  • Optimize อัตโนมัติ เว็บไซต์ไวปรี๊ด
  • รองรับ CSS ทั้งแบบ Module หรือ CSS-in-JS
  • สามารถทำ API route ได้ในตัว
  • สร้างสภาพแวดล้อมพร้อมเริ่มลุยกับการสร้างได้ทันที (ไม่ต้องตั้ง Webpack หรืออื่นๆด้วยตัวเอง คล้ายๆ CRA)
  • ถึงแม้จะมีเครื่องมือ Bulit-In ให้เยอะ แต่ยังคงไว้ด้วยความยืดหยุ่น

สำคัญสุดคือการทำให้การสร้างเว็บไซต์ด้วยวิธีการ SSR (Server-Side rendering) นั้นง่ายขึ้นอย่างมาก ซึ่งมันคืออะไรขอแยกไว้เขียนเป็นบทความแยกล่ะกัน เพราะมันค่อนข้างที่จะยาวหน่อย 🤓

Next.js เหมาะกับงานรูปแบบไหน ?

จากเว็บไซต์บอกไว้ว่า

  • Production
  • Server Rendering
  • Desktop
  • Electron
  • PWA
  • Static Website
  • Mobile
  • Lightweight App
  • ???

สรุปคือ สามารถทำได้ทุกอย่างที่ Vanila React จะทำได้ 😆

อ่าวแล้วงี้ก็ไม่ต้องใช้ React แล้วสิ 😕

สิ่งที่ต้องพิจารณาเวลาเราจะใช้ Framework คือกฏข้อบังคับหรือข้อจำกัดในการใช้งาน ซึ่งถึงแม้ Next.js จะโฆษณาว่ามีความยืดหยุ่นสามารถปรับแต่งได้อย่างมาก แต่ Next.js ก็ยังมีข้อบังคับที่ในการใช้งาน เช่นรูปแบบโครงสร้างโปรเจค, ที่อยู่เฉพาะสำหรับไฟล์บางอย่าง, กฏในการใช้ CSS

ซึ่งหากโปรเจคที่ทำอยู่ต้องการ Full Control ก็ควรใช้ React ธรรมดา (เพราะความสามารถพวกนี้สามารถ Implement เองได้อยู่แล้ว)

Documentation ของ Next.jsDocumentation ของ Next.js

Documentation ของ Next.js ค่อนข้างทำออกมาได้ดี เรียนได้ง่าย แถมมีมินิเกมเก็บคะแนนให้ตอบเล่นๆวัดความรู้อีกด้วย ผมได้คะแนน 590 จากการลองเล่นทั้งหมด ใครได้เท่าไหร่มาอวดกันได้นะครับ 😎

และนี่ก็คือบทความแรกของผมกับเว็บบล็อกแห่งนี้ ซึ่งก็ได้สร้างด้วย Next.js นี่ล่ะ การใช้ก็ค่อนข้างที่จะ Smooth ง่าย ทำเรื่องยากส่วนมากให้ง่าย ซึ่งก็ใช้การ Export มาเป็นรูปแบบ Static Website เพื่อความไวและเรียบง่ายในการจัดการข้อมูลภายในบล็อกตัวเอง ยังไงก็ขอฝากบล็อกน้อยๆแห่งนี้ไว้ด้วยนะครับ 💓


แหล่งข้อมูล