inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

묻고 답해요

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

지금 이 화면에서 뭘로 fps를 알 수 있나요?

해결됨

DOM에서 픽셀까지, 브라우저 렌더링과 CRP 완전 정복 - [DOM 완전 정복 Part 3]

지금 이 화면에서 뭘로 fps를 알 수 있나요?

  • HTML/CSS
  • javascript
  • react
  • dom
  • frontend
ah young kim 댓글 2 좋아요 0 조회수 238

새일기쓰기하고 새로고침하면 새로쓴일기가 사라져요

미해결

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

🚨 필독) 질문하시기 전에 꼭 읽어주세요 (10초 소요) 제목을 구체적으로 작성해 주세요 ✅ 좋은 예 : 감정일기장 Home 구현중 xx 이슈가 발생합니다. ⛔ ️ 나쁜 예 : 이거 왜 안되나요?, 오류나요 도와주세요 등 비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요! 코드의 이슈는 전체 프로젝트를 "링크 형태"로 올려주셔야 원인을 파악할 수 있습니다. 깃허브, 구글드라이브 등의 수단을 통해 링크 형태로 전달해주세요 직접 실행해보며 원인을 파악해야 하기 때문에 텍스트 형태로 붙여넣는건 삼가해주세요 https://drive.google.com/drive/folders/1lRO0fOAae3cWJUtuNK7L5atrGTgFFRWO?usp=drive_link 답변이 도움이 되셨다면 답글 or 해결완료 버튼을 클릭해주세요 비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요! 제 답변이 여러분께 도움이 되었는지 저도 알고 싶어요 강의 내용에 궁금한 점이 있다면 몇 챕터의 몇 분 몇 초인지 알려주시면 더 좋아요 더 빠른 답변이 가능합니다!

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

context 강의 중 질문

해결됨

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

11.2 context 사용하기 강의 중에서 질문이 있습니다. 아직 context에 대해 이해를 잘 못하고 있는데 강의 중 10분쯤에 return 문에서 context를 사용하기 위해 이전에 작성해놓은 onUpdate, onDelete 함수를 지웠는데 TodoItem 에 todo도 context를 사용해서 지울 수 있는게 아닌 건지 질문드립니다. app.jsx에서 <List > 부분에서 todos를 지웠던 것처럼 가능한게 아닌지 궁금합니다 div className="todos_wrapper"> {filteredTodos.map((todo) => { // 필터링 된 값들이 나온다 필터링을 거치지 않으면 todos 데이터가 다 나옴 return <TodoItem key={todo.id} {...todo} />; })} </div>

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

동물앨범만들기 1-1 api 오류

해결됨

한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지

const API_URL = "https://animal-api-two.vercel.app/"; const getData = async () => { let res = await fetch(API_URL); try { if (res) { let data = await res.json(); console.log(data); } } catch (err) { console.log(err); } }; getData(); (확대) 다음과 같은 오류가 발생해서 강의 진행이 어렵습니다 이래저래 찾아봤는데 해결방법을 모르겠습니다 ㅜㅜ 답변 부탁드리겠습니다 감사합니다.

  • javascript
  • rest-api
  • spa
  • dom
김은수 댓글 2 좋아요 0 조회수 89

사고패턴 질문입니다.

미해결

[4주 과정] <클로드 코드> 완독 챌린지 : 매일 1시간씩 4주 동안 클로드 코드 도서 완독하기!

프롬프팅 전략과 사고패턴에서 cot, tot 등을 구분하여 사용할수 있는 방법이 궁금해요 마이크로서비스를 단계별로 분리해줘. 최적의 데이터베이스 설계를 찾아줘. api 엔드포인트를 구현하고 반복 개선해줘. 이런식으로 책에서 적힌 설명대로 사고패턴을 바꾸는 방법밖에 없는지? 명확한 기준이 있을까요? 사고패턴 변경방법이 궁금합니다

  • 업무-생산성
  • 인공지능(ai)
  • ai-활용-(ax)
  • claude
  • 바이브코딩
기쁜 앵무새 댓글 3 좋아요 0 조회수 127

prettier 이슈

해결됨

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

Prettier 이슈 관련한 Q&A 확인해서 default 설정이나 format on save도 체크했는데 강의에서 보여주신 것 처럼 가독성이 좋은 상태가 아니고 의미없다고 판단한 괄호나 줄넘김을 다 없애버려서 자꾸 이런식으로 코드가 줄어듭니다 ㅠㅠㅠ const Main = () => { const user = { name: "안넝", isLogin: -1, }; return <>{user.isLogin ? (<div>로그인</div>) : (<div>로그아웃</div>)}</>; }; export default Main;

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

hooks에서 commit 제한은 좀 힘들까요?

해결됨

The 10x AI-Native Developer: 회사에서 AI로 압도적 성과를 내는 법

1주차 hooks 강의 듣고 있는데, commit 전에 review를 하도록 하고 싶은데 실제로 해보니 되긴 되는데 좀 오락가락 해서요. 혹시 hooks matcher가 한정되어 있을까요? commit은 좀 의도랑 다르게 접근한거지 궁금하네요

  • spring-boot
  • next.js
  • 인공지능(ai)
  • ai-활용-(ax)
  • claude
젓인 댓글 3 좋아요 0 조회수 160

Next.js 시작하기 강의는 어떻게 무료로 받을수있나요??

해결됨

AI와 함께 배우는 Next.js

강의 시작에 앞서 Next.js 시작하기 강의를 먼저 듣고 시작하고 싶은데 무료로 어떻게 받을수있을까요?

  • javascript
  • react
  • next.js
  • cursor
  • 인공지능(ai)
musful 댓글 1 좋아요 1 조회수 178

섹션04 Layout에서 Mixed Layout파트의 실습 index.html파일 열었을때 선생님께서 보여주시는 가로스크롤이 안나타남.

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.03

안녕하세요. SCROLLTRIGGER-STARTED 폴더에 있는 4-5.Mixed Layout의 index.html 파일을 열어 section02의 horizontal 주석을 해제하고 보았을때 가로 스크롤이 안나타납니다. 제가 뭐 건드린 것은 특별히 없어서 finish폴더의 style.css파일과 비교하였는데도 가로 스크롤이 안나타납니다. 이상태에서 해당 강의 중 settings.js를 만져서 가로 스크롤이 안나타나도록 확인을 해야하는데 가로스크롤이 안나타난 상태에서 강의를 보면서 settings.js파일을 실습하기가 어려울것 같습니다.. 제가 뭘 잘못한게 있을까요?

  • javascript
  • 애니메이션
  • 인터랙티브-웹
  • gsap
  • scrolltrigger
미갱이 댓글 3 좋아요 0 조회수 128

질문드립니다.

해결됨

Cursor AI로 만들면서 배우는 Web & Javascript

정보처리기사 실기를 선생님과 함께 하고, 시험 합격에 이어서 이제 본격적으로 취업을 위한 저만의 프로젝트를 만들어 보겠다는 생각이 들었습니다. 마침 Cusor AI의 첫 개강 때 할인 이벤트가 있어서 저만의 첫 프로젝트를 시작하기 전에 이번 기회에 다시 한번 더 선생님과 함께 나아가고자 현재 선생님의 새로운 강의를 수강하고 있습니다. 그리고 어제 새벽에 처음 시작해서 정신을 차려 보니 지금 벌써 4강을 진입하는 상황이 되어버렸습니다.. 결론은 또 엄청난 강의를 만들어 주신 것 같습니다....! 이제 정말 질문인데요. 프론트 엔드의 영역이라 생각하고 지금 재미있게 공부 중에 있습니다만 백엔드나 전체적으로 다뤄서 풀스택 관련 강의 제작도 목표가 있으실지 해서 질문 남겨드립니다. 현재 독학으로 Spring을 공부 중에 있습니다만, 선생님의 자바 백엔드 수업도 있다면 재미있게 제가 원하는 개발을 이어나갈 수 있을 것 같아 조심스럽게 이 자리에 질문을 남겨드립니다. 아무쪼록 이번에도 놀랍고 대단한 몰입력을 유도하는 강의를 만들어 주셔서 정말 감사합니다. 정보처리기사 합격에 이어서 이번에는 선생님 강의를 듣고 취업 성공까지 힘내 보겠습니다!ㅎ (ps 시험 때문에 듣던 선생님의 ppt 자료가 이제는 시험이 아니라 재밌는 창작 같은 공부에 쓰이니까 모든 게 감회가 새롭네요ㅋㅋㅋ)

  • HTML/CSS
  • javascript
  • llm
  • ai-활용-(ax)
  • cursorai
최요한 댓글 2 좋아요 1 조회수 132

소스 코드 부탁드립니다~

해결됨

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

안녕하세요~ 강의 듣는데, 소스코드가 필요해서, 소스코드 보내주시면 감사하겠습니다~ sunshinew@naver.com

  • javascript
  • node.js
  • docker
  • rest-api
  • nestjs
김주원 댓글 2 좋아요 0 조회수 130

사고패턴 바꾸기

미해결

[4주 과정] <클로드 코드> 완독 챌린지 : 매일 1시간씩 4주 동안 클로드 코드 도서 완독하기!

프롬프팅 전략과 사고패턴에서 cot, tot 등을 구분하여 사용할수 있는 방법이 궁금해요 마이크로서비스를 단계별로 분리해줘. 최적의 데이터베이스 설계를 찾아줘. api 엔드포인트를 구현하고 반복 개선해줘. 이런식으로 책에서 적힌 설명대로 사고패턴을 바꾸는 방법밖에 없는지? 명확한 기준이 있을까요? 사고패턴 변경방법이 궁금합니다

  • 업무-생산성
  • 인공지능(ai)
  • ai-활용-(ax)
  • claude
  • 바이브코딩
기쁜 앵무새 댓글 2 좋아요 0 조회수 117

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 조회수 89

생성한 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 조회수 96

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

해결됨

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

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

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

forEach에서 continue, break 동작안하는 문제

해결됨

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

forEach에서 continue, break 동작안하는 문제 가 발생하였는데 continue랑 break를 쓸거면 일반적인 for문을 이용할 수밖에 없는 건지 궁금합니다. ^^

  • javascript
  • react
  • node.js
  • 카카오공채-개발
JS K 댓글 1 좋아요 1 조회수 71

CityList개발-handleLoadMore함수질문

해결됨

한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지

코드 관련 질문은 아래와 같이 '코드블럭' 기능을 이용해주세요! + 오류 메세지도 함께 올려주시면 좋아요 🙂 안녕하세요 강의에 따라 그림이 로드 되는 것까지는 성공했지만 이후 handleLoadMore를 넣고 배열이 나오지 않아요... 그리고 handleLoadMore함수가 어떻게 실행까지 이어지는지 알려주세요 예) handleLoadMore가 new CityList의 인수로 지정되고 cityList 함수에 부여되어 00줄 console.log함수로 출력 추가한 코드만 넣었습니다...! 주석 단 부분으로 확인해보니 이렇게 작동됨은 확인했습니다! const cityList = new CityList({ $app, initialState: this.state.cities, handleLoadMore: async () => { const newStartIdx = this.state.startIdx + 40; const newCities = await request(newStartIdx, this.state.region, this.state.sortBy, this.state.searchWord); } }); //console.log(cityList) ⚠ 답변은 평일 오전 10시에 순차적으로 작성해드립니다. ⚠ '질문 해결'은 답변 작성일 기준 1일 이후에 적용됩니다.

  • javascript
  • rest-api
  • spa
  • dom
김규태 댓글 1 좋아요 0 조회수 99

react도 포멧팅 스타일이 따로 있나요?

미해결

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

구글 스타일 처럼 대표적인 포맷팅 스타일이 있나요?

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

인기 태그

인프런 TOP Writers

주간 인기글