무료
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결처음 만난 리액트(React)
== 와 ===
const post = data.find((item) => { return item.id == postId; });이 코드에서 왜 == 를 ===로 바꿔줬을 때는 data를 찾지 못하는 걸까요?postId 와 item.id 모두 int 값 아닌가요?
- 미해결처음 만난 리액트(React)
useContext hook
useContext hook 을 사용할때 만약 랜더링이 무거운 작업이라면 최적화를 시켜줘야한다고 하셨는데 여기서 말하는 최적화란 무엇일까요? 변수에 담아서 데이터를 사용하는게 최적화 일까요?
- 미해결처음 만난 리액트(React)
빌드 불가.. ㅠㅠ
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. node가 V18.14.2 버젼이고, npm이 9.5.0 버전인데 zsh: killed npx create-react-app ReactTest 라고 뜹니다 ㅠㅠ
- 미해결처음 만난 리액트(React)
(실습)댓글 컴포넌트 만들기 강의에서 props 관련 질문
<Comment name={"이인제"} comment={"안녕하세요, 스필입니다."}/> 이렇게 전달하는데 {}을 쓰거나 쓰지않거나 정상적으로 포트 화면에 출력이 되는데 둘의 차이가 무엇인지 궁금합니다.
- 미해결처음 만난 리액트(React)
npm start 후 빈화면
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. npm start 후 작성한 코드가 실행되지 않고 빈화면 띄는데 어떻게 해야할까요?구글링 해본 결과 package.json 파일에 "homepage="." 추가하면된다고하는데,,,(제가 참고한 블로그입니다.리액트 빌드 결과 빈화면만 보일때 - 상대경로 설정하기 (tistory.com))일단 index.html 파일에 있는 내용 첨부해드립니다.. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="theme-color" content="#000000" /> <meta name="description" content="Web site created using create-react-app" /> <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <!-- manifest.json provides metadata used when your web app is installed on a user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ --> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <!-- Notice the use of %PUBLIC_URL% in the tags above. It will be replaced with the URL of the `public` folder during the build. Only files inside the `public` folder can be referenced from the HTML. Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will work correctly both with client-side routing and a non-root public URL. Learn how to configure a non-root public URL by running `npm run build`. --> <title>React App</title> </head> <body> <noscript>You need to enable JavaScript to run this app.</noscript> <div id="root"></div> <!-- This HTML file is a template. If you open it directly in the browser, you will see an empty page. You can add webfonts, meta tags, or analytics to this file. The build step will place the bundled scripts into the <body> tag. To begin the development, run `npm start` or `yarn start`. To create a production bundle, use `npm run build` or `yarn build`. --> </body> </html>
- 해결됨처음 만난 리액트(React)
메세지가뜨지 않습니다
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.사진과 같이 뜨고 안에 텍스트가 뜨질 않아서 버전 문제인가 하여 깃허브에 올리신 18버전 코드를 붙여넣어도 텍스트만 안뜹니다..ㅠ...
- 미해결처음 만난 리액트(React)
useState 사용 질문
기초질문이지만 명확하게 이해가 가지 않아 질문드립니다 ..! (완전 초보입니다.. ㅠㅠ)Calculator function에서 temperature,scale 선언시에 useState()로 받는것은 재사용방지를 위한 hook을 사용하는 것인가요 ˀ̣
- 미해결처음 만난 리액트(React)
블로그 실습 빌드 시 오류
마지막 단계까지 마쳤는데요~ 빌드 폴더 생성 후 npm install -g serve 시에 오류가 납니다어떤 오류 인지 모르겠어서 소스 첨부 후 문의 드립니다 감사합니다~
- 미해결처음 만난 리액트(React)
CommentListItem의 props에 대한 질문입니다.
강의에서 CommentListItem 컴포넌트를 만든 후에CommentList 컴포넌트를 만들었는데,CommentListItem에서 comment를 props로 받는건CommentList에 map에서 comments에서 배열을 하나씩 뽑을 때 사용할 이름 comment를 생각해두고 CommentListItem가 comment로 명명한 props를 받는건가요? 그리고map에서 사용할 comment 처럼 쓰이는 것들도 그냥 변수라고 부르나요?index가 key 값으로 사용되지 않았는데 존재 이유는 무엇인가요?
- 미해결처음 만난 리액트(React)
Event handler 질문입니다.
변수 handleConfirm의 Arrow function이 실행하는 것은 어떤걸 받아서 무엇을 하는 건가요?prevIsConfirmed이 뭘 하는 녀석인지 모르겠습니다.
- 미해결처음 만난 리액트(React)
백틱 내부 색상
선생님처럼 백틱 내부 문자 색상이 원래 색처럼 나오게 하려 어떻게 해야하나요? 같은색이라 구분이 잘되게 보고 싶은데
- 미해결처음 만난 리액트(React)
코드 의미를 모르겠어요 react
const {comments} = props; 의미? {} 안에는 어떤 것을 넣는 것인지요? 각 항을 설명해 주세요 {comments.map((comments, index)=>{ return <CommentListitem key={comment.id} comment={comment} />; 리액트 진짜 어렵네요 CommentList.jsx 일부 입니다 function CommentList(props){ const {comments} = props; return( <Wrapper> {comments.map((comments, index)=>{ return <CommentListitem key={comment.id} comment={comment} />; })}</Wrapper> ); }
- 미해결처음 만난 리액트(React)
코드의 의미를 모르겠어요 react요
const Wrapper =styled.div 이게 무슨의미인지요? 또 문법이 괄호도 없고 빽틱으로만? & >*{ :not(:last-child){ margin-bottom:16px; } 이건 또 무슨의미인지요 CommentList.jsx 의 일부 입니다 const Wrapper =styled.div` display:flex; flex-direction : column; align-items:flex-start; justify-content : center; & >*{ :not(:last-child){ margin-bottom:16px; } } `;
- 미해결처음 만난 리액트(React)
클릭 시 페이지가 넘어가지지 않습니다.
안녕하세요 질문이 있습니다.에러는 발생하지 않는데 클릭 했을 때 페이지가 안 넘어 가집니다. 주소를 입력해서 접속할 때도 잘되는데클릭 시에 아무 반응이 없습니다. 뭐가 문제일까요?
- 미해결처음 만난 리액트(React)
Chapter12 Calculaotr.jsx 질문
안녕하세요, 소플님. Chapter12 Calculaotr.jsx 파일에 있는섭씨, 화씨 온도 변환 코드와관련해서 문의드리고 싶은 부분이 있어 글을 남깁니다. 만약 사용자가 섭씨 온도 입력한에 섭씨 온도를 입력했다고 했을 때온도는 temperature 변수에 저장되고, 섭씨 온도를 입력했기에celsius란 변수에 저장됩니다. 또한 scale은 c 입니다. 사용자가 섭씨 온도를 입력했으니 화씨 온도로 바꿔줘야 할 차례인데이 부분부터 잘 이해가 가지 않습니다. const celsius = scale === "f" ? tryConvert(temperature, toCelsius) : temperature; 저는 위의 코드를 섭씨 온도를 화씨 온도로 바꿔주는 부분으로 이해했습니다.하지만 그러기 위해선 scale === f 로 두고, tryConvert(temperature, toCelsius) 로 두는 게 아닌 const celsius = scale === "c" ? tryConvert(temperature, toFahrenheit) : temperature;위의 코드처럼 scale을 c로 두고tryConvert(temperature, toFahrenheit) 로 바꿔줘야사용자가 입력한 섭씨 온도를 화씨 온도로 바꿔줘.가 되는 걸로 이해했습니다. scale을 c로 둔 이유는 사용자가 섭씨 온도를 입력하면온도는 temperature 변수, 그리고 celsius 변수에 저장되며celsisus 변수에 저장되면서 동시에 위의 코드에 의해 scale은 c가 되기에scale을 c로 뒀습니다. const celsius = scale === "c" ? tryConvert(temperature, toFahrenheit) : temperature; 그래서 위에처럼 코드를 작성해야섭씨 온도를 화씨 온도로 바꿔주는 거라고 생각했습니다. 혹시 제가 어떤 부분에서 잘못 생각하고 있는지 알 수 있을까요?
- 미해결처음 만난 리액트(React)
(실습) Context를 사용하여 테마 변경 기능 만들기 에서 테마 변경이 안 돼요.
테마 변경 버튼을 눌러도 테마 색 변경이 안 됩니다. 이전에 카드 만들기 실습에서도 색이 안 나오는 걸 보면 제 습관적인 실수인데... 제 실수를 못 찾겠습니다...
- 해결됨처음 만난 리액트(React)
마지막 강의를 들으며 실행하는 부분에서 에러가 뜹니다.
해당 키워드에서 오류가 났다고 뜨는데 잘못된 부분이 없는것 같아 문의드립니다.
- 미해결처음 만난 리액트(React)
Error : Invaild hook call
이제 마지막 강의를 듣는 중인데..코드를 다 작성한 후 앱을 실행하니 빈 화면만 뜹니다.오류 화면은 아래와 같구요.맨 처음 나온 에러가 Invaild hook call이어서Invalid Hook Call Warning – React (reactjs.org)해당 링크로 들어가 확인해봤는데,제 생각엔 Duplicate React 에러인 것 같은데 해결 방법을 모르겠어요.
- 미해결처음 만난 리액트(React)
3000번 포트를 열면 아무것도 출력되지 않습니다.
안녕하세요. 홈페이지를 만들어 볼일이 향후 있어서 소플님의 리액트강의를 인프런에서 무료로 수강하게 되었습니다. 좋은 강의를 무료로 학습할 수 있게 해주셔서 감사드립니다. (실습) JSX코드 작성하기 부분에서 문제가 생겨서 질문을 드리게 되었습니다.(제가 작성한 코드는 다음과 같습니다.) 소플님께서는 강의를 찍으실 때 프로젝트 이름을 MY-APP이라고 하신 반면에, 저는 Practice라고 한 부분만 다르게 설정했을 뿐 나머지는 같다고 생각하는데, 혹시 제가 다르게 작성한 부분이 있을까요? (npm start)를 하기 전에 cd Practice폴더로 이동후 npm start를 하면 빈화면이 출력됩니다. Book.jsx Library.jsxindex.js자바스크립트에선 문자열 포맷팅을 할 때 `(백슬래쉬)를 사용하는 부분과 라이브러리를 불러올 때 앞글자가 대문자인 점도 잘 지켰다고 생각이 드는데, 어떠한 부분이 틀린지 잘 모르겠습니다.
- 미해결처음 만난 리액트(React)
github에 강의 보면서 만든 소스 코드 등을 올려도 괜찮나요?
강의중에 나오는 실습부분 코드들을 개인 깃허브에 업로드 해도 괜찮을까요?