묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]
리덕스 createStore 오류
Redux 초반에 CreateStore를 import 하면 취소선 뜨면서 기능이 안 먹힙니다. 왜 그런거죠?? 해결책 좀 알려주세요
-
미해결MERN STACK 커뮤니티 : 시작부터 배포까지 알려주는 React
로그인 로그아웃 관련 새로고침 이슈
한가지 더 해결못한 이슈가 있습니다.새로고침 후 /직전에 구동 잘 되는 걸 확인했던 author 정보의displayName을 읽어올수없다는 TypeError가 뜨네요,그리고 로그인 후 리덕스에서 읽어오는 과정에서 뭔가문제가 있는지 자꾸 react_devtools_backend.js:3973 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. at Login (http://localhost:3000/static/js/bundle.js:924:76)이 오류가 뜨네요, 무시해도 되는 것인지 아니면 이번 문제와 연관이 있는지 모르겠습니다. 헷갈리는건 리덕스를 포스트 리스트 페이지에 연동하기 전까지는 무리 없이 잘 됐다가 갑자기 페이지를 새로고침 하니까로그인 관련 이슈가 생겼다는 점입니다.!!제가서버를 구동시킨 상태에서 디테일 컴포넌트에 추가했던 author 정보의 displayName 받아오는 코드를 다시 지웠더니 문제가 사라졌다가 지웠던 코드를 똑같이 다시 쓰니 디테일 페이지가 문제 없이 작성자 정보를 보여주었습니다. <h3>writer:{postInfo.author.displayName}</h3> 그런데 새로고침을 누르자 마자 위의 타입에러가 뜨면서 디테일페이지가 로딩이 1초간 됐다가 흰 화면이 되며 콘솔창에 아래 오류가 뜨는 것입니다. 콘솔창에 문제를 추적하기 위해 제가 아래 디테일 코드에 콘솔로그를 몇군데에 찍어봤는데 로그인 문제와 연관이있는지 서버와 연결은 되지만 위 첨부 콘솔창과 같이 빈 데이터가 넘어오는것 같습니다. 혹시나 해서 다시 "/" 으로 돌아가 로그아웃을 강제로 하고재로그인을 해서 리스트가 있는 페이지로 들어와봤습니다.그랬더니 author 정보는 잘 받아오는데 다음과 같은 콘솔창 오류가 추가되었습니다.일단 저 오류를 무시하고 리스트에 있는 목록을 하나 클릭해 들어가니 역시나 빈 배열이 받아지는 오류가 반복됩니다.분명 새로고침과 관련한 문제인 것 같은데....이상한건 새로고침을 하면 자동 로그아웃이 되어버리는건가 하고 의심해서 "/" 으로 돌아와보면토큰이 넘어와 로그인 상태가 유지중이었습니다.그래도 의심되는건 바로 로그인상태가 표시되는게 아니라 조금 뜸들이다가 로그인이 되었음이 표시되긴 합니다. 판다선생님이라면 어떤 부분을 살펴보실 것 같은가요어떤 부분을 살펴보면 좋을지 알려주시면 확인 후 조치해보고 코드를 첨부해보겠습니다.
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
안녕하세요 리덕스 툴킷 관련질문입니다.
안녕하세요. 리덕스 툴킷을 활용하려고 공부를 막 시작했습니다. cra템플릿을 인스톨해서 보고있는데 비동기요청하는 부분이 조금 헷갈려 질문드립니다. // typically used to make async requests. export const incrementAsync = createAsyncThunk( 'counter/fetchCount', async (amount) => { const response = await fetchCount(amount); // The value we return becomes the `fulfilled` action payload return response.data; } ); 위 함수를 extraReducers 내에서 extraReducers: (builder) => { builder .addCase(incrementAsync.pending, (state) => { state.status = 'loading'; }) .addCase(incrementAsync.fulfilled, (state, action) => { state.status = 'idle'; state.value += action.payload; }); }, 대기, 성공, 실패를 addCase해줘야한다 로 이해는 했는데요 그 다움 궁금한점은 api요청이 한가지 가 아닐텐데 많은 api요청들을 어떻게 추가해야하나요?
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
리덕스 액션 호출 관련 질문
안녕하세요 제로초님~! 액션타입을 호출할때 아래와같이 두가지로 호출이 가능하다고 알고 잇습니다! 그런데, 액션타입을 리턴하는 함수를 만들어 호출하는 경우와 type 자체를 호출하는 경우가 있는데 사용성의 차이가 있을까요..? 개인 선호도 차이인가요.? const onLogOut = useCallback(() => { dispatch({ type: LOG_OUT_REQUEST, }); // dispatch(logoutRequestAction()); }, []);
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 기본 강의
로그인 & 회원 가입 후 로그인한 유저 정보를 사용하고 싶습니다
안녕하세요! 선생님 강의를 통해 리덕스에 대해 공부하고 있습니다! 로그인 후 다른 페이지나 기능에서 로그인한 유저의 정보를 이용하고 싶은데 어떻게 가져오는 것인지 잘 모르겠습니다. 어떻게 해야하나요? ㅜㅜ
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
리덕스 툴킷과 적용과 사가에 대한 질문입니다
일단 강의 정말 잘 봤습니다. 특히 배포하는 부분에서 많이 배웠고 부족한 점이 많구나 생각이 들었습니다. 다름이 아니고 궁금한 것은 제로초님 유튜브에서 기존에 사용했던 사가를 때어내고 툴킷과 SWR을 적용하는 영상을 봤습니다. 저 또한 툴킷과 SWR을 사용하려고 하고 있던 차에 또 영상에서 하신 말씀이 기억에 남아 질문 남깁니다 1. takeLatest, takeEvery 이정도만 쓰면 Thunk쓰는 거랑 똑같다고 하셨는데 Thunk로 어떻게 구현하셨는지 (툴킷의 createAsyncThunk의 cancelation인지 SWR이나 React-Qeury등의 캔슬 기능으로 구현하셨는지) 2. Saga lodash로 throttle, debounce 어떤 식으로 가능할지 (https://velog.io/@edie_ko/React-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8-%EC%84%B1%EB%8A%A5-%ED%96%A5%EC%83%81-%EC%8B%9C%ED%82%A4%EA%B8%B0-feat.-Lodash-throttle-debounce) -> 혹시 여기에 설명 되있는 것과 비슷한 개념인지 코드 안 남겨주셔도 되고 전체적인 개념만 설명해주실 수 있으시면 감사하겠습니다. 항상 잘 보고 있습니다!