섹션2 리액트 가져오기에서 react@17 말고 18을 불러와도 상관없나요?
643
작성한 질문수 4
안녕하세요! 실습을 하던 도중 react@17 을 가지고 오는 것을 알게되었습니다! 현재 react@18도 나온 것 같은데 17로 실습하는게 나은지 18로도 해도 되는건지 여쭤보고 싶었습니다. 밑에 처럼 바꿔도 되는걸까요?
<!-- 리액트 가져오기 -->
<script src="https://unpkg.com/react@18/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js" crossorigin></script>
<!-- 리액트 컴포넌트 가져오기 -->
<script src="MyButton.js"></script>답변 1
1
안녕하세요, 소플입니다.
리액트 버전 18을 사용하려면 script 태그 부분을 아래와 같이 해주시면 되고,
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>추가로 MyButton.js의 코드가 아래와 같이 ReactDOM.createRoot()를 사용하는 형태로 변경되어야 합니다.
function MyButton(props) {
const [isClicked, setIsClicked] = React.useState(false);
return React.createElement(
'button',
{ onClick: () => setIsClicked(true) },
isClicked ? 'Clicked!' : 'Click here!'
)
}
const domContainer = document.querySelector('#root');
const root = ReactDOM.createRoot(domContainer);
root.render(React.createElement(MyButton));
그리고 이후 3강부터 나오는 실습은 아래 리액트 버전18 기준 코드를 참고해서 진행해주시기 바랍니다!
https://github.com/soaple/first-met-react-practice-v18
감사합니다.
강의가 삭제되었다고 합니다
0
106
1
이거 왜 존재하지 않는다고 뜨는건가요
0
133
1
존재하지 않는 수업이라고 떠요
0
183
1
안드로이드 에뮬레이터 오류
0
100
1
교재 구입해서 강의 들으려고 하는데 커리큘럼이 없어졌어요.
0
126
1
prevIsConfiromed 질문
1
141
2
chapter14 잘이해가 되지않습니다..
1
135
2
2025년 3월 리액트버전
1
202
2
npm 설치 오류
1
175
1
chapter_07 콘솔로그 질문드려요~!
1
128
2
안녕하세요 미니블로그 실습 질문드립니다.
1
178
3
에러가 떠요
1
219
3
Chapter6 질문 드립니다
1
209
2
실습 코드 있을까요?
1
206
2
상태가 업데이트될때 컴포넌트 최상단의 console.log 코드가 두번 실행되는 이유가 궁금합니다.
1
233
2
npx create-react-app my-app 명령어 입력이 잘못된 것 같습니다
0
308
3
이름과 코멘트 줄바꿈이 안 됩니다.
0
140
1
버튼이 안 뜹니다
0
303
2
npx create-react-app my-app
1
470
2
jsx 코드 작성해보기에서 index.js 수정 후 에러 뜹니다.
1
376
3
Chapter_05 터미널, 리액트 에러
0
193
2
npx create-react-app my-app 명령어 반응없음
1
432
3
import 코드 에러
1
214
1
백틱
1
121
1