ทำไมต้อง import React from 'react'#

1. เพื่อบอกว่าไฟล์ที่ใช้เป็น JSX

• JSX คือไวยากรณ์พิเศษที่ช่วยเขียนโค้ด UI ในรูปแบบที่คล้ายกับ HTML โดย JSX จะถูกแปลงเป็นคำสั่ง JavaScript ผ่าน React.createElement() เบื้องหลัง ดังนั้น React ต้องถูกนำเข้าในไฟล์ทุกครั้งที่คุณใช้ JSX เพื่อให้สามารถแปลง JSX เป็น JavaScript ได้

const element = <h1>Hello, World!</h1>;

ถูกแปลงเป็น :

const element = React.createElement('h1', null, 'Hello, World!');

2. เข้าถึงฟีเจอร์ของ React

• นอกจาก JSX แล้ว การนำเข้า React ยังช่วยให้คุณเข้าถึงฟีเจอร์ต่างๆ เช่น hooks, component, และ utilities ที่อยู่ใน library React ได้

แต่ปัจจุบันไม่จำเป็นแล้ว เพราะตั้งแต่ React 17+

• React ได้ปรับปรุงตัวแปลง JSX (JSX Transform) ให้สามารถทำงานโดยไม่ต้องมีคำสั่ง import React ตัวอย่างเช่น :

ก่อน React 17

import React from 'react';
function App() {
  return <h1>Hello, World!</h1>;
}
export default App;

React 17 ขึ้นไป

function App() {
  return <h1>Hello, World!</h1>;
}
export default App;

• ทดสอบ git push ใน mac