この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
React คืออะไร
React คือ javaScript library สำหรับใช้ในการสร้าง user interfaces ที่พัฒนาโดย Facebook และ ชุมชนของนักพัฒนาที่เกี่ยวข้อง โดย React library จะนำมาใช้พัฒนาหน้าเว็บไซต์แบบ single-page application ( หน้าเว็บไซต์ที่ได้รับการออกแบบให้ลดการ reload ของหน้าเว็บโดยไม่จำเป็น ) พูดง่ายๆคือ React เป็นเหมือนเครื่องมือไว้สำหรับการสร้างระบบหน้าบ้าน ( front-end ) นั้นเอง
ซึ่งข้อดีหลักๆ ของการใช้ React คือ
☑ ช่วยให้การจัดการ files หรือ components ที่มีใน project ของเราได้ง่ายขึ้น
☑ ช่วยให้เราสามารถตรวจข้อผิดพลาดโปรแกรมได้ง่าย
☑ สามารถแก้ไข css หรือ js และ ตรวจสอบผลลัพธ์ได้ทันทีใน browser
☑ ช่วยให้สามารถ reuse code ได้อย่างมีประสิทธิภาพ
☑ ช่วยให้เราสามารถตรวจข้อผิดพลาดโปรแกรมได้ง่าย
☑ สามารถแก้ไข css หรือ js และ ตรวจสอบผลลัพธ์ได้ทันทีใน browser
☑ ช่วยให้สามารถ reuse code ได้อย่างมีประสิทธิภาพ
วิธีการสร้าง React App
Step 1 : ดาวน์โหลด และ ติดตั้ง node js สำหรับใช้ในสร้าง React project
โดยเข้าไปที่ https://nodejs.org/en/download/
กดดาวน์โหลดโดยเลือกเป็นแบบ LTS ( ในกรอบสีเหลือง )
Step 2 : เมื่อดาวน์โหลดและติดตั้ง node js เสร็จเรียบร้อยเราสามารถตรวจสอบได้โดย
พิมคำสั่ง node -v ใน command prompt
ถ้าติดตั้งสำเร็จจะมีผลลัพธ์ขึ้นแสดง version ของ node js ( ในกรอบสีเหลือง )
Step 3 : ให้เราไปที่ folder ที่เราต้องการสร้าง React App โดย
พิมคำสั่ง cd ‹path folder› ใน command prompt
จากภาพคือจะสร้างไว้ที่ C:\Users\cmth\Documents\react_hook
Step 4 : ให้เราสร้าง React App ใน folder ที่เราอยู่โดย
พิมคำสั่ง npm init react-app . ใน command prompt
รอจนกว่าจะติดตั้งเสร็จ
Step 5 : ให้เราตรวจสอบว่า React App ของเราสามารถรันได้มั้ยโดย
พิมคำสั่ง npm start ใน command prompt
จากนั้นให้ไปที่ url http://localhost:3000 ใน browser ของเรา
ถ้าขึ้นตามภาพก็แสดงว่าการสร้าง React App นั้นเสร็จเรียบร้อยพร้อมเรียนรู้ได้เลย
สรุป
จากการที่ผมได้ลองสร้างโปรเจค React App แล้วคิดว่าเป็น library ที่กินเนื้อที่น้อยมากและวิธีติดตั้งก็ไม่ยาก ก็หวังว่าทุกคนจะลองเอาไปติดตั้งดูเเละฝึกเขียน React กันนะครับ
ข้อมูลอ้างอิง
https://github.com/facebook/create-react-app
https://reactjs.org/docs/getting-started.html
https://en.wikipedia.org/wiki/React_(web_framework)