inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

피그마 한글 버전

해결됨

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

피그마 한국 버전으로 가입 해야 되나요 학습 피그마가 영문이라도 한글 버전으로도 호환 되나요? https://www.figma.com/ko-kr/

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

ETag 사용시 서버의 성능 향상

미해결

웹 개발의 핵심, HTTP 완벽 마스터하기!

서버에서는 캐싱의 유무와 상관없이 매번 리소스에 대해 digest 를 하게 되는것 같은데요. 그러면, 브라우저가 리소스를 캐싱한다고 해서 '서버성능에 도움이 되기보다는 네트워크 대역폭을 아낄수 있다' 정도의 이점이 있다고 보면 될까요?

  • 네트워크
  • ajax
  • https
  • cors
  • cookie
writer0713 댓글 2 좋아요 1 조회수 99

10.3강 React.memo와 컴포넌트 렌더링 최적화 질문

미해결

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

export default memo(TodoItem, (preProps, nextProps) => { if (preProps.id !== nextProps.id) return false; if (preProps.isDone !== nextProps.isDone) return false; if (preProps.content !== nextProps.content) return false; if (preProps.date !== nextProps.date) return false; return true; } 사실상 isDone 빼고 바뀌는 게 없으니 if 부분 지울 수도 있나요? 아니면 위험한가요?

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

혹시 필요한 라이브러리들을 미리 전부 설치해도 되나요?

미해결

React Native with Expo: 제로초에게 제대로 배우기

필요한 라이브러리를 미리 설치해둬도 되나요? expo에서 'eas build --platform android --profile development' 해당 명령어를 사용해서 빌드할 때마다 시간이 너무 오래걸려요ㅜㅜ 하나 설치하면 계속 그런 라이브러리 없다고 해서 계속 다시 빌드해야해서ㅜㅜ 혹시 강의에 사용한 라이브러리 리스트가 있다면 제공해주실 수 있나요?? 무료를 사용하면 1시간도 기다리라고 해서요...ㅜㅜ

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이수민 댓글 2 좋아요 1 조회수 83

flex를 grid 처럼 만들기 질문드립니다.

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

css 04-2-2 반응형과 grid 조합 - 플렉스박스와 그리드 비교 수업 12분 15초 내용을 감싸는 div를 만들어서 어떻게 해야 grid 와 같이 만들 수가 있는 건지 궁금합니다.

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
robotics 댓글 2 좋아요 0 조회수 130

6-2 강의 노션 코드 오타인거죠? 2

해결됨

React & FastAPI로 만드는 투표 커뮤니티 플랫폼: 결제 시스템으로 수익화까지!

위치: SingleTopic/Chart/ChartCanvas.jsx (39번 라인) 문제: stroke={colors[i].bg} // ❌ 현재 코드 원인: voteColors.js 의 실제 구조는 문자열 배열입니다 예: 2: ["#10B981", "#F43F5E"] .bg 프로퍼티가 존재하지 않아 undefined 반환 해결: stroke={colors[i]} // ✅ 수정 코드 결과: 수정 후 차트 선 색상이 정상적으로 표시됩니다. 제안: 후속 수강생들을 위해 강의 자료 업데이트 부탁드립니다. 강의 노션 코드에 오타가 너무 많아서 도움을 주는 자료인지 강의 진행을 방해하는 자료인지 모를 정도입니다. 솔직히 좀 심각합니다. 감사합니다.

  • react
  • mysql
  • docker
  • rest-api
  • FastAPI
고리오영감 댓글 3 좋아요 0 조회수 120

plan mode로 토글이 안됩니다

미해결

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

shift+tab 키를 누르면 plan mode --> 일반모드 등으로 토글이 된다고 책에 나와 있는데 실제로 해보면 thinking on --> thinking off 모드만 토글이 되고 있어요. 혹시 plan mode로 가려면 어떻게 해야 하나요?

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

프로젝트 설계 실습 문의

미해결

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

223p 에 있는 step1 실습해봤는데요. 디렉터리 구조가 이상하게 만들어져서 CLAUDE.md 추가하고 실행해줬는데도 여전히 디렉터리 구조가 이상해요. Git 레포지토리 보면 frontend, backend 나뉘지 않았고 Docker file도 생성되고 그랬는데 너무 다르게 생성이 되어서요. 스크린샷대로 나오는게 맞을까요? 이상해서 계속 새로 명령어 실행해도 똑같은 결과가 나오는데, 토큰만 낭비하고 있어서 질문드립니다.

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

auto-compact 모니터링

미해결

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

auto-compact 모니터링이 중요하다고 하셨는데 저자님께서는 어떻게 모니터링 하시는지 궁금합니다. 내장 명령어로는 기능이 없고 엔트로픽 API에서도 usage같은 메트릭은 모니터링 가능하지만 압축률에 대한 모니터링은 지원하지 않는 것 같아서요

  • 업무-생산성
  • 인공지능(ai)
  • ai-활용-(ax)
  • claude
  • 바이브코딩
HH 댓글 1 좋아요 0 조회수 170

super.show() 호출하는 이유가 궁금합니다.

미해결

[React 1부] 만들고 비교하며 학습하는 React

안녕하세요, 강의 잘 듣고 있습니다. 23강에서 SearchFormView 클래스의 show 메서드 오버라이딩과 관련하여 궁금한 점이 생겨서 질문드립니다. // SearchFormView.js show(searchKeyword = "") { this.inputElement.value = searchKeyword; this.showResetButton(this.inputElement.value.length > 0); } super.show() 를 호출하지 않아도 화면이 의도대로 동작하는 것을 확인했는데요. super.show() 호출이 단순히 체이닝을 위한 호출인지 아니면 제가 놓친 다른 의도가 있는 것인지 궁금합니다.

  • javascript
  • react
  • 웹앱
  • mvc
leeebug 댓글 2 좋아요 1 조회수 118

2주차 수요일에 있어야 할 참고자료가 화요일에 있네요.

미해결

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

아래 추가 문서 링크가 수요일에 있어야 하는데, 화요일에 안내 되어 있네요 ^^ *151p 추가 문서 : devcontainer 설명 및 실습 [링크] ▶ https://gilbut.co/c/25094344mr

  • 업무-생산성
  • 인공지능(ai)
  • ai-활용-(ax)
  • claude
  • 바이브코딩
머가필요해 댓글 2 좋아요 0 조회수 87

선생님 상태변경할때 질문

미해결

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

그 선생님은 지금 문제에서 상태 변경할떄 setCount((count) => count +1); 로 해주셨는데 지금 상황에서는 그냥 setCount((count+1)) 로 해도 문제 없지않나용? 버튼 한번 눌렀을때 count+1 되는건 한번이니깐..? 연속으로 +1 증가하는 로직이 아니라서 이렇게 생각되는데 혹시 제가 뭘 놓치고있는건가요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
jyl08840 댓글 2 좋아요 0 조회수 59

[강의 오류 리포트] React Router Outlet 사용 오류

해결됨

React & FastAPI로 만드는 투표 커뮤니티 플랫폼: 결제 시스템으로 수익화까지!

문제 발생 섹션: 4-1. Footer 제작 문제 내용: 강의 자료에서 제공된 App.jsx 코드에 구조적 오류가 있습니다. 문제점: 1. RootLayout 컴포넌트 내부에서 <Outlet /> 컴포넌트를 사용하고 있으나, 라우터 설정에 자식 라우트(children routes)가 정의되어 있지 않습니다. 2.현재 라우터 구조: ``` const router = createBrowserRouter([ { path: "/", element: <LootLayout />, // children이 없음 - Outlet이 렌더링할 내용이 없음 }, ]); ``` 발생한 에러: Outlet 컴포넌트 관련 에러 발생 해당 코드 제거 시 정상 동작 제안 사항: 아래 두 가지 중 하나로 수정이 필요합니다: 방법 1) 자식 라우트가 없다면 Outlet 제거 ``` <main className="flex-grow container mx-auto px-4 py-8"> {/* <Outlet /> 제거 */} </main> 추가 의견: 해당 강의를 수강하면서 이번 건 외에도 여러 오류를 발견했습니다. 학습에 상당한 지장이 있는 상황이므로, 강의 전체에 대한 코드 검수 및 업데이트를 요청드립니다. 특히 React Router v6의 최신 문법과 개념(Outlet, createBrowserRouter 등)이 정확히 반영되었는지 재확인이 필요해 보입니다. 수강생들이 불필요한 디버깅 시간을 소비하지 않도록 조속한 개선 부탁드립니다.

  • react
  • mysql
  • docker
  • rest-api
  • FastAPI
고리오영감 댓글 1 좋아요 0 조회수 93

[강의 오류 제보] Navbar 컴포넌트 코드 오류 발견

해결됨

React & FastAPI로 만드는 투표 커뮤니티 플랫폼: 결제 시스템으로 수익화까지!

안녕하세요, '리액트 + FastAPI로 투표 커뮤니티 플랫폼' 강의를 수강 중인 학습자입니다. 강의 자료의 코드를 그대로 따라했을 때 에러가 발생하여 제보드립니다. --- 📍 발생 위치: - 강의 섹션: [섹션 3/ch2. 메뉴바 제작] - 파일: src/Components/Navbar/index.jsx ❌ 발생한 에러: ReferenceError: logout is not defined 🔍 문제 원인: 강의 자료 코드에서 함수는 onLogoutClick , onLoginClick , onSignupClick 으로 정의했으나, 자식 컴포넌트에 전달할 때는 정의되지 않은 logout 변수를 사용하고 있습니다. 현재 강의 자료 코드: ``` javascript const onLogoutClick = () => { ... }; <AuthButtons logout={logout} /> // ❌ logout 미정의 <MobileMenu logout={logout} /> // ❌ logout 미정의 ``` 수정방법: <AuthButtons isAuthenticated={isAuthenticated} isOpen={isOpen} setIsOpen={setIsOpen} onLogoutClick={onLogoutClick} // ✅ 수정 onLoginClick={onLoginClick} // ✅ 추가 onSignupClick={onSignupClick} // ✅ 추가 /> <MobileMenu isOpen={isOpen} setIsOpen={setIsOpen} isAuthenticated={isAuthenticated} onLogoutClick={onLogoutClick} // ✅ 수정 onLoginClick={onLoginClick} // ✅ 추가 onSignupClick={onSignupClick} // ✅ 추가 /> 💡 제안: 이전 강의 자료에서는 올바르게 onLogoutClick 등을 전달하고 있었는데, 특정 시점부터 logout 으로 변경되면서 함수명과 불일치가 발생한 것으로 보입니다. 강의 자료 업데이트 부탁드립니다. 감사합니다.

  • react
  • mysql
  • docker
  • rest-api
  • FastAPI
고리오영감 댓글 2 좋아요 0 조회수 109

실습 프롬프트 파일 제공

미해결

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

week 2 부터는 실습 프롬프트에 대한 내용이 많이 보이는데요, 물론 직접 전부 입력하는게 좋긴 하겠지만 해당 내용들도 txt나 md로 제공되면 더 도움될거 같습니다.

  • 업무-생산성
  • 인공지능(ai)
  • ai-활용-(ax)
  • claude
  • 바이브코딩
오베론 댓글 2 좋아요 0 조회수 89

getPostData 함수 질문

미해결

손에 익는 Next.js - 블로그 만들기

return 문에 왜 matterResult.data를 반환해주나요? id 와 content만 있으면 되는거 아닌가요?? 추가해주는 이유가 궁금합니다.

  • react
  • 블로그
  • next.js
gmldnjs0402 댓글 1 좋아요 0 조회수 78

graphql 백엔드 서버가 포폴용 빼곤 접속이 안됩니다.

해결됨

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

backend-practice 로 시작하는 포트폴리오용 백엔드 서버만 접속이 가능하고 다른 서버들은 현재 접속할 수 없습니다. 이로인해 현재 포트폴리오용 사이트 실습을 제외하고 기본 강의에서 제시해주시는 코드 테스트가 불가능합니다. 약 일주일정도 살짝 넘게 강의 수강하면서 시도하는데 문제가 지속되는 것으로 봐서 관리가 안되고 있는 것 같은데 확인 부탁드립니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
김용주 댓글 2 좋아요 0 조회수 113

이벤트 루프 실행 관련

해결됨

프론트엔드 마스터클래스

저는 풀스택 주니어입니다. 특수 목적을 위해 바닐라js에서 ,document.innerHTML이나 element.remove(), element.append() 등으로 html element의 생성과 삭제가 빈번한 로직을 다루고 있습니다. 이 때 종종 브라우저 렌더링의 실행 완료에 대해 명확하게 알지 못해서 찝찝한 채로 브라우저에 렌더링 일을 시키고 있습니다. 그러던 중 이벤트 루프 관련 3개 강의(16,17,18강) 를 듣고 복습차, 17강으로 다시 돌아와서 보는 2분18초 경에 브라우저 랜더링에 대해 궁금한게 생겼습니다. 예를 들면 const mySchedule = async () => { await randeringPipelineTask(); //랜더링파이프라인 await macroTask(); // 매크로태스크(); } 으로 구성된 mySchedule 메서드가 있다고 가정하겠습니다. macroTask()는 renderingPipelineTask()의 브라우저 페인트까지 모두 완료를 확인한 후에 실행될까요? 아니면 JS엔진이라는 것은, 페인트는 브라우저에 렌더링을 해달라고 부탁까지만하고 macroTask()를 실행할까요? ('실행의 시작'과 '실행의 끝'을 나눠서 생각해서 그런지 생각하면 할수록 햇갈립니다.)

  • javascript
  • react
  • 함수형-프로그래밍
  • 객체지향
  • next.js
동군 댓글 2 좋아요 0 조회수 171

vite 버전질문

미해결

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

vite 버전) 강의 선생님은 6 버전이던대 저는 7인데 상관없나요 ??

  • react
  • version
jyl08840 댓글 2 좋아요 0 조회수 62

쇼핑몰관련 질문드립니다.

미해결

(2025 최신 업데이트)리액트 : 프론트엔드 개발자로 가는 마지막 단계

쇼핑몰 만들기 부분을 보고 있는데요, 상품상세페이지 만드는데서 막히네요. 메인에서 제품을 누르면 로그인화면이 뜨고 로그인을 하면 다시 메인으로 가는거까지는 되었는데요, 거기서 다시 목록을 누르면 콘솔창에 해당하는 id정보가 나와야 하는데 App.jsx 에서 에러가 난다고 하는데 그대로 따라한 파일이라 어디가 틀린건지 잘 모르겠네요 import React, { useEffect } from 'react'; import { useParams } from 'react-router-dom'; const ProductDetail = () => { let {id} = useParams(); const getProductDetail = async () => { let url = `http://localhost:5000/products/${id}`; let response = await fetch(url); let data = await response.json(); console.log(data); }; useEffect(()=>{ getProductDetail(); },[]); return ( <div></div> ) } export default ProductDetail; import './App.css'; import 'bootstrap/dist/css/bootstrap.min.css'; import { useEffect, useState } from 'react'; import { Routes, Route } from 'react-router-dom'; import ProductAll from './page/ProductAll'; import Login from './page/Login'; import ProductDetail from './page/ProductDetail'; import Navbar from './component/Navbar'; import PrivateRoute from './route/PrivateRoute'; function App() { const [authenticate, setAuthenticate] = useState(false); //true이면 로그인이 됨, false이면 로그인이 안됨 useEffect(()=>{ console.log('aaa',authenticate); },[authenticate]); //값이 바뀔때마다 return ( <div> <Navbar/> <Routes> <Route path="/" element={<ProductAll/>}/> <Route path="/login" element={<Login setAuthenticate={setAuthenticate}/>}/> <Route path="/product/:id" element={<PrivateRoute authenticate={authenticate}/>}/> </Routes> </div> ) } export default App; <Route path="/product/:id" element={<PrivateRoute authenticate={authenticate}/>}/> 이부분이 에러가 뜨는거 같아요

  • react
  • redux
  • web-api
댓글 2 좋아요 1 조회수 104

인기 태그

인프런 TOP Writers

주간 인기글