44,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결만들면서 배우는 리액트 : 기초
함수를 넘기는 게 왜 localstorage에 한번만 접속 하는건지 이해가 잘 가지 않습니다
useState(localStorage.getItem("test")); 이거랑 useState(() => { return localStorage.getItem("test"); }); 이거랑 결국 함수 실행 시에 localStorage에 접근을 할텐데 왜 랜더링 할 때 1번만 접근한다는건지 개념이 이해가 안가네요
- 미해결만들면서 배우는 리액트 : 기초
질문드립니다.
강의를 끝까지 수강을 끝냈구요, 좋은 강의 너무 잘 들었습니다. 한가지 궁금한것이 있어서요 utils.js 에 만들어놓으신 소스중에 const EMPTY_HEART = "🤍"; const FULL_HEART = "💖"; 이부분의 하트 이미지는 이렇게 이미지로 바로 들어갈수 있는건가보네요... 위 하트이미지는 어떻게 넣는건지 궁금합니다. 특수문자 이런것인지 아님 어떤형태로....저렇게 들어간건지 해서요. 바쁘시겠지만 답변 부탁드려요
- 미해결만들면서 배우는 리액트 : 기초
set 부분이 좀 잘 이해가 안가서요
코드를 짤 때 setCounter 하면 바로 counter 값이 할당되는게 아닐까요? 아래 첨부해드린 코드에서 console.log(counter); 한 부분에 찍혀있는 counter 값은 변경되기 전의 값이 찍히더라고요.
- 미해결만들면서 배우는 리액트 : 기초
setCounter 할 때 ++ 이 안먹히던데
따로 안먹히는 이유가 있을까요? counter + 1 을 ++counter 로 표현하면 에러로 표기 되던데 react 문법에서 따로 표기하는 방법이 있는걸까요?그리고 추가로 질문 드립니다, on 이벤트가 발생 될 때마다 해당 dom을 react 자체로 재랜더링 시켜주는 구조인가요? function 자체에서 console.log 를 찍은게 아니라 SubmitForm 변수 안에서 console.log 를 찍은건데 계속 부르는 형식 같아서요 만약 그런 구조라고 하면 기본적으로 다른 플랫폼보다 속도면에서 좀 불리한가 싶어서요
- 미해결만들면서 배우는 리액트 : 기초
기복적인 질문입니다ㅠ 함수 표현식 vs 함수 선언식(해결)
function App() { return ( <MyName first={'홍'} last={'길동'}/> ); } export default App; ------------------------------------------------------------------- 질문 : App.js 에서 MyName이라는 컴포넌트를 사용하려고 할 때 이렇게 두가지 방법이 있는데 차이점이 있나요? 어떤것이 더 좋은 방법인가요? // 1번 방법 const MyName = ({first, last}) => { return( <div> 성은 '{first}'고, 이름은 '{last}'입니다. </div> ) } export default MyName; // 2번 방법 function MyName({first, last}) { return( <div> 성은 '{first}'고, 이름은 '{last}'입니다. </div> ) } export default MyName; 궁금증 해결 1번 방법인 함수 표현식은 호이스팅에 영향을 받지 않고 2번 방법인 함수 선언식 호이스팅에 영향을 받는다
- 미해결만들면서 배우는 리액트 : 기초
useState 안에 함수를 넘기면 왜 반복실행을 방지할 수 있나요?
해당 영상 강의 초반에 const [counter, setCounter] = React.useState(jsonLocalStorage.getItem('counter')) 위 코드를 수정하시면서 카운터의 useState( ) 초기값에 함수 형식으로 쓰면, App 이 렌더링 될 때마다 local storage 에 접근하는 걸 방지할 수 있다고 설명하신 걸로 이해했습니다. 왜 함수 형식 () => { return ... } 으로 useState 초기값에 코드를 쓰면 리액트가 반복실행을 안하는(?) 건지 궁금합니다! 감사합니다 :)
- 해결됨만들면서 배우는 리액트 : 기초
유림님 너무 재밌었어요!
https://honux77.github.io/cat-jjal-maker/ 24강까지 학습하고 이것저것 삽질하면서 구현했습니다 ㅋㅋ. 어렵지만 따라하면서 여기까지 오니 리액트에 대해 살짝 감이 왔어요. JSX가 뭔지 상태가 뭔지 리렌더링이 뭔지 조금이나마 알게 되어서 너무 뿌듯합니다 :)
- 해결됨만들면서 배우는 리액트 : 기초
counter 변수도 초기값이 없으면 널이 되더라구요.
counter 변수도 초기값이 없으면 아마 null이 되는 것 같아요. 에러는 나지 않지만 최초에 "번째 고양이" 으로 나오길래 Try 1: const [counter, setCounter] = React.useState(jsonLocalStorage.getItem("counter") || 0); 했더니 0번째 고양이 가라사대라고 나오는군요. 물론 이것도 자연스럽지만 ㅎㅎ Try 2: const [counter, setCounter] = React.useState(jsonLocalStorage.getItem("counter") || 1); 요렇게 해 주니 조금 더 자연스럽게 되었습니다. || 값 처음 알았는데 유용한 기능 같아요 ^^.
- 미해결만들면서 배우는 리액트 : 기초
https://cataas.com/cat/60b73094e04e18001194a309/says/react 접속이 안되는건 왜그런가요?
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
- 미해결만들면서 배우는 리액트 : 기초
이미지
고양이 이미지들이 현재는 해당 주소에는 없는거 같아요ㅠㅠ
- 미해결만들면서 배우는 리액트 : 기초
cataas.com 오류
안녕하세요! cataas.com API 호출하면 504 에러가 뜨고 사진을 불러올 수가 없네요 ㅠㅠ 다른 대안이나 해결책이 있을까요??
- 해결됨만들면서 배우는 리액트 : 기초
버튼을 누를 때마다 매번 Form() 을 호출하는 걸까요?
function Form() 이 html 처럼 고정적으로 표시되고 있는 거라고 생각했는데요. 매번 console.log(counter) 가 호출되는 걸 보니까, 이벤트가 발생할 때마다 Form()도 호출되서 화면에 새로 그려지고 있는 것 같은데 맞는 걸까요?
- 미해결만들면서 배우는 리액트 : 기초
handleFormSubmit
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. Form컴포넌트에서 props로 받던 handleFormSubmit을 직접 구현하려면 props에서 꼭 빼야하나요? 그게 아니라면 App에 있었던 handleFormSubmit에서 같이 구현해서 props로 넘겨서 쓰는것도 한 방법일까요?
- 해결됨만들면서 배우는 리액트 : 기초
const title =<h1>제목</h1>; 에는 괄호가 없어도 되네요?
한줄이기 때문에 그런 걸까요?
- 미해결만들면서 배우는 리액트 : 기초
useState()괄호안에 함수를 넣을때..궁금한점..
궁금한점이 있어요! 컴포넌트 함수의 속성값을 받아올때는 { }중괄호를 사용하여 함수값을 호출하는데 useState()괄호안에 파라미터값을 적용할때에 useState({CAT1})이 아니라 useState(CAT1)으로 선언하는 이유를 알 수 있을까요..ㅠㅠㅠㅠ
- 해결됨만들면서 배우는 리액트 : 기초
console.log(counter); 가 handleFormSubmit 함수 내부에 있을 때 동작이 잘 이해가 안됩니다.
안녕하세요! Form 컴포넌트 내부를 작성해보다 실수로 아래와 같이 작성하였는데요 function handleFormSubmit(event) { event.preventDefault(); console.log('submit'); setCounter(100); console.log(counter); } 이런식으로 작성을 했더니 처음 submit 시에는 console 에 1이 찍히고 그 다음에 100이 찍혔습니다. 이 동작이 잘 이해가 되지 않는데 이유를 알 수 있을까요?!
- 미해결만들면서 배우는 리액트 : 기초
함수로 정의한 components들
안녕하세요. 컴포넌트를 나누고 있는데 CatItem과 Favorites같은 함수형 컴포넌트들도 나눠주는것이 맞을까요? 컴포넌트를 분류하는 기준은 무조건 컴포넌트로 만든것은 모두 분해를 시키는건지 정확한 기준이 안 와닿아서 질문드립니다! 또한 강의를 끝까지 들었는데, 배포 후 깃헙 리포지토리에 추가하려고 하니 더이상 추가가 안되더라구요(?) 에러메시지를 찾아봐도 마땅한 것이 나오지 않아 문의드립니다. 혹시 이것도 마지막 강의에서 설명해주셨던 build로 계속해서 그냥 pages에 올리기만 할 수 있는건가요?
- 미해결만들면서 배우는 리액트 : 기초
https://cataas.com/ 라고 치면.. bad request 입니다..
https://cataas.com/ 라고 치면.. bad request 입니다.. API가 없어진 것 같습니다.. 27이후로는 진도를 나갈 수가 없네요.. ;;
- 미해결만들면서 배우는 리액트 : 기초
http 502 오류가 계속해서 발생하네요 ㅠㅠ
liveServer 익스텐션을 지우고 깔아봤는데도502(Bad Gateway) 오류가 계속해서 발생하는데해당 고양이 사진 서버 오류 같은데 오류 해결방법은 따로 없나요? ㅠㅠ.
- 미해결만들면서 배우는 리액트 : 기초
Failed to load resource
콘솔에서 이 오류를 어떻게 해결하는 건지 모르겠습니다 원래는 고양이 사진이 잘 나왔었는데 지금은 나오지 않아요