묻고 답해요
167만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
npm run dev 실행 오류
npm run dev 로 server.ts 실행시, 에러가 발생합니다.찾아보니, db 연결 시 인증에 관련된 오류 같은데... 어떻게 해야할지 잘 모르겠습니다.오타 꼼꼼히 확인하고 docker-compose도 다시 실행 해봤는데 해결이 되지 않네요.제가 수업 듣기 전에 pg-admin을 설치했었는데, 그것과 관련 있는 걸까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
error An unexpected error occurred: "/Users/leejeonghun/Desktop/ ... /class/package.json: Unexpected token } in JSON at position 670".
멘토님 안녕하세요,1) 웹페이지를 실행시키는 yarn dev 명령어를 입력했을때, 페이위 제목과 같은 에러가 떴는데 무엇이 문제일까요? 2) 인덱스와 홈.모듈.css 두 창을 비교 설명하시는 과정에서 강의 그대로 따라 했는데 저의 홈.모듈 창에는 title 이 아얘 뜨지 않았습니다. 이 경우는 혹시 제가 모르는 사이 리액트 17이 아니라 18이 깔려있어서 그런걸까요? 아니면 다른 문제일까요? (분명 리액트 17.0.2?로 수정해서 저장하고서 설치했었는데요ㅜㅜ)
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
우분투에서 작업시 윈도우로 mysql 설치하는 것에 관해서
제로초쌤 제가 우분투에서 Nodebird를 진행하고 있는데 더북에 써져있는 거처럼 리눅스(우분투)에서 설치하는 방법 그대로 설치하다가 Can't connect to local MySQL server through socket '/var/run/mysqld/mysqld.sock' (13) 소켓 에러가 계속 나서 해결하려고 인터넷에 찾아보면서 따라하고 있는데 해결이 안되서 혹시 윈도우로 mysql설치해서 진행해도 크게 차이가 없을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
props.data?.fetchBoard?.writer 와 props.data?.fetchBoard.writer 차이
BoardDetail.presenter.js 파일에서 데이터 가져올 때,props.data?.fetchBoard?.writer로 가져오시는 데,props.data?.fetchBoard.writer로 해도 오류 안 나고 잘 작동하는데 한 번 더 ?를 사용해서 확인하는 이유가 궁금합니다!
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
Error: error: Unexpected token `< (jsx tag start)`
수업 자료와 똑같이 코딩을 하였는데도 불구하고 해당 페이지로 접속을 하면 위와같은 오류가 출력됩니다. 무슨문제인지 알 수 있을까요..? ㅜㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
_app.js 수정 이후 오류
위와 같이 수정하고 난 후 yarn dev로 실행시켰는데 버튼이 안나옵니다..ㅠㅠ뭐가 문제인지 모르겠습니다
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
getStaticProps.tsx 에서 getStaticProps함수 질문
안녕하세요!getStaticProps.tsx 에서 데이터 모킹에 사용하는 getStaticProps함수에서 질문입니다.getStaticProps함수에서 return 하는 props 값과 위에 있는 Example 함수가 어떻게 연결이 되는지 궁금합니다. export 가 그 기능을 하는거 같은데(export를 지우니 연동이 안되는거 같아서...) import 문도 따로 없는데 이게 어떻게 가능한가요 ???
-
해결됨Next.js 시작하기(feat. 지도 서비스 개발)
getStaticProps.tsx 의 회색 표시
안녕하세요! 현재 강의 내용을 따라 학습을 재밌게 진행하고 있습니다.회색 네모난 표시의 정체를 알 수 있을까요 ???data 옆에 있는 ': number'(resolve) 옆에 있는 'executor:' 등등등 ...
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
"Error: The default export is not a React Component in page: "/qqq"
정확하게 같게 했는데 이게 왜이런지 모르겠습니다 host3000 패이지는 잘나옵니다
-
미해결[리뉴얼] React로 NodeBird SNS 만들기
reduxjs/toolkit 에서 loadPost 한번만 가게하기
제로초쌤 강의를 들으면서 redux, redux-saga로 작성하신걸 깃헙 소스코드 참고하고 스스로 해보면서 toolkit으로 변환하면서 해보고 있는데 toolkit에서는 따로 한번만 요청이 가게 할 수 없나요..?제 코드 첨부하겠습니다<pages > index.js> useEffect(() => { function onScroll(){ console.log(window.scrollY, document.documentElement.clientHeight, document.documentElement.scrollHeight); if(window.scrollY + document.documentElement.clientHeight > document.documentElement.scrollHeight - 300){ if(hasMorePosts && !loadPostsLoading){ dispatch(loadPost(10)); console.log(loadPostsLoading); } } } window.addEventListener('scroll', onScroll); return () => { window.removeEventListener('scroll', onScroll); } }, [hasMorePosts])<actions > post.js>export const loadPost = createAsyncThunk('post/loadPosts' , async (data , thunkAPI) => { try{ const result = await delay(getDummyPost(data), 1000); return result; } catch(error){ console.log(error); } }); <reducers > postSlice.js> .addCase(loadPost.pending, (state, action) => { state.loadPostsLoading = true; state.loadPostsDone = false; state.loadPostsError = null; }) .addCase(loadPost.fulfilled, (state, action) => { state.loadPostsLoading = false; state.loadPostsDone = true; state.mainPosts = action.payload.concat(state.mainPosts); state.hasMorePosts = action.payload.length < 100; }) .addCase(loadPost.rejected, (state, action) => { state.loadPostsLoading = false; state.loadPostsError = action.error; })
-
미해결따라하며 배우는 리액트 A-Z[19버전 반영]
[React.memo] useState의 setState는 변경되지 않는가요?
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. React.memo로 렌더링 최적화 강의를 듣다가 질문이 생겼습니다.React.memo는 props가 변하지 않으면 다시 렌더링 하지 않는다고 알고 있는데요. App.js에서 useState의 결과물인 setState(setTodoData 등)가 List.js의 props로 내려가는데, 이는 변화로 보지 않는 것으로 보았습니다.아래의 단순화된 useState의 구현을 보면 useState로 나온 state는 클로저를 통해 값이 변경되지 않으면 useState가 같은 값?참조?를 내려주는 것 같은데, setState는 매번 새로 생성되어 참조가 바뀔 것 같다는 생각을 하였습니다. 그래서 React.memo가 매번 새로 생성되는 setState를 보고 props가 바뀌는 것으로 인식하여 렌더링을 해주어야 하지 않을까 했는데... 실제로는 그렇지 않더라고요물론 단순화된 구현이고 실제 리액트의 구현은 복잡한 과정을 거쳐 같은 참조를 내려줄 것 같다고 생각이 드는데요.이 마법같은 과정이나 원리, 키워드에 대해서 아무리 찾아도 찾을 수가 없어서 도움을 청하고자 질문을 남깁니다...감사합니다. const MyReact = (function() { let _val // hold our state in module scope return { render(Component) { const Comp = Component() Comp.render() return Comp }, useState(initialValue) { _val = _val || initialValue function setState(newVal) { _val = newVal } return [_val, setState] } } })()출처: https://medium.com/hcleedev/web-usestate%EC%9D%98-%EB%8F%99%EC%9E%91-%EC%9B%90%EB%A6%AC%EC%99%80-%ED%95%A8%EC%A0%95-7b4825c16b9
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
맥 nodejs를 lts버전으로 설치하는데 다른설치가 완료되기를 기다리는중 이라면서 계속 설치가안됩니다.
저는 일전에 윈도우에서도 nodejs를 사용했었는데 지금 맥으로 넘어왔는데 계속 설치단계에서 다른 설치가 완료되기를 기다리는중이라면서 설치가 안됩니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
반응형으로 만드는 방법
열심히 수업을 들으면서 포트폴리오도 따라서 해보는 중인 수강생입니다.게시판 포트폴리오에서 반응형으로 바꾸는 건 수업에 없나요?(강사님이 올려주시는 포트폴리오 예시(?) 답지(?)를 적용해도 반응형은 아니더라구요)@media 쿼리로 적용하는 방법 ( emotion으로 반응형 만드는 방법)을 구글링 해보아도적용하는 방법을 모르겠습니다ㅠ뒤에 수업에 있는 건가요? 아니면 제가 따로 해야하는건가요?구글링해도 쉽지가 않아서 질문 남기는거라... 자세한 답변 부탁드리겠습니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
안녕하세요 게시판 섹션1 포트폴리오 관련 질문 있습니다.
강사님 안녕하세요.소주제 - 이모션까지 강의를 보고 복습, 퀴즈를 진행한 뒤 피그마를 참고하여 포트폴리오1 게시판을 만들었습니다.등록하기 버튼까지 다 만들고 부족한 부분은 리뷰 강의를 본 후에 강사님 코드를 참고하여 틀린 부분들을 고치면서 보강했습니다.그런데 코드를 참고하여 틀린 부분들을 다 고쳤다고 생각했는데 딱 두군데가 맞지 않아서 몇 시간 동안 원인을 못 찾고 있어, 문의를 드립니다.제가 노란색으로 표시한 두 부분이 튀어나왔는데 저 부분은 몇 시간 동안 찾아보고 비교해봐도 왜 저런지를 모르겠어서 최후의 수단으로 강사님 index.js랑 emotion.js 코드를 전부 복붙해봤는데도 저 두 곳이 튀어나온 상태에서 바뀌질 않습니다. 버전 때문에 그런가 해서 버전 다시 맞추고 yarn install 해봐도 똑같습니다 ㅠㅠ(그런데 강사님 git 코드를 clone 한걸 실행하면 정상적으로 랜더링 됩니다)강사님의 index, emotion 코드를 붙여 넣어봐도 저 상태인거 보면 코드가 아니라 어디쪽 문제일까요..?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
vscode 확장 어떤거 사용하시나요?
vscode 강의랑 맞출려고하는데 확장 어떤거 사용하셨을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
리액트 안에 gql 적용시 설치 패키지 질문
질문1 리액트에 gql 적용시 영상과다르게 아래와같이 단색으로 프로그래밍 됩니다어떤 패키지를 적용해야 할까요?
-
미해결따라하며 배우는 리액트 A-Z[19버전 반영]
도커 포트
안녕하세요, react 도커파일 작성 및 docker run을 해줬는데요, (port 10001:10001) localhost:10001이 들어가지지 않는데,, 별도의 설정이 필요할까요?
-
미해결만들면서 배우는 프론트엔드 DO IT 코딩 (Next.js, Typescript)
1월 21일까지 수강기간인데
안녕하세요. 1월 21일까지 수강기간인데 제가 한번더 총체적으로 살펴보길 소망해서요.혹시 수강기간을 연장해주실 수 있을까요?보통 무제한 수강인줄알고 구매를 했었는데 수강기간이 제한이 있는줄 늦게 알게 되었습니다. ㅠ
-
미해결만들면서 배우는 프론트엔드 DO IT 코딩 (Next.js, Typescript)
Module not found: Can't resolve 'fs' 오류
제선에서 할 수 있는 방법은 다 해본거 같은데 모르겠습니다..config 수정node v 18- >14 fs오류때문에 강의 진행이 안되고있습니다 ㅠ 해결방법이 무엇일까요
-
미해결[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
playground api-docs 질문
playground에서 api-docs가 강의에 있는 docs랑 다릅니다 같게 할 방법이 있을까요?