많은 분들이 memo 기능 관련하여 문의 주신것 같은데 내용이 다 동일하네요.. 영상을 보면 변경 전/후 전부다 하이라이트가 표시가 되어서 리렌더링이 발생하는지 시각적으로 확인이 안됩니다. 문의 남기신 글에는 console.log로 확인을 하라고 하시는데.. 그럴것 같으면 강의 내용 자체가 바껴야 되는거 아닌가요?? 이 부분이랑 context 설명하는 부분도 마찬가지인데요.. context 설명할때 onUpdate, onDelete, onCreate는 useCallback을 사용하여 재생성을 방지하게 이미 설정되어있는데, 왜 memo 기능을 써야하나요?? 이 부분도 설명할때 화면상에 하이라이트가 전과 후 다 발생하는데.. 강사님 혼자 뭐 없어진거 확인하는데..화면상으로 전혀 확인이 안되는데.. 혼자 진행하시니 혼란스럽네요.. 확실하게 딱 표시가 나는게 아니라면 그에 대한 설명이 있어야 하지 않을까 싶습니다.

안녕하세요.컴포넌트 최적화 하는 부분에서 질문있습니다. 10.3강에서 대략 5분 40초쯤에 Header 컴포넌트에 memo 기능을 사용해서 최적화 한 뒤에, 체크박스를 클릭하면서 헤더 컴포넌트가 리렌더링이 일어났는지에 대해 확인하는 부분이 있습니다. 질문사항은 memo 기능을 통해 최적화를 하던 안하던 개발자 도구에서 Header 컴포넌트가 항상 리렌더링이 일어나는것 같은데 어떻게된걸까요? 헤더부분이 계속 노란색으로 뜨면 리렌더링이 일어났다는걸로 보이는데 강의 영상에서도 다른 컴포넌트와 동일하게 노란색으로 변경됩니다. 강의에서 TodoItem을 커스텀한 부분은 강의대로 적용됐습니다.(이부분은 리렌더링이 발생하지 않습니다.)

강의 재밌게 잘 들었습니다!다름아니오라 감정 일기장 실습 중 section12에서 궁금한 것이 생겼습니다생성된 일기를 삭제하면 "일기를 정말 삭제할까요? 다시 복구되지 않아요!" 컨펌 다이얼로그가 나타나는 건 잘됩니다.근데 ok 버튼을 클릭하면 바로 home 페이지로 이동하지 않고"존재하지 않는 일기입니다."라는 얼럿 다이얼로그가 그 다음으로 뜨고나서 ok 버튼을 클릭해야 home 페이지로 이동하게 됩니다.올려주신 정환님의 깃헙 소스 파일을 다운받아 실행시키면 이런 문제는 발생하지 않아서 어디를 고쳐야할지 막막합니다.제 소스 코드는 링크에 달아두었습니다.답변해주셔서 감사합니다!

안녕하세요! 강의 잘 수강하고 있습니다.강사님 코드를 따라하면서 하고 있는데,사진처럼 eslint에서 context를 따로 파일로 분리하여 관리하는 것을 하는 경고 메시지가 떠서 질문 드립니다.그래서 제가 context를 분리하려고 구글링을 해봤는데 잘 되지 않아서 혹시 분리는 어떻게 하면 될지 질문드립니다!

제목이 곧 내용입니다

3분 40초node -vnpm -v 은 다 되는데 init y 는 안됩니다 ..

안녕하세요....강의를 한번 다 듣고 다시 복습을 해보려고 하는데 처음부터 막혀버리네요ㅠㅠnode 를 설치했고, 작업폴더를 만든후 VS CODE 에서 오픈폴더를 했습니다. 터미널창에서 npm init 을 실행해서 엔터를 쳐서 완료했구요,간단하게 문장넣고 확인하는 부분에서부터 나오지를 않아서요 ㅠㅠ아래 질문을 검색해보니 비슷한 질문이 있어서 찾아봤는데요,작업폴더명이 혹시나 한글이면 안되나 싶어서 영문으로도 해봤는데 똑같이 안되구요윈도우계정 이름도 한글이 아니고 영문입니다. 혹시 외장하드에서 하면 안되는걸까요?외장하드에서 한글폴더면이 혹시 안되는건지요....예를들어 외장하드>리액트>1-node 이런식이어서 안되는걸까요?  

현재 투두리스트 렌더링하기 강의에서 List 컴포넌트 부분에서 todos.map을 돌리고 TodoItem 컴포넌트에 {...todo}로 mockData에 있는 객체를 구조분해할당으로 풀어서 키를 props로 전달하는데 전달할때 보통 todo={...todo} 이렇게 보내지 않고 그냥 {...todo} 이렇게 앞에 todo= 이런식으로 작성하지 않은 이유가 뭔지 궁금합니다.

build 할때는 별 문제없이 build 가 되었는데, vercel 에서 배포할때 문제가 발생했습니다. 에러는 import 시 오탈자 문제로, 직접 로그를 분석하여 해결했는데요. 궁금한점은 빌드 시에는 별 문제없었는데, 배포환경에서는 왜 문제가 발생하여 정상적으로 진행이 안되었는지가 궁금합니다.  항상 좋은 강의 감사합니다.

포트폴리오 강의를 보다가 질문이 생겼습니다.defaultValue 와 value 의 차이가 defaultValue 는 기존값이 수정되고, value 는 수정이 안된다는 것 뿐인가요? 그렇다면 value 는 값을 수정할 수 없으므로 readOnly 라는 코드를 빼도 되는것 아닌가요?그리고 아래의 코드는 삼항연산자로 되어 있는데 (props.address !=="" ) 이 거짓일때는 게시물 수정할 때를 의미하는것이 맞나요?제가 정확히 이해하고 있는지 의심이 들어서 질문 올립니다!그리고 BoardCommentWrite.presenter컴포넌트에서 value={props.writer} 라고 되어 있는데 defaultValue={props.writer} 라고 되어도 문제 없는게 맞나요? <S.Input placeholder="작성자" onChange={props.onChangeWriter} value={props.writer} /> <S.Address readOnly value={ props.address !== "" ? props.address : props.data?.fetchBoard.boardAddress?.address ?? "" } />

eslint 설치할 때 3개 중에 마지막 3번째 선택지가 없어서 수업질문 참고해서 yarn add eslint@8.0.1 설치를 하였습니다. 그다음에 npx eslint --init를 했는데 마지막에 강사님화면에서는 Would you like to install them now? · No / Yes 이렇게 되어있고 여기서 yes하면 Which package manager do you want to use? npm yarn pnpm 이런식으로 뜨는데 저는 Would you like to install them now with npm? · No / Yes 이렇게 바로 떠서 yes를 누르면 바로 설치가 됩니다.(no 눌려도 그냥 설치돼요) 근데 설치하고 나면 이런 사진과 같은 오류가 떠요 안되는 경우 방법으로 1. yarn.lock, node_modules, .eslintrc.js 파일을 지워주시고,2. 다시 한 번 위의 순서로 eslint를 설치해 주세요! 이것도 다 따라했는데 계속 똑같아요  지피티한테 물어보니까주요 경고 및 문제:package-lock.json 감지 경고프로젝트에 yarn.lock과 package-lock.json이 동시에 존재합니다. Yarn과 npm을 섞어 사용하면 의존성 문제나 충돌이 발생할 수 있으므로, 하나의 패키지 매니저만 사용하는 것이 좋습니다.해결책: package-lock.json 파일을 삭제하고 Yarn을 계속 사용하거나, 반대로 Yarn을 포기하고 npm을 사용하세요.의존성 경고 (peer dependency 불일치)예를 들어, @typescript-eslint/eslint-plugin이 eslint 버전 8.57.0 이상을 요구하지만 현재 설치된 버전은 8.0.1입니다.해결책: 경고를 무시하지 않고, 요구 사항에 맞는 최신 버전을 설치하세요 yarn add eslint@^8.57.0eslint@8.0.1 버전 경고설치된 eslint 버전 8.0.1은 더 이상 지원되지 않는 버전입니다. 최신 버전으로 업그레이드하세요.해결책yarn add eslint@latest의존성 중 사용 중단된 모듈예를 들어, glob@7.2.3과 inflight@1.0.6이 더 이상 지원되지 않습니다.이는 주로 간접 의존성에서 발생하며, 해당 모듈의 최신 버전으로 업데이트하거나, 의존성을 최신으로 맞춰야 할 수 있습니다.이런식으로 알려주는데 뭐 아무거나 못건들겠어요 잘못될 것같아서 뭐가 잘못된걸까요 ?

안녕하세요 리액트 부분에 대해 강의를 듣다가 vite라는 내용이 나오던데 이 vite를 설치하니 src나 index.html 등등 여러 파일들이 설치가 되고 src폴더에서는 App.tsx 파일명으로 나오더라구요. 여기서 조금 헷갈리는 것이 npx create-react-app 설치와 비슷한데 이 vite는 정확히 무엇이고 또 npx create-react-app 이 부분과 다른건지도 궁금합니다.

PS C:\Users\jjoob\myfirstmap\myfirstmap> nodemon ./bin/www[nodemon] 3.1.7[nodemon] to restart at any time, enter rs[nodemon] watching path(s): .[nodemon] watching extensions: js,mjs,cjs,json[nodemon] starting node ./bin/wwwnode:internal/modules/cjs/loader:1252 throw err; ^Error: Cannot find module 'morgan'Require stack:- C:\Users\jjoob\myfirstmap\myfirstmap\app.js- C:\Users\jjoob\myfirstmap\myfirstmap\bin\www at Function._resolveFilename (node:internal/modules/cjs/loader:1249:15) at Function._load (node:internal/modules/cjs/loader:1075:27) at TracingChannel.traceSync (node:diagnostics_channel:315:14) at wrapModuleLoad (node:internal/modules/cjs/loader:218:24) at Module.require (node:internal/modules/cjs/loader:1340:12) at require (node:internal/modules/helpers:141:16) at Object.<anonymous> (C:\Users\jjoob\myfirstmap\myfirstmap\app.js:5:14) at Module._compile (node:internal/modules/cjs/loader:1546:14) at Object..js (node:internal/modules/cjs/loader:1689:10) at Module.load (node:internal/modules/cjs/loader:1318:32) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\\Users\\jjoob\\myfirstmap\\myfirstmap\\app.js', 'C:\\Users\\jjoob\\myfirstmap\\myfirstmap\\bin\\www' ]}Node.js v22.11.0[nodemon] app crashed - waiting for file changes before starting...PS C:\Users\jjoob\myfirstmap\myfirstmap>  다 지우고 처음부터 다시 실행해봐도 계속 같은 오류이고localhost:3000 실행하면 흠… 이 페이지에 연결할 수 없습니다.localhost이(가) 연결을 거부했습니다. 이렇게 나오네요 ㅠ (nodemon ./bin/www 입력 시 오류)

안녕하세요 피그마 접속 하려고 하는데 이런 팝업창이 뜨면서 안열립니다..구글검색 후 webGL 설정하는 것 까지 해보았는데 안열리네요 ㅠㅠ

yarn add --dev husky 명령어를 사용후,npx husky install 명령어를 사용했는데 husky - install command is DEPRECATED 라는 오류가 계속해서 발생합니다. .git도 생성되어 있는데 어떻게 해결해야할지 모르겠어서 질문합니다

checkbox를 클릭할 때 아래와 같은 오류가 발생합니다.코드는 동일하게 작성한 것 같은데 원인이 무었일까요? 

🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 이 계층 구조 화면에서 TodoStateContext.Provider 컴포넌트와 TodoDispatchContext.Provider는 동등한 위치에 있는 것인가요? 아니면 화살표대로 TodoStateContext.Provider 컴포넌트의 자식 컴포넌트가 TodoDispatchContext.Provider 컴포넌트 인건가요?

질문은 자세하게 적어주실 수록 좋습니다. 어느 부분을 수강중이신지 -> bmi 계산기 프로그램 완성하기 내가 어떻게 했는데, 어떤 결과가 나오기를 기대했는데, 다른 결과가 나왔는지 -> 노션의 코드들을 다 복사해서 붙여넣기 했는데 homepage 영역이 안나옵니다작성하신 코드 및 오류 스크린샷 을 함께 첨부해주시면 좋아요!

 Vue CLI v5.0.8✨ Creating project in /Users/yeji/Desktop/2-17__/myfirestvuewapp.⚙ Installing CLI plugins. This might take a while...npm error code EACCESnpm error syscall opennpm error path /Users/yeji/.npm/_cacache/tmp/e7f990dfnpm error errno EACCESnpm errornpm error Your cache folder contains root-owned files, due to a bug innpm error previous versions of npm which has since been addressed.npm errornpm error To permanently fix this problem, please run:npm error sudo chown -R 501:20 "/Users/yeji/.npm"npm error Log files were not written due to an error writing to the directory: /Users/yeji/.npm/_logsnpm error You can rerun the command with --loglevel=verbose to see the logs in your terminalERROR Error: command failed: npm install --loglevel error --legacy-peer-depsError: command failed: npm install --loglevel error --legacy-peer-depsat ChildProcess.<anonymous> (/usr/local/lib/node_modules/@vue/cli/lib/util/executeCommand.js:138:16)at ChildProcess.emit (node:events:518:28)at maybeClose (node:internal/child_process:1104:16)at ChildProcess._handle.onexit (node:internal/child_process:304:5)yeji@gim-yejiui-MacBookPro 2-17__ % sudo npm i -g @vue/cli;2A

두 함수의 차이는 해당 메시지를 발행하는 client 를 포함하고 않하고로 알고 있습니다. 그럴때 socket.emit('user_conneted', username);다음 코드를 통해서도 상대방에게 보여진다고 생각했는데 실제로는 메시지 발행 client 의 console에만 나오는 것을 확인했습니다. 왜 상대방쪽의 console에서는 메시지가 보이지 않는지 궁금합니다