묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
인피니트 스크롤 throttle 두번씩 요청 질문입니다,,,
안녕하세요, redux devtools 로 확인해보면 요청이 두번씩가는데 도데체 이유를 모르겠습니다..ㅠㅠ 코드도 동일하고 throttle 5000도 동일하게 적용했는데 왜그럴까요.. throttle을 설정했는데 요청이 두번갈수가 있나요?
-
해결됨실전 리액트 프로그래밍
BestScore 표현이 NaN 으로만 나타납니다.
한단계식 나아갈때마다 찾지 못할 에러에 빠지네요 ㅠㅠㅠ 전체다 코드 점검을 해본것 같은에,,,,, 제 힘으로 찾아지지가 않습니다 ㅠㅠ BestScore에서 숫자로 표현되지 않고 NaN으로 표현됩니다. 코드는 깃허브 주소에 있습니다. https://github.com/Doha-Dev/game2048 감사합니다!!
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
동영상이 아닌 사진 저장
동영상이 아닌 사진으로 올리려고 하는데 사진 사이즈를 바꾸고 렌더 시키고 싶어서 ffmpeg의 screenshot의 옵션 이용했는데 썸네일이 저장이 안되네요 ㅠ 혹시 사진 사이즈를 바꾸고 렌더시킬 수 있는 방법이 있을까요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
samesite=none 일 때 쿠키 공유 문제
안녕하세요. 쿠키 관련 질문이 있습니다. front에서 axios로 보낼 때 withcredentials: true 를 해주고 backend에서도 cors에서 credentials : true를 해주었기 때문에 로컬에서 프론트와 백엔드를 같이 돌릴 경우에는 쿠키 공유 문제가 없습니다. 그런데 백엔드를 aws EC2에 두고 프론트 엔드를 로컬에서 돌릴 경우 쿠키가 공유되지 않습니다. 원인은 samesite 정책 때문이고 해결하려면 backend에서 쿠키를 보낼 때 samesite=none과 secure:true를 같이 적용해줘야 한다는 걸 알았습니다. 이를 해결하려면 결국 https 적용을 위해 nginx로 프록시를 만들어 줘야 하는데 다른 방법이 있을까요? 간단한 방법은 로컬에서 계속 테스트 하다가 배포관련 수업에서 하는 것 처럼 도메인을 같이 등록하면 되긴 하지만 이런 경우에도 해결하는 방법이 있는지 궁금합니다.
-
해결됨실전 리액트 프로그래밍
강의를 따라 공부중인데 어디서 막혔는지 모르겠습니다.
키보드 조작하는 부분까지 강의를 따라 만들어둔 상태입니다. (스코어 부분 시작 직전까지, 약 37분 45초까지) * 키보드 동작을 넣기전에는 4x4 셀을 그린 후 두 곳에 랜덤하게 숫자2를 표현하였습니다. * 키보드 동작까지 완료 후 4x4 셀을 그린 후 아무런 타일이 생성되지 않고 있습니다. 키보드 동작시에 에러도 없습니다. 강의 진행 중 아무런 에러도 발생하지 않고 코드를 역추적해가며 살펴봐도 어디 부분에서 잘못을 했는지 찾아지지가 않습니다 ㅠㅠ 도움이 필요합니다! * 깃에 올려둔 코드 주소입니다( https://github.com/Doha-Dev/game2048.git )
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
리덕스 툴킷 유튜브 영상
안녕하세요, 제로초님 강의 잘 보고 있습니다. 예전에 유튜브에 리덕스 툴킷영상이 올라갔던걸로 기억하고, 봐야지... 하고 있었는데 없어졌네요?? 영상에 문제가 있어서 내리셨나요??
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
선생님 질문있습니다.
다른분이 질문하신건데 9:30초에 const productId = props.match.params.productId; 여기서 props.match.params.productId 가 어디서 나온건지 잘 모르겠습니다 ㅠㅠ. App.js 에서 Auth로 감싸줘서 props가 있는건 알겠는데 match.params.productId가 어디서 나온건지 모르겠네요 ㅠㅠ App.js -> hoc/auth.js -> user_actions.js->index.js-> routes/users.js 까지 가봤는데 잘 모르겠네요 ㅠㅠ
-
[리뉴얼] React로 NodeBird SNS 만들기
propery 'nickname' of undefined
삭제된 글입니다
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
이번 강의 users.js에서 map() 대신 forEach()를 사용한 이유
간단한 궁금증입니다.. map()과 forEach()의 세세한 차이점은 검색을 해봤는데 map메소드가 보통 성능 면에서도 더 빠르고 기존의 데이터를 변형시키지 않고 새로운 배열을 반환하기 때문에 기존 데이터가 필요한 경우에도 쓸 수 있을 것 같다는 생각이 들었습니다. 강사님은 각각 어떤 경우에 map()과 forEach()를 사용하시는지 여쭤보고 싶습니다!
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
이 에러는 왜나는걸까요?ㅠㅠ
그동안 강의보면서 에러나도 어찌저찌 잘 넘겼는데 ㅠㅠ 이번 에러는 조금 감이 안오네요 ㅠㅠ writer가 유효하지 않게 넘어가는 건지 ㅠㅠ 이유가 있을까요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
rootReduecer함수에서 리듀의 초기화
reducers 폴더의 index파일의 rootReducer함수에서 defalut: return state 들어가는이유 설명해주실때 액션타입해서 그 다음상태 만들어주는것을 처리해주는대 리듀서 초기화할때 또 rootReducer함수가 실행이되는대 그때defalut: return state이 부분이 없으면 리턴값이 undefined된다 이렇게 설명해주셨는대 리듀서가 왜 초기화되는지 이유가 궁금합니다!
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
user를 찾을 수 없다고 나와요ㅠㅠㅠㅠ
AppLayout에서 store에서 IsLoggedIn 가져오는데서 에러가 발생합니다. const isLoggedIn = useSelector((state) => state.user.isLoggedIn); 에러 코드 TypeError: Cannot read property 'user' of undefined const initialState = { user: { isLoggedIn: false, user: null, signUpdata: {}, loginData: {}, }, post: { mainPosts: [], }, }; const rootReducer = (state = initialState, action) => { switch (action.type) { case "LOG_IN": return { ...state, user: { ...state.user, isLoggedIn: true, user: action.data, }, }; case "LOG_OUT": return { ...state, user: { ...state.user, isLoggedIn: false, user: null, }, }; default: return; } }; 뭐가 문제일까여...힝ㅜㅜㅜㅜ
-
해결됨따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]
ORM에 대해 질문드립니다.
이전 질문은 보니 관계형 데이터 베이스로도 강의를 제작할 계획이 있다고 하셨는데요 1. 존안님께서 실무에서 쓰는 DB는 MySQL 인가요?? 2. 그럼 ORM 종류는 무엇으로 하시나요? 시퀼라이즈, 프리즈마.. 등등 어떤것으로 사용하시나요?
-
미해결리액트로 나만의 블로그 만들기(MERN Stack)
새로고침시 로그인이 유지 되지 않습니다.
되게 여러번 따라 했는데, 새로고침 하고난 후 로그인이 유지가 되지 않습니다..ㅠㅠ authSaga 속의 함수들이 제대로 작동하지 않는것 같습니다.... authoSaga속 함수를 호출하는 시작이 어딘지 순서 또한 잘 파악되지 않습니다..ㅠ 계속 401에러가 뜹니다. ㅠㅠ
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
노드버드 검색에 대해서
안녕하세요!! 강의를 구매하고 시작합니다. 그런데 궁금한 점이 있는데..... 구글에서 '노드버드'라고 검색하니깐, 검색이 되는 것을 확인했습니다. 그런데 네이버에서 '노드버드'를 검색을 해보니 아무것도 보이지 않네요?? 1. 네이버 검색엔진에 등록은 안하신 건가요? 2. 네이버에서는 검색엔진 최적화가 안되는 건가요? 3. 개인 포트폴리오를 만들고 싶은데요, 리액트로 블로그를 만들어서 검색엔진 최적화를 하고 싶은데요. 제가 게시물을 작성 한다면.... 그 각자의 게시물이 검색엔진에 의해서 검색이 될 수 있는거죠? p.s. 조현영 강사님~ 리액트로 검색엔진 최적화가 된다길래.. 뒤도 돌아보지 않고 질렀습니다. 강의 열심히 들어볼께요! 그리고 이걸 마스터 하면 다른 타입스크립트 강좌도 구매할 예정입니다^^
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
제이쿼리와 리액트 합칠 수 있다는 점에서 궁금한 점이 생겻는데요.
리액트 네이티브와 네이티브 언어(스위프트, 코틀린)도 합쳐서 개발을 할 수 있는 걸까요?
-
해결됨실전 리액트 프로그래밍
이전 상태값을 기반으로 다음 상태값을 사용하는 사례가 어떤게 있을까요?
영상 내에서는 이전 상태값을 이용해서 +1을 계속 해주는 예제를 보여주셨는데요! 영상 속 사례에서는 굳이 [count]를 의존성 배열에 안넣어줘도 작동을 하니까 어느 부분에서 유용하게 쓰이는지가 좀 헷갈리더라구요..! 이전 상태값을 기반으로 다음 상태값을 사용하는 사례가 어떤게 있을까요?
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요. 제로초님. 질문이 있어 문의 드립니다.
안녕하세요 제로초님, 강의 잘 보고 있다가, 댓글 삭제 기능도 만들고 싶어 만들어 보았는데요... 삭제시 삭제는 되나 새로고침을 해야 사라지는 부분이 있더라구요, 삭제 버튼 클릭시 바로 사라지도록 하고 싶은데 어느 부분이 잘못 됬는지 감이 잡히질 않습니다ㅠㅠ 한번 확인 부탁드려요ㅠㅠ reducer api onClick 삭제 버튼 사가
-
해결됨실전 리액트 프로그래밍
useEffect 실전 활용법2 부분 질문
끝에 첨부한 코드로 실행하면 작동은 잘 됩니다.window.addEventListener('click', () => { onClickRef.current();});문제는 강의에 나오는 코드인 위 코드로 작성하면 removeEventListener를 반환 해주더라도계속해서 이벤트가 삭제되지 않고 클릭할 때마다 Listener가 계속 생성되면서Count 가 몇 배로 불어나는 버그가 생깁니다.addEventListener에서 화살표함수를 사용하여 OnClickRef.current(); 를 호출해주는이유가 있나요?물론 removeEventListener없이 화살표 함수로 eventListener 를 실행하여도의존성 배열부분에 빈배열로 남기면 당연히 작동은 잘 합니다.그런데 보통 removeEventListener 를 리턴해주는 것이 정석인 것 같은데화살표함수로 호출한 eventListener는 removeEventListener로 제거가 안되더라구요.별거 아닌 코드인데 원인을 모르니 답답하네요.그리고 제가 작성한 코드에서도 이 부분을 ref객체를 useEffect 내에서 수정하지 않으면 문제가 생기는데 왜 그런지 모르겠네요..강의에서 설명해주신 바로는 useEffect 내에서 ref객체를 수정하는 이유는 이후에 있을 concurrent mode로 실행될 때를 대비해 사용하는 것이고,concurrent mode로 실행하지 않을 시에는 문제가 생기지 않을 것이다라고 하셨는데,Component 함수에서 직접 수정 시엔 원인 모를 문제로 웹이 다운 되어버립니다. 느낌상 어떤 부분이 지나치게 렌더링이 되면서 다운 되는 느낌인데 뭔지 모르겠습니다.왜 이런 현상이 일어나는지 알 수 있을까요?import { useState } from "react"; import MyComponent from "./components/MyComponent"; function App() { const [count, setCount] = useState(0); function onClick() { setCount(count + 1); } return ( <div> <MyComponent onClick={onClick}/> <div>{count}</div> </div> ); } export default App;import { useEffect, useRef } from "react"; export default function MyComponent({ onClick }) { const onClickRef = useRef(); useEffect(() => { onClickRef.current = onClick; }); useEffect(() => { window.addEventListener('click', onClickRef.current); return () => window.removeEventListener('click', onClickRef.current); }); return ( <div>테스트</div> ); }
-
미해결리액트로 나만의 블로그 만들기(MERN Stack)
Redux/saga를 많이 사용하게 되면 불리할까요?
강의와 별개의 내용일수도 있지만, 한가지 여쭙고 싶습니다. 선생님 강의를 듣고 테이블을 좀 많이 사용하는 프로젝트를 하나 해보고 있습니다. 각 테이블마다 saga/reducer를 하나씩 만들고 있는데요, 이럴경우 문제가 될 수 있나요? 공통된 부분은 묶어내고 싶긴 한데, 분류하기가 조금 복잡해서요. 예를 들어, authReducer, customerReducer, productReducer 등등 각 테이블마다 다 만들었거든요. 이런 경우 퍼포먼스 면에서 부족함이 있을까요? 내용이많고 큰 프로젝트보단 중/소 규모의 프로젝트가 리액트에 어울리다라는 이야기를 들은적이 있었지만, 개발하는 사람의 능력에 따라 다르겠지만, 제가 배운 내용을 기반으로 한번 프로젝트를 진행해보고 싶어서 이렇게 시도해보고 있습니다. 강의와 관련있는 질문을 남겨주세요.• 강의와 관련이 없는 질문은 지식공유자가 답변하지 않을 수 있습니다. (사적 상담, 컨설팅, 과제 풀이 등)• 질문을 남기기 전, 비슷한 내용을 질문한 수강생이 있는지 먼저 검색을 해주세요. (중복 질문을 자제해주세요.)• 서비스 운영 관련 질문은 인프런 우측 하단 ‘문의하기’를 이용해주세요. (영상 재생 문제, 사이트 버그, 강의 환불 등) 질문 전달에도 요령이 필요합니다.• 지식공유자가 질문을 좀 더 쉽게 확인할 수 있게 도와주세요.• 강의실 페이지(/lecture) 에서 '질문하기'를 이용해주시면 질문과 연관된 수업 영상 제목이 함께 등록됩니다.• 강의 대시보드에서 질문을 남길 경우, 관련 섹션 및 수업 제목을 기재해주세요. • 수업 특정 구간에 대한 질문은 꼭 영상 타임코드를 남겨주세요! 구체적인 질문일수록 명확한 답을 받을 수 있어요.• 질문 제목은 핵심 키워드를 포함해 간결하게 적어주세요.• 질문 내용은 자세하게 적어주시되, 지식공유자가 답변할 수 있도록 구체적으로 남겨주세요.• 정확한 질문 내용과 함께 코드를 적어주시거나, 캡쳐 이미지를 첨부하면 더욱 좋습니다. 기본적인 예의를 지켜주세요.• 정중한 의견 및 문의 제시, 감사 인사 등의 커뮤니케이션은 더 나은 강의를 위한 기틀이 됩니다. • 질문이 있을 때에는 강의를 만든 지식공유자에 대한 기본적인 예의를 꼭 지켜주세요. • 반말, 욕설, 과격한 표현 등 지식공유자를 불쾌하게 할 수 있는 내용은 스팸 처리 등 제재를 가할 수 있습니다.