월 17,600원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
npm init 대신에
node js 깔고, 터미널에 'npx create-next-app@latest' 설치한 다음에 pasge 폴더에 있는 거 다 지우고 index.js 파일 새로 생성해서 코드 짜넣어도 npm run dev가 동작하는데 상관 없나요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
`cors({ origin: true })` 가 이점이 있나요?
cors({ origin: true }) 했을시에는Access-Control-Allow-Origin 이 '*' 이 아닌 http://localhost:3001 이렇게 요청보낸 곳의 url 로 나오는데, 특별한 이점이 있나요? 단순히 사용자에게 cors({ origin: '*' })이 아니다 라고 알려주는게 목적인가요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
reducers/ 는 리덕스에 넣을 데이터 처리, sagas/ 는 리덕스 파이프라인으로 생각하면 될까요?
reducers/ 는 리덕스에 넣을 데이터 처리, sagas/ 는 리덕스 파이프라인으로 생각하면 될까요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
useEffect 디벤던시에 [hasMorePost] 를 사용한 이유는 무엇인가요?
useEffect(() => { const onScroll = () => { /* * window.scrollY, // 스크롤된 양 * document.documentElement.clientHeight, // 유저가 보는 문서의 높이 * document.documentElement.scrollHeight // 전체 문서 높이 */ if ( hasMorePost && window.scrollY + document.documentElement.clientHeight + 300 > document.documentElement.scrollHeight ) { console.log('✅ 인피니티 스크롤'); dispatch(loadPostAction(5)); } }; window.addEventListener('scroll', onScroll); // 컴포넌트 언마운트시 이벤트 제거 return () => { window.removeEventListener('scroll', onScroll); }; }, [hasMorePost]); useEffect 디벤던시에 [hasMorePost] 를 사용한 이유는 무엇인가요?hasMorePost 의 상태가 변화(로딩요청 -> 로딩완료)하면 계속적으로 useEffect 가 실행되어 성능에 더욱 안좋을 것 같습니다.
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
onScroll 함수를 arrow function 을 사용하지 않으신 이유가 있나요?
onScroll 함수를 arrow function 을 사용하지 않으신 이유가 있나요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
singlePost에 데이터 담는 관련 질문
안녕하세요 선생님. 단일 게시글 불러오기를 하고 있는데 이해되지 않는 부분이 있어 질문 드립니다. 리덕스로 요청 보내고 콘솔창을 보면 이런 식으로 데이터를 받아온것을 확인할 수 있는데, 저는 이 데이터를 아래 리듀서에서 case LOAD_POST_SUCCESS: draft.loadPostLoading = false; draft.loadPostDone = true; draft.singlePost = action.data; <- 여기서 singlePost에 데이터를 담았다고 생각했거든요 break;근데 제 예상하곤 다르게 프론트에서 useSelector로 const {singlePost} = useSelector((state) => state.post);이렇게 singlePost를 가져와서 콘솔을 찍어보면 브라우저 콘솔 창에 null이 뜨는데...어디서 잘못한 건지 알 수 있을까요..?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
useSelector 두번(중복)실행해도 괜찮은가요?
const id = useSelector((state) => state.user.user?.id); const { addCommentDone } = useSelector( (state) => state.post );위에 코드처럼 state 단계에서 갈리게되면 2번 실행하게되는데 성능엔 문제 없나요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
next-redux-wrapper에 대해 질문드립니다.
터미널에 나오는 거 지우고 싶은데 어떻게 하면 될까요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
takeLatest()를 사용함으로써 백엔드와 프론트의 처리 간극이 생기는 경우는 없나요?
takeLatest()를 사용함으로써 백엔드와 프론트의 처리 간극이 생기는 경우는 없나요?프론트: takeLatest 를 사용 해서 2개의 요청을 보내더라도 2번째 응답만 처리,백엔드: 중복적으로 2개이 요청이 들어오면 후에 들어온 요청을 무시 1번째 요청만 처리
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
loggerMiddleware 에서 console.log(action) 시 개발자 도구에서 [object Object] 라고 나오는데 이유가 무엇일까요?
loggerMiddleware 에서 console.log(action) 시 개발자 도구에서 [object Object] 라고 나오는데 이유가 무엇일까요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
state 에 현재 슬라이드 index 를 저장하는 이유는 무엇인가요?
state 에 현재 슬라이드 index 를 저장하는 이유는 무엇인가요?
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
JWT Reflesh 토큰에 관한 질문
제로초님께 여쭤보고싶은 질문이 있습니다.. (수업외)JWT Refresh 토큰이란걸 배웠는데그럼 refresh 토큰은DB나 저장소에서 관리를 해야 의미가 있는 아이인가요?그저 refresh토큰은 access토큰을 유지해주는 애라고 알고있는데...프론트한테 주느냐 백한테 주느냐에 따라 용도가 달라지는걸까요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
`<List header={header}` 에서 header 같은 String 타입들도 useMemo 처리를 해주는 것이 좋은가요?
<List header={header} 에서 header 같은 String 타입들도 useMemo 처리를 해주는 것이 좋은가요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
그리드( <Col>, <Row>) 는 전체 레이아웃 잡을때만 사용하나요?
그리드( <Col>, <Row>) 는 전체 레이아웃 잡을때만 사용하나요?로그인폼을 생성할때는 <Col> 을 사용하지 않고 <div> 를 사용하셔서,그리드( <Col>, <Row>)를 사용하는 기준을 알고 싶습니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
데이터 수정에 대해 질문드립니다.
User 테이블이 아래와 같고,Post 테이블이 아래와 같을 때,DB의 내용은 바꾸지 않고, 제가 사용할 코드 상에서만 홍길동을 김민수로 바꾸고 싶습니다.이 때, 복사를 사용해야 할 지가 고민입니다.1.const post = await Post.findOne({ where: {id: 1}, include: [{ model:User }] }); const copyPost = {...post}; copyPost.name = "김민수"; 2.const post = await Post.findOne({ where: {id: 1}, include: [{ model:User }] }); post.name = "김민수"; 1번처럼 복사를 사용할까요 아니면2번처럼 post 식별자를 그냥 쓰되 post.save를 안하는 걸로 사용할까요? 만약 1번이 더 나은 해결책이라면 1번처럼 얕은 복사를 해야 하나요 아니면 깊은 복사를 해야 하나요? 조언 부탁드립니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
두 서버를 하나의 컴퓨터로 올리는방법
안녕하세요. 제로초님도메인 구매와 aws비용 문제로 하나의 컴퓨터로 배포를 진행하고 싶은데하나의 서버에서 front와 back 서버를 둘다 실행을 시켜놓으면 뒤늦게 킨 서버에서 에러가 발생을 하고있습니다.혹시 어떤식으로 진행을 해야 될까요?아니면 참고할만한 사이트가 있을까요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
pug 와 react 를 같이 사용시 시나리오가 궁금합니다.
express 라우트 -> pug (리액트가 포함된 js) -> React이런 시나리오 인가요?데이터는 pug 에서 React 로 전달이 가능한가요?아니면, React 에서 Fetch로 데이터를 받아오는 것인가요?
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
nextjs 13 버전 사용해도 되나요?
nextjs 13 버전 사용해도 되나요? 공지사항에서 12버전까지는 테스트가 되었다고 하신건 확인했습니다!
- 해결됨[리뉴얼] React로 NodeBird SNS 만들기
serverside 가 필요없다면, nextJS 보다 순수 react 가 더 좋은 가요?
admin 페이지의 경우 nextJS 보다 순수 react 가 더 좋은 가요?serverside 가 필요없다면, nextJS 가 더 불편한 가요?만약 불편하다면 어떤점이 불편한지 알고 싶습니다.
- 미해결[리뉴얼] React로 NodeBird SNS 만들기
webpack 관련 질문 좀 드리려고 합니다.
문제를 해결하기 전에 강의와 관련없는 질문이 인거 같아서 stack overflow에 물어보았으나 아직 답변이 없네요. webpack과 babel 환경에 대해서 몇일에 걸쳐서 내용을 보고 있으나 해결되지 않아 조언을 조금 구하고자 합니다..dev와 production 환경을 유심히 살펴보다 이상한점이 있어서 해결을 못하고 있습니다.답을 원하는것이 아니라.. 어디를 좀 더 유심히 봐야 할지만 지적만 좀 해주신 다면 그 부분에서 좀 더 내용을 찾아보고 싶습니다.webpack vs webpack-internal 의 차이점을 찾아보았으나 명확하게 이건 이럴때 나오는 의미다 라는 뜻 나와 있는 문서가 없는거 같습니다. 혹시 아시면 답변 좀 부탁드리겠습니다. 하나는 webpack + babel의 환경을 env 파일만 변경해서 빌드를 했으나 env.dev는 babel이 하위 문법으로 전환을 했고 env.production은 es6 문법을 그대로 사용하고 있습니다. 도대체 왜 차이가 나는지 전혀 이해가 되지 않아서 질문을 드리려합니다.2번의 경우 babel.config.js 설정도 명확하게 했고 webpack.config.js 설정도 env 환경이 local이 아닌경우에는 dev나 prd 환경이 똑같은 webpack 빌드를 타게했고 package.json의 명령어만 다른데 불구하고 다른 환경이 나오는 이유를 전혀 모르겠습니다..아래는 사진을 첨부해두었습니다.혹시나 코드를 잠깐 봐주실 수 있다면..https://stackoverflow.com/questions/74851479/vue-how-to-apply-babel-well-depending-on-the-environment제가 올린 질문인데 한번 봐주시면 감사하겠습니다.필요한 코드만 요약했습니다. devprodcution