React คืออะไร? ไขข้อสงสัยสำหรับมือใหม่ + แนวทางการหัด React ตั้งแต่เริ่มต้น

React เทคโนโลยีหนึ่งที่มาแรงมาก ๆ ในปัจจุบัน ไปงานเกี่ยวกับทำเว็บไซต์งานไหนก็มีคนพูดถึงก็คงหนีไม่พ้น React ครับ ซึ่งกระแสมาแรงมากทั้งในไทยและต่างประเทศ

เมื่อไม่นานมานี้แอดมินได้มีโอกาสทำโปรเจคนึงที่ใช้ React and Redux เลยได้หาเรื่องให้ตัวเองลองศึกษา React ตั้งแต่เริ่มต้น และพบว่าจริง ๆ แล้วคอนเซปต์มันเข้าใจไม่ยาก แต่ด้วยความที่คนส่วนใหญ่ใน Community ชอบคุยกันในการใช้งานระดับสูง ๆ เลยทำให้เราสับสนว่าจะเริ่มต้นจากตรงไหนดีเท่านั้นเองครับ

ในบทความนี้ก็เลยจะมาเล่าให้ฟังแบบเข้าใจง่าย ๆ สไตล์ Designil กันว่า React มันคืออะไรกันแน่ บทความนี้เขียนขึ้นมาเพื่อให้อ่านจบแล้วคนที่เป็นมือใหม่ไม่รู้มาก่อน ก็จะสามารถเข้าใจได้ว่า:

• React คืออะไร
• แนวทางการเรียน React ที่ผมใช้ เรื่องไหนสำคัญ
• React เหมาะกับงานแบบไหน
• React ควรค่าแก่การศึกษามั้ย

ก่อนที่เราจะเข้าเรื่องว่า React คืออะไร เรามาดูกันก่อนว่าการทำเว็บแบบดั้งเดิมที่เราทำ มันเป็นอย่างไร และการทำเว็บแบบใหม่ด้วย React มันต่างจากเดิมอย่างไรครับ

ยุคของการทำเว็บไซต์

การทำเว็บไซต์แบบดั้งเดิม

การทำเว็บไซต์ด้วยเทคนิคเดิม คือ HTML, CSS, JavaScript, PHP (หรือภาษา Backend ภาษาใดภาษาหนึ่ง) ส่วนใหญ่ “การทำงานทั้งหมดจะอยู่ที่ Server” แบบนี้ครับ:

1. User เข้าเว็บไซต์เรา https://www.designil.com ก็จะส่งไปบอก Server
2. Server (PHP) จะประมวลผลผ่านภาษา Backend ว่า User เข้าหน้านี้แล้วต้องให้อะไรบ้าง เช่น ต้องการบทความ 10 บทความล่าสุด
3. Server นำข้อมูลที่เก็บไว้ออกมาจาก Database (เช่น MySQL) แล้ววางลงไปในเทมเพลต HTML ที่เตรียมไว้
4. Server ส่ง HTML กลับไปหา User

ข้อดีของเว็บสมัยดั้งเดิม:

• ตัว Infrastructure ถูกมาก – เดี๋ยวนี้หา Web Hosting ที่รองรับ PHP & MySQL ได้ในราคาไม่กี่ร้อยต่อปี ทำให้เราประหยัดค่าใช้จ่ายที่ต้องชำระทุกเดือน ทุกปีไปได้เยอะ
• มีระบบดี ๆ ให้เลือกใช้งานเยอะ – ตัวอย่างเช่น WordPress ซึ่งเป็นระบบสำหรับสร้างเว็บไซต์ยอดนิยม และ WooCommerce ระบบร้านค้าออนไลน์ที่ทำให้ใครก็สามารถเปิดขายสินค้าบน Internet ได้

ข้อเสียของเว็บสมัยดั้งเดิม:

• Server ทำงานหนัก – เพราะต้องจัดการทั้ง Flow ข้อมูลในระบบด้วย และการนำข้อมูลมาวางใน HTML เพื่อส่งกลับไปหา User ทุกครั้ง ทำให้การส่งข้อมูลแต่ละครั้งยิ่งใหญ่มาก

จึงเป็นที่มาของแนวคิดว่า จะให้ Server ทำงานเบาลง โดยการเก็บหน้าตาเว็บไซต์ไว้ใน JavaScript ที่โหลดบน Web Browser บนเครื่อง User ทั้งหมด แล้วให้ Server ทำหน้าที่ส่งเฉพาะไฟล์ข้อมูลเบา ๆ ให้ JavaScript ไปจัดการแสดงผลแทน นั่นก็คือเว็บไซต์สมัยใหม่ครับ

การทำเว็บไซต์แบบใหม่

ไอเดียนี้เมื่อก่อนเราเรียกว่า AJAX นั่นเอง ก็คือ ใช้ JavaScript ส่ง Request ไปขอข้อมูลจาก Server แล้ว Server ตอบกลับมาเป็นข้อมูลอย่างเดียว เราค่อยใช้ JavaScript เอาข้อมูลมาแสดงอีกที

อย่างไรก็ตาม พอข้อมูลถูกส่งจาก Server มาให้ Web Browser แล้ว ก็เกิดปัญหาว่า “แล้วจะจัดการข้อมูลบน Web Browser อย่างไร” ซึ่งเมื่อก่อนไม่มี Library คอยช่วยเหลือด้านการแสดงผล เลยทำให้โค้ดพันกันมั่วไปหมด (เค้าเรียก Spaghetti Code = โค้ดพันกันเหมือนเส้นสปาเกตตี้นั่นเอง)

JavaScript Framework สมัยใหม่ เช่น React ก็เลยออกมาเพื่อช่วยให้เราจัดการเรื่องการดึงข้อมูล การแสดงผลข้อมูลในเว็บให้ง่ายขึ้นนั่นเองครับ

สรุปคือ การทำงานของเว็บไซต์สมัยใหม่ จะมีการทำงานแบบนี้:

1. User เข้าเว็บไซต์เรา
2. โหลด HTML, CSS, JS ขึ้นมาก่อน แล้ว JavaScript ค่อยขอบทความล่าสุดจาก Server
3. Server ได้รับคำขอ ก็ส่งไปขอข้อมูลจากฐานข้อมูลอีกที
4. Database ส่งข้อมูลกลับมาให้ Server
5. Server ส่งข้อมูลกลับไปให้ Browser ทาง API โดยส่วนใหญ่จะส่งเป็น JSON เพราะ JavaScript สามารถนำไปใช้งานต่อได้ง่าย
6. JavaScript นำข้อมูลที่ได้รับมาจัดการแสดงผลบนหน้าเว็บไซต์

ข้อดีของเว็บสมัยใหม่:

• เว็บโหลดเร็วมาก – เวลา User เข้าเว็บเรา เค้าจะได้ HTML, CSS, JavaScript ไปแสดงผลได้ทันที แล้วก็รอ JavaScript ไปขอข้อมูลก้อนเล็ก ๆ จาก Server มาแสดงผล ก็ได้ออกมาเป็นหน้าเว็บไซต์สมบูรณ์แล้ว
• ภาษาที่ต้องเรียนน้อยลง – ปัจจุบันเราสามารถเขียน JavaScript เป็น Server ได้แล้ว (ใช้ NodeJS) ทำให้เราไม่ต้องเรียนภาษา Backend เช่น PHP, Ruby, Python เลย และในทางกลับกัน ถ้าเราเขียนภาษา Backend ได้อยู่แล้ว เราก็ไม่จำเป็นต้องเรียน NodeJS เช่นกัน
• Library เล็ก ๆ เยอะ – การทำเว็บสมัยใหม่ใช้ Library เล็ก ๆ มาทำงานร่วมกัน ทำให้ถ้าเราไม่ชอบตัวไหนก็เปลี่ยนได้ หรือจะเพิ่มส่วนไหนก็ทำได้สะดวก มีความยืดหยุ่นสูง

ข้อเสียของเว็บสมัยใหม่:

• คนเก่าต้องปรับแนวคิด – คนที่ย้ายมาจากสายดั้งเดิมจะต้องปรับแนวคิด เพราะการทำเว็บแบบใหม่เราไม่ได้เอาทุกอย่างไปเทที่ Server อีกแล้ว แน่นอนว่าต้องมีหลายคนที่มองว่าไม่อยากปรับเพราะชินกับแบบเก่าแล้ว
• Library เล็ก ๆ เยอะ – อันนี้เป็นทั้งข้อดีและข้อเสีย ด้วยความที่มันมี Library หลายตัวทำให้ต้องเป็นคนขยันเรียนรู้สิ่งใหม่ ๆ พอสมควร ซึ่งไม่เหมาะกับทุกคน

สำหรับคนที่สนใจเรื่องการทำงานของเว็บไซต์ในสมัยต่าง ๆ ผมแนะนำวีดิโอ “Evolution of Frontend” ของทีม Gucode ครับ อธิบายได้เข้าใจง่ายมาก

React คืออะไร ?

React คือ JavaScript Library ที่ทีม Facebook เป็นคนพัฒนาขึ้นมา และเปิดให้คนทั่วไปนำมาใช้ฟรี ซึ่งเว็บไซต์ในปัจจุบันของ Facebook.com ก็ใช้ React อยู่เช่นกันครับ

สรุปคือ คอนเซปต์ที่เราต้องรู้เพื่อเขียน React หลัก ๆ มีแค่ 3 Concept เท่านั้นเอง

1. Component – ส่วนต่าง ๆ ในเว็บเราจะมองเป็น Component
2. State – ข้อมูลที่อยู่ใน Component แต่ละชิ้น เราเรียกว่า State
3. Props – ข้อมูลที่ถูกส่งต่อจาก Component ชั้นบนลงไปชั้นล่าง เราเรียกว่า Props (Properties)

สำหรับการเขียน Component นั้น ก็เหมือนกับการเขียน HTML เลยครับ React ใช้สิ่งที่เรียกว่า JSX ในการแสดงผลเว็บไซต์ หน้าตาจะเหมือน HTML มาก แตกต่างตรงเราเขียนเข้าไปในไฟล์ JavaScript แทนไฟล์ HTML ทำให้เราสามารถเล่นอะไรกับมันได้มากกว่า

การแทรก JavaScript เข้าไปใน React ก็สามารถเขียนเหมือน HTML Attribute ได้เลยครับ เช่น:

<button onClick={this.btnClick}>Click Me</button>

ก็จะเป็นการบอกว่าให้รัน function JavaScript ชื่อ btnClick เมื่อ User คลิกปุ่ม ตัวอย่างโค้ดจริงจะเป็นแบบนี้ครับ:

จะเห็นว่าจริง ๆ แล้ว React มีความคล้ายกับ HTML ที่เราเขียนกันปกติอยู่แล้วมากครับ ต่อไปเราจะมาดูข้อดี / ข้อเสียของ React กัน เพื่อประกอบการตัดสินใจว่าควรเรียนมั้ย

ข้อดี และข้อเสีย ของ React

ข้อดีของ React

• เทรนด์เว็บไซต์เริ่มกลายเป็น API – เว็บไซต์ในปัจจุบันมี API กันเยอะมาก (เว็บใหญ่ ๆ เช่น Facebook, Google, Twitter etc. ก็มี API ครบกันหมดแล้ว) เพราะฉะนั้นถ้าวันนี้เรายังทำเว็บที่คุยกับ API ไม่ได้ เราจะเสียเปรียบมากในอนาคตครับ
• Concept เข้าใจง่าย – เรียนรู้ตัว React เองง่ายมาก และเครื่องมือที่ช่วยเรียนรู้เยอะมาก ๆ
• อนาคตไกล – React เกิดมาหลายปีแล้ว และยังคงมีคนให้ความสนใจเยอะ เพราะฉะนั้นเรียนตอนนี้ยังใช้ได้อีกหลายปีแน่นอน
• เครื่องมือทำงานด้วยเยอะ – หลายคนอาจจะกลัวว่าเราต้องศึกษาเครื่องมือเพิ่มเติมมากมายเพื่อใช้ React แบบเต็มที่ แต่จริง ๆ เรียนรู้แค่ React ก็ทำเว็บได้แล้ว
• ทำแอพมือถือได้ด้วย – เครื่องมือหนึ่งที่ทำให้ผมมาสนใจ React คือ React Native ซึ่งเป็นการเขียน JavaScript แล้วนำมาแปลงเป็น App แบบ Native ได้ทั้งบน Android และ iOS เครื่องมือนี้พัฒนาโดยทีม Facebook เองเลย
• คนใช้เยอะ หาโค้ดให้ศึกษาง่าย – มี Best Practice จากเว็บไซต์จริงเยอะแยะมากมายให้ศึกษา เพราะเว็บใหญ่ก็ใช้กันเยอะ ลองดูได้ที่ ลิสต์เว็บที่ใช้ React บางส่วน (ย้ำว่าบางส่วนนะครับ)
• Community แข็งแกร่งมาก – ถ้ามีคำถามไม่ต้องกลัวว่าจะไม่มีคนตอบ เพราะกระแสแรงทั้งในไทย (ReactJS Developers Thailand ซึ่งเป็นทีมงานเดียวกับที่จัดงาน React Bangkok) และต่างประเทศ ล่าสุดผมกดบัตร Meetup React Melbourne ไม่ทัน เพราะประกาศแปปเดียวยอดคนเข้าไป 200+ แล้ว

ข้อเสียของ React

• Documentation ยังไม่ดี – Documentation บนเว็บหลักแอบอ่านยากไปหน่อย แต่เดี๋ยวจะแนะนำเว็บที่อธิบายง่าย ๆ ที่ผมใช้ตอนเรียน React
• ต้องรู้ JavaScript ในระดับหนึ่ง – คนที่มาจากภาษาอื่นเช่น PHP อาจจะต้องมาเรียนรู้ในส่วนนี้ครับ

แนวทางการเริ่มเรียน React แบบศึกษาเอง

ในหัวข้อนี้จะแนะนำแนวทางที่ผมใช้เริ่มเรียน React จากศูนย์เองครับ โดยอาศัยศึกษาจากแหล่งความรู้ฟรีทั้งหมด ใช้เวลาประมาณ 2 สัปดาห์

ขั้นตอนในการเรียนรู้ที่ผมใช้ คือ:

1. อ่านเว็บ Official ก่อน (เช่น เว็บ React) เพื่อให้เราเข้าใจว่ามันประกอบไปด้วยอะไรบ้าง
2. เจอหัวข้อที่ไม่เข้าใจก็จะไปเสิร์จเพิ่ม ใน Medium / Stackoverflow ส่วนใหญ่มีคนเขียนหมดแล้ว
3. ถ้าไม่เจอคำตอบจริง ๆ ค่อยถามเพื่อน ถามในกลุ่ม Facebook
4. พอจบแล้วสรุปเป็นขั้นตอน 1 2 3 4 ให้ตัวเองเข้าใจง่าย ๆ
5. ถ้ามีเวลาก็เขียนบลอคสรุป เพื่อส่งต่อความรู้ให้คนอื่นด้วย และได้ทบทวนความรู้ตัวเองไปด้วย (เหมือนบลอคนี้นี่เอง)

สิ่งที่ควรเรียน ก่อนเรียน React

JavaScript

ลองทำโปรเจคง่าย ๆ ด้วย JavaScript โดยที่ไม่ใช้ jQuery ดูก่อนครับ หลัก ๆ คือ ต้องเข้าใจการสร้างตัวแปร, สร้าง function, รับส่งค่าใน function, การใช้ this

ES6 (ECMAScript 6)

ES6 (หรือบางคนเรียก ES2015) คือ JavaScript เวอร์ชั่นใหม่นี่เอง เวอร์ชั่นเก่าที่เราเขียนเรียกว่า ES5 ในเวอร์ชั่นใหม่ก็จะยังเป็นภาษา JavaScript ที่เราคุ้นเคยเหมือนเดิม เพิ่มเติม คือ มีฟังก์ชั่นใหม่ ๆ และท่าใหม่ ๆ ในการเขียนให้ง่ายขึ้น

• แหล่งเรียน ES6 ที่ผมแนะนำก็คือ Learn ES2015 ในเว็บไซต์ Babel เลยครับ อธิบายเข้าใจง่ายดี แถมเค้ามีหน้า Try it out ให้เราลองเขียน ES6 มันจะแปลงเป็น ES5 ให้เราดูแบบสด ๆ เลย

สิ่งที่ควรเรียน ระหว่างเรียน React

React

ตัว React มันเองเข้าใจไม่ยากครับ แต่กว่าจะเริ่มโปรเจค React ได้นี่ก็เหนื่อยเหมือนกัน เพราะเราต้องไปเซ็ตเครื่องมือที่ชื่อว่า Webpack ผมเคยลองเซ็ตเองแล้วเจอปัญหาเยอะมาก ปัจจุบันผมเลยใช้ชุดโค้ดสำหรับเริ่มต้นโปรเจคที่เซ็ต Webpack มาให้แล้ว และ maintain โดยทีม Facebook ชื่อว่า “create-react-app” ครับ

• เริ่มโปรเจคด้วย create-react-app – ในหน้าเว็บมีอธิบายขั้นตอนครบเหมาะกับมือใหม่มาก นอกจากนั้นเวลาผมเจอปัญหา (เช่น Error ตอน deploy Heroku) หรือมีคำถามอะไร (เช่น อยากใช้ SASS กับ React ทำยังไง) เข้าไปอ่าน User Guide ของเค้ามีคำตอบแทบจะ 100% เลยครับ ประทับใจมาก
• หาข้อมูลเพิ่มง่าย – ด้วยความที่ create-react-app เป็นเครื่องมือที่รองรับโดยทีม Facebook ทำให้เวลาเสิร์จหาอะไรใน Google เจอง่ายมากครับ เพราะคนใช้กันเยอะ
• พื้นฐานของ React – ผมเรียนจากเว็บ React.Express ที่แนะนำไปด้านบนเป็นหลักครับ เป็นเว็บไซต์ที่อธิบายได้ดีมาก ๆ เหมาะกับมือใหม่
• สิ่งที่ควรอ่านจากเว็บ React – อย่างที่แจ้งไปด้านบนว่า Documentation ของเว็บไซต์ React แอบเข้าใจยาก มีบางหน้าที่ผมแนะนำ คือ:
  • Thinking in React หน้านี้อธิบายว่าควรแบ่ง Component, State, Props อย่างไร โดยเฉพาะส่วนที่อธิบายว่าอะไรควรเป็น State หรือ Props อันนี้ดีมาก
  • Component Lifecycle อันนี้ผมมองว่าแทบจะสำคัญที่สุดในการเรียน React ครับ (ตอนผมศึกษา ใช้วิธีให้เพื่อนที่เป็น React ช่วย อธิบายรูป Lifecycle ในบทความนี้ ให้ฟัง พอจบแล้วก็เข้าใจเลย กราบขอบคุณ Max มา ณ ที่นี้ฮะ)

เพิ่มเติมวีดิโอภาษาไทย Let’s start with React the right way ของพี่ปุ๋ย เจ้าของเว็บไซต์ Somkiat.cc ที่ไปพูดในงาน React Bangkok 2.0 มาด้วยครับ ผมคิดว่าอธิบายความรู้ที่มือใหม่ต้องรู้ได้ดีทีเดียว

Webpack

ตัวนี้เป็นเครื่องมือสำหรับช่วยแปลงโค้ด ES6/ES7 เป็น ES5 ถ้าลงใหม่เองต้องเซ็ตค่าตัวนี้ แต่ผมไม่ได้เซ็ตเองเพราะ create-react-app จัดการให้เราแล้วครับ ถ้าอยากอ่านเรื่อง Webpack เพิ่มขึ้น อ่าน บทความจากหนังสือ Pro React ได้เลยครับ (เอาไว้กลับมาศึกษาตอนจำเป็นต้องรู้ก็ได้ครับ)

เรียน React แล้วหางานได้ยากง่ายขนาดไหน

การที่เราจะโดดมาเรียนเครื่องมือทำเว็บใหม่ ๆ ก็ต้องอยากเรียนอะไรที่สามารถใช้ทำงานได้จริงในอนาคตครับ ผมจึงได้ สอบถามในกลุ่ม ReactJS Developer Thailand สรุปมาให้ดังนี้ครับ:

• หาง่ายมากใน Startup – ปัจจุบันคนเป็น React ในไทย หางานได้ง่ายมาก เพราะ Startup ใหม่ ๆ นิยมไปใช้กัน ส่วนใน Development House / Freelance ก็เริ่มมีคนใช้แล้ว ที่สำคัญ คือ ตอนนี้คู่แข่งน้อยกว่าสาย PHP Developers แน่นอน
• ทำเว็บก็ได้ ทำแอพก็ดี – React ไม่ได้จบแค่ทำเว็บ เพราะสามารถเขียน React Native ทำ App Mobile ได้ต่ออีก
• การหางานในบริษัทใหญ่ ๆ – ถ้าเป็นบริษัทใหญ่ ๆ (Corporate) ต้องดูว่าเค้าใช้อะไรเป็นหลักครับ บางที่อาจจะใช้ React หรือใช้ Angular, Vue

สรุปว่า อนาคตการหางานด้วย React สดใสมากครับ ขอขอบคุณท่านต่าง ๆ ในกรุ๊ปที่มาให้ความรู้มา ณ ที่นี้ด้วยครับ

งานแบบไหนที่เราควรใช้ React

ส่วนตัวคิดว่า React เหมาะกับงานที่:

• ข้อมูลมีการเปลี่ยนแปลงบ่อย – เพราะ React จัดการพวกนี้ได้ดีมาก
• ทีมพร้อมในการใช้ React – เพราะมี Learning Curve ในระดับหนึ่ง อย่างน้อยในทีมควรมีความรู้ JavaScript อยู่แล้ว
• ไม่ต้องรองรับ IE8 – เพราะ React เลิกรองรับ IE8 ไปแล้ว
• ต้องการโค้ดที่จัดการได้ง่าย และมีการแชร์ Component กันหลายจุด – เพราะ React แบ่งโค้ดออกเป็นส่วน ๆ ดูเป็นระเบียบมาก
• ต้องการทำ App ในอนาคต – เพราะ React Native ทำให้เราใช้โค้ดจากเว็บ React ได้หลายส่วน ทำเป็น App ได้ง่าย ๆ เลย

ซึ่งถ้าเป็นเว็บไซต์นิ่ง ๆ ใช้ HTML/CSS ไปจะจบงานได้ง่ายกว่าครับ อย่าใช้ React เพราะเห็นว่ามันกำลังมาแรง แต่ใช้เพราะตอบโจทย์งานสำหรับเราดีกว่าครับ

ตอบคำถามสำหรับมือใหม่ React

จากที่วันก่อนได้ถามไปในเพจ Designil ว่า มือใหม่อยากรู้อะไรเกี่ยวกับ React บ้าง ยกคำถามที่ข้างบนยังไม่ได้พูดถึงมาตอบให้ครับผม

เว็บไซต์ที่ทำด้วย React จำเป็นต้องใช้ Web Server พิเศษมั้ย หรือใช้ Web Hosting PHP ธรรมดาได้เลย

ตัว Web Server สามารถใช้อะไรก็ได้ที่เก็บ HTML, CSS, JavaScript ได้ครับ เพราะ React เป็น JavaScript สามารถรันบน Web Browser ของ User ได้อยู่แล้ว

การทำ Server Side Rendering ใน React คืออะไร? มีประโยชน์อย่างไร?

เวลาใช้ React มักจะมีคำถามว่า SEO ของ React ดีมั้ย? ซึ่ง Server Side Rendering ก็คือเครื่องมือที่มาช่วยเรื่อง SEO นั่นเองครับ

สำหรับ React ทั่วไปคือเรนเดอร์บน Client side (Web Browser ของ User) เราใช้ JavaScript ทั้งหมด เวลา Google Bot เข้ามาเก็บข้อมูลมันจะอ่าน JavaScript ไม่ออก ทำให้เห็นหน้าเว็บเราเป็นหน้าเว็บเปล่า ๆ ครับ

การทำ Server Side Rendering เป็นการเอาโค้ด React ไปให้ Server เรนเดอร์หน้าเว็บครั้งแรกมาพร้อมข้อมูล ส่งมาเป็น HTML เลย ทำให้เวลา Google Bot เข้ามาเก็บข้อมูลเว็บเราก็จะเห็นเว็บเราแบบสมบูรณ์

React VS Angular VS VueJS

ทั้ง 3 ตัวนี้เป็น JavaScript Framework ที่กำลังมาแรงครับ ส่วนตัวเคยใช้แค่ Angular 1 กับ Vue 1 เล่าตามประสบการณ์ละกันครับ

• Vue ใช้ง่ายมาก เขียน HTML, CSS, JavaScript ธรรมดาได้เลย ปัจจุบันก็เห็นคนแนะนำ VueJS กับมือใหม่ที่ศึกษา JavaScript Framework อยู่ตลอดครับ
• Angular ใช้ไม่ง่าย แต่เครื่องมือครบในตัวอยู่แล้ว

ถ้าท่านใดมีคำถามอื่น ๆ เพิ่มเติมก็สอบถามได้ใน Comment ด้านล่างเลยครับ :)

สรุป React ควรใช้ หรือไม่ควรใช้

จากที่ได้สัมผัส React มาสักพัก รู้สึกว่าเป็น Library ที่มี Community ที่ดี นำไปใช้ได้หลากหลาย เรียนทีเดียวได้ทั้งเว็บและแอพ แถมหางานได้ไม่ยากเพราะปัจจุบันคนใช้กันเยอะมาก

สรุปว่าเป็น Library ที่ Frontend Developer ทุกคนควรรู้ครับ มีประโยชน์ในหน้าที่การงาน (หรือการเปลี่ยนงาน) แน่นอน ยกเว้นว่าในอนาคตจะมีของใหม่โผล่มาที่ดีกว่ามาก ๆ จนคนย้ายไปใช้กัน

อยากให้ท่านที่ผ่านมารบกวน Feedback บทความในส่วนคอมเม้นท์ให้หน่อยครับ ว่า:

• บทความนี้ช่วยให้ท่านเข้าใจ React เพิ่มขึ้นมั้ย
• มีหัวข้อไหนที่อยากให้พูดถึงเกี่ยวกับ React ในตอนต่อไป

เนื่องจากตอนแรกบทความนี้มายาวมาก ๆ เลยตัดหัวข้อเรื่องเครื่องมือเพิ่มเติมบางส่วนทิ้ง ให้เข้าใจง่ายสำหรับมือใหม่ครับ :)

สำหรับบทความนี้ ขอขอบคุณเพื่อน ๆ พี่ ๆ และสมาชิกกรุ๊ป ReactJS Developer Thailand ที่ช่วยให้ความรู้ตั้งแต่ตอนเริ่มเขียน React ใหม่ ๆ มา ณ ที่นี้ด้วยครับ

บทความที่เกี่ยวข้อง

• React 18 มีอะไรเพิ่มมาใหม่บ้าง ?
• :is(), :where() มาเขียน CSS ให้สั้นลงกันเถอะ
• อนาคต Responsive web design ออกแบบเว็บไซต์ในโลกของ Component
• CSS: 20 Tips & Tricks ที่ คุณอาจไม่เคยรู้มาก่อน