inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

React.memo 를 TodoItem 에 적용하는 부분에서 질문 있습니다.

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

const TodoItem = ({ id, isDone, content, date, onUpdate, onDelete }) => { const onChangeCheckbox = () => { onUpdate(id); }; const onClickDeleteButton = () => { onDelete(id); }; return ( <div className="TodoItem"> <input onChange={onChangeCheckbox} type="checkbox" checked={isDone} /> <div className="content">{content}</div> <div className="date">{new Date(date).toLocaleDateString()}</div> <button onClick={onClickDeleteButton}>삭제</button> </div> ); }; export default memo(TodoItem, (prevProps, nextProps) => { // 반환값에 따라, Props가 바뀌었는지 안바뀌었는지 판단 // T -> Props 바뀌지 않음 -> 리렌더링 X // F -> Props 바뀜 -> 리렌더링 O if (prevProps.id !== nextProps.id) return false; if (prevProps.isDone !== nextProps.isDone) return false; if (prevProps.content !== nextProps.content) return false; if (prevProps.date !== nextProps.date) return false; return true; }); TodoItem 의 props 에 함수(객체 타입의 값)을 받고 있어서 export default memo(TodoItem); 이렇게만 적용할 경우 리렌더링 시, 함수를 새로운 객체로 인식해서 TodoItem 컴포넌트 입장에서는 props가 바뀌었다고 인식한다는 거 까지는 이해가 됐습니다. 근데 memo 의 두 번째 인수에서 if (prevProps.id !== nextProps.id) return false; if (prevProps.isDone !== nextProps.isDone) return false; if (prevProps.content !== nextProps.content) return false; if (prevProps.date !== nextProps.date) return false; 이렇게만 비교하면 결국 onUpdate, onDelete 는 비교를 하지 않은거같은데 왜 동작이 잘 되는지 모르겠습니다. true 값을 반환해주면 함수는 변하지 않았다고 정해주는 걸까요?

  • javascript
  • react
  • node.js
  • 카카오공채-개발
XEMI 댓글 2 좋아요 0 조회수 86

톡투피그마 mcp 연결이 안돼요 ㅠㅠ

해결됨

[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)

톡투피그마 mcp 연결이 안돼요 ㅠㅠ 노란불 들어오다가 결국 빨간불 들어옵니다 윈도우라 개발 환경이 다른걸까요?

  • react
  • next.js
  • cursor
  • 프롬프트엔지니어링
  • 바이브코딩
한시현 댓글 2 좋아요 0 조회수 260

강의 내 문제 자료 다운로드 가능 여부

해결됨

(2026 최신!) 일주일만에 합격하는 정보처리기사 실기

안녕하세요 강의를 들으면서 첨부자료 없는 강의에 대해서 질문이 있습니다. 문제 풀이해주실 때 코드가 보이는데 현재 수기로 종이에 적고 있는 상황입니다. 강의별로 코드가 적힌 파일 같은 것이 있는지와 다운로드할 수 있는 방법이 있는지 궁금합니다.

  • python
  • java
  • c
  • 정보처리기사
dhkdxo12 댓글 2 좋아요 0 조회수 105

깃은 어떻게 하나요?

해결됨

[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)

개발 초보인데url로 배포해서 결과물 보고 싶은데 초보라 모르겠습니다

  • react
  • next.js
  • cursor
  • 프롬프트엔지니어링
  • 바이브코딩
한시현 댓글 2 좋아요 0 조회수 114

GPT 선택 시 라이센스 문제

미해결

[입문반] 핵심 파이썬 with Cursor

안녕하세요. Model gpt-5로 선택 후 실행시 OpenAI's latest models are currently only available to paid users. Please upgrade to a paid plan to use these models. (Request ID: 2f102854-7cab-45e9-863a-d3ac250fbc88 라이센스 오류가 뜹니다. 그리고 Auto로 할시에는 영문으로 답변 합니다. 해결방법 있을까요?

  • python
  • cursor
  • 인공지능(ai)
  • chatgpt
최범준 댓글 2 좋아요 0 조회수 162

자주 활용되는 파이썬 예제중 평균 함수에 대한 질문입니다

해결됨

[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)

올려주신 원본 코랩 자료에서 시행할 때는 문제없이 나오는데 사본으로 직접 제가 작성하였을 때는 다음과 같은 오류 메시지가 뜹니다. 수업을 그대로 따라가면서 작성하였는데, 혹시 추가로 제가 빠트린 부분이 있는 건가요?

  • python
  • 머신러닝
  • 빅데이터
  • pandas
  • 빅데이터분석기사
jisoobin2000 댓글 2 좋아요 0 조회수 63

생성한 newTodo 객체를 setTodos 를 이용해 추가하는 부분에서 질문 있습니다

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

const onCreate = (content) => { const newTodo = { id: idRef.current++, isDone: false, content: content, date: new Date().getTime(), }; setTodos([newTodo, ...todos]); }; 지금처럼 이렇게 newTodo 를 todos 배열의 맨 앞에 붙이면 원래 기존의 todos 요소 전체의 인덱스가 변화해야해서 동작시간이 오래 걸린다고 앞의 수업에서 들었던 것 같아서 왜 이렇게 하는지 의문이 들었습니다. 이렇게 해야 나중에 등록한 newTodo 객체가 맨 위로 올라오게 되어서 그런건가요?

  • javascript
  • react
  • node.js
XEMI 댓글 3 좋아요 0 조회수 92

18. 작업형1 모의문제 1 문제 3번에서

미해결

[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)

이런식으로 133 아래에 지저분한 수식이 붙는데 왜 그런걸까요?

  • python
  • 머신러닝
  • 빅데이터
  • pandas
  • 빅데이터분석기사
pseoin0907 댓글 2 좋아요 0 조회수 46

빈 문서를 새로 열때는 팝업이 안나오는데 기존 문서를 열면 팝업이 나옵니다

해결됨

직장인에게 꼭 필요한 파이썬-아래아한글 자동화 레시피

섹션 1-5 한/글 파일 불러올때 팝업 안뜨게하기 알려주신 방법대로 코딩하여 실행해보면 빈 문서가 실행 될 때는 팝업이 안나오는데 기존에 가지고 있는 한글 문서를 실행하게되면 계속 경고 팝업창이 뜹니다 ㅠㅠㅠ 왜 이러는건지 파일 명도 확인해보고 코드도 정확히 작성한 것 같은데 왜 안될까요 ㅠㅠㅠㅠ 참고로 한글은 2018 버전 사용중입니다

  • python
  • 한컴오피스
댓글 2 좋아요 1 조회수 166

이미지 생성 참조 툴 문의

해결됨

(2025) MBTI 테스트 기반 수익형 웹사이트 만들기 - <코딩 배워 사업하자>

안녕하세요. 강사님! 좋은 강의 정말 감사드립니다!! 한가지 여쭙고 싶은게 있는데, 이미지 생성 툴을 어떤걸 쓰시지는 문의드려도 될까요? 텍스트 처리는 어떻게 진행하시는지 문의드려도 될까요? 수업은 대충 다 들었는데, 이미지 제작에 어려움을 겪고 있어서 문의 드립니다. 혹시 공유 가능하시면 공유 부탁드리겠습니다. 이상입니다. 감사합니다. :)

  • react
  • aws
  • Google-Analytics
  • cloudflare
  • adsense
  • 수익화
ted 댓글 2 좋아요 0 조회수 124

현재 버전과 맞지 않습니다.

해결됨

[Live 챌린지] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)

위 내용대로 하면 될까요? 업데이트 반영 부탁드립니다.

  • react
  • next.js
  • cursor
  • 프롬프트엔지니어링
  • 바이브코딩
박병조 댓글 1 좋아요 0 조회수 97

룰 적용이 계속 안되는것 같아요

해결됨

[Live 챌린지] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)

뒤의 강의대로 구현하다보면 룰적용이 항상 안되서 봤는데 위 이미지처럼 나옵니다. 조건-커서룰 적용이 왜 안되는지 궁금합니다.

  • react
  • next.js
  • cursor
  • 프롬프트엔지니어링
  • 바이브코딩
박병조 댓글 1 좋아요 0 조회수 108

Components 와 Profiler 탭이 나오지 않습니다.

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

크롬에서 추가하고 설정 다 따라서 했는데 components 탭이 나오지 않습니다...

  • javascript
  • react
  • node.js
  • 카카오공채-개발
XEMI 댓글 3 좋아요 0 조회수 171

global-error에서는 window.location.refresh()를 쓰면될까요

해결됨

한 입 크기로 잘라먹는 Next.js

라우트 그룹의 경로에 에러가 안나오고 레이아웃의 footer에서 걸려서 아래 질답글을 보고 글로벌에 연습해보고 있는데요. 해당 에러가 발생해서 ai에 물어보니 아래와 같이 답변하는데 ai의 답변이 정확할까요? section04\src\app\global-error.tsx:16 Uncaught TypeError: reset is not a function ai: global-error.tsx 에서 reset 이 동작하지 않는 이유는 Next.js의 알려진 버그 때문입니다. error.tsx 에서는 reset() 함수가 정상적으로 작동하지만, global-error.tsx 에서는 reset() 호출 시 내부적으로 parallelRoutes.get 을 호출하려다가 parallelRoutes 가 null 이어서 "Cannot read properties of null (reading 'get')" 에러가 발생합니다.​ 문제 원인 global-error.tsx 는 루트 레이아웃 전체를 대체 하는 특수한 에러 바운더리이기 때문에, 일반 error.tsx 와 달리 내부 라우터 상태를 제대로 복구하지 못하는 구조적 한계가 있습니다. Next.js 팀에서도 이 문제를 인지하고 있으며 여러 canary 버전에서 수정을 시도했지만, 최신 버전까지도 완전히 해결되지 않은 상태입니다.​ 해결 방법 global-error.tsx 에서는 reset() 대신 router.refresh() 만 사용 하거나, 아예 페이지 새로고침 ( window.location.reload() )을 사용하는 것이 권장됩니다. 코드를 다음과 같이 수정하세요

  • react
  • typescript
  • next.js
  • 카카오공채-개발
sbbt 댓글 1 좋아요 0 조회수 92

리액트 웹뷰 관련 문의

미해결

타입스크립트로 배우는 리액트(React.js) : 기초부터 최신 기술까지 완벽하게

안녕하세요 수코딩님! 강의 외적으로 궁금한 사항이 있습니다! 다름이 아니라, 혼자 회사에서 프로젝트를 진행하고 있는 상황에, 지그재그 같은 사이트를 보면 웹뷰를 이용하고 있지 않나 싶은데, 왜 이렇게 앱 화면처럼 화면을 잘라서 처리를 한걸까요?

  • react
  • zustand
  • react.js
Lee HI 댓글 1 좋아요 0 조회수 64

교재 작업형1 연습문제 24,25번

해결됨

[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)

24번 # 사용자별로 주문 거리의 합계와 평균 계산 df_distance = df.groupby('user')['거리'].sum() # 주문 거리의 합계가 50km 이상인 사용자만 필터링 cond = df_distance >= 50 df_distance = df_distance[cond] 25번 # 1회 이하 주문 제외 cond1 = time_interval>0 m = time_interval[cond1].mean() 선생님, 위 두 문제에서 df_distance 와 time_interval은 단순히 변수인가요? 그 뒤에 cond를 붙여준 것의 의미를 모르겠어요..변수에 변수를 합한 건가요? 교재 예시에 많이 나오는 df= df[cond] 코드는 cond변수 값을 df파일에 저장한다는 건가요? cond는 조건식에서만 사용하는 거죠? 그리고 25번 문제에서 시간간격이 1일 이하인 사용자 제외니까 time_intreval >0이 아니라 1인데 오류인거 같습니다.

  • python
  • 머신러닝
  • 빅데이터
  • pandas
  • 빅데이터분석기사
audreyjy 댓글 2 좋아요 0 조회수 77

섹션2 10, 11, 12강 강의자료

해결됨

(2026 최신!) 일주일만에 합격하는 정보처리기사 실기

다른 분이 올리신 qna에서 섹션2 10,11,12 강의자료 업로드 하신다고 하셨는데 아직 별도로 되어있지 않아서 문의 드립니다 강의에 사용하셨던 파일 제공 가능한지 궁금합니다

  • python
  • java
  • c
  • 정보처리기사
hoskt092 댓글 2 좋아요 0 조회수 48

폰트 css url 링크

미해결

다양한 프레임워크로 구축하는 포트폴리오 사이트 개발 마스터 클래스

fonts.css의 폰트 url 링크가 변경된거 같습니다. 최신화 업데이트 요청드립니다.

  • vue.js
  • react
  • 포트폴리오
  • next.js
  • vitejs
한상호 댓글 1 좋아요 0 조회수 64

cursorTalkToFigmaMcp 사용방법

해결됨

[Live 챌린지] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)

피그마 mcp 사용방법 따로 가이드 없을까요..? 커서에서도 뭔가 mcp툴을 설치해줘야하는것같고 bun을 설치해서 피그마에서 나오는 스크립트를 실행시켜줘야 커넥션이 생기는것같은데. 강의를 보고 따라했는데 실제로 figma랑 연결안하고 자동으로 타이포그라피랑 컬러를 생성하는것같아요..

  • react
  • next.js
  • cursor
  • 프롬프트엔지니어링
  • 바이브코딩
콜라중독 댓글 2 좋아요 0 조회수 174

logout 태그 관련 질문

미해결

FastAPI 완벽 가이드

navbar.html에서 로그아웃 버튼을 생성 할 때 기존에 {% if session_user % } ... (1) {% else %} ... (2) {% endif %} 하고 이 아래 쪽에 다시 if session_user를 해서 로그아웃을 하는 이유가 무엇일까요? 그냥 (1) 위치에 a태그 달아서 로그아웃을 만들면 안될까요?

  • python
  • sql
  • sqlalchemy
  • FastAPI
열음 댓글 2 좋아요 0 조회수 79

인기 태그

인프런 TOP Writers

주간 인기글