inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

실무에서는 어떤 React Router 패턴을 사용하나요?

해결됨

한 입 크기로 잘라먹는 React.js 실전 프로젝트 - SNS 편

React Router에는 대표적으로 선언적 모드와 데이터 모드 두 가지 방식이 있는 것으로 알고 있습니다. 강의에서는 선언적 모드(Declarative)로 라우팅을 구현하셨는데, 실제 실무에서는 선언적 모드와 데이터 모드 중 어떤 방식을 더 많이 사용하는지 궁금합니다. ps. 강의 너무 잘 듣고 있습니다! 강사님 최고!

  • react
  • react-router
미야옹 댓글 2 좋아요 0 조회수 132

최종 예제 코드

미해결

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

예제 코드는 한 강좌 후 최종 소스가 아니라 강좌시작 하기전 기초 소스 일까요? 예를 들어 134강의 경우 10-10 소스인데 예제코드 소스를 보면 jsx 정보 정도만 들어 있습니다. 다른 강좌도 마찬가지로 기본 틀만 있고 강좌에 나온 파일 조차 만들어 지지 않은 경우가 많습니다. 수업후 최종 소스도 받을수 있을까요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
신박한 댓글 2 좋아요 0 조회수 49

강의 내용은 훌륭하나, 환경 설정 오류 때문에 진도를 나갈 수 없습니다. 20년 버전 강의.

미해결

따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]

최신버전으로 강의 업그레이드 하셔야 할거같아요.. 도저히 진행이 안되네요. 버전 차이가 너무 커서 환경 맞추는 거 자체가 고통스러워요. 강의 게시일: 2020. 04. 22. 마지막 업데이트일: 2025. 05. 13. 난 마지막 업데이트일 보고 최신꺼인줄 ㅋㅋ 1.강의 내용은 훌륭하지만, 환경 설정 오류로 진도를 나갈 수 없음. 2." ESLint 9.x / Vite 5.x 버전 충돌 문제 해결에만 수십 시간 소요" 의존성 문제 "현재 강의에서 사용하는 ** eslint-config-react-app@7.0.1 **이 최신 Node.js 환경에서 ** eslint@9.x.x **와 충돌하여 ERESOLVE 오류가 발생합니다." "수강생들은 Hooks 규칙을 활성화하기 위해 강제로 ESLint를 8.x.x 버전으로 다운그레이드해야 하는 번거로움을 겪고 있습니다." "Tailwind CSS 설치 시 npx tailwindcss init -p 명령어가 환경 문제로 작동하지 않고, could not determine executable 오류가 반복됩니다." "CSS 전처리 설정, 특히 PostCSS 설정 방법이 현재 Vite 환경에 맞지 않아 추가적인 검색과 수정이 필요합니다." * tailwind **라는 잘못된 이름의 패키지를 설치하도록 안내된 부분을 지적하여 강사가 코드를 확인하도록 유도합니다. 포함할 내용: "강의에서 안내하는 tailwind 패키지(비공식/폐기됨)가 아니라 tailwindcss (공식 패키지)를 사용해야 설치가 진행됩니다. 강의 코드와 명칭 수정이 필요합니다." " Node.js 20.x, React 18+, ESLint 8.x 또는 9.x 를 기준으로 환경 설정 부분을 재녹화 하여 제공해 주시길 간곡히 요청드립니다." "기존 수강생을 위해 최신 버전 환경 설정에 대한 가이드 문서(ReadMe) 라도 제공되면 큰 도움이 될 것입니다."

  • react
  • redux
  • node.js
  • 웹앱
  • mongodb
소진 댓글 1 좋아요 0 조회수 93

강의 소스 코드 압축 풀기 오류

미해결

따라하며 배우는 리액트 A-Z[19버전 반영]

강의 소스 코드를 다운로드 받아 압축 풀기를 하는데 99% 끝부분에서 특정 파일이 에러가 발생해 넘어가지지를 않습니다. 건너띄기로 100% 완료하기는 했지만 찜찜해서 문의 드립니다.

  • react
  • redux
  • tdd
  • typescript
  • next.js
  • 소프트웨어-테스트
가넷스타 댓글 1 좋아요 0 조회수 102

26년 실기

해결됨

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

이 강의로 26년 실기 준비가능할까요?

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

18번 강의 듣는중에 문의드립니다.

해결됨

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

안녕하세요. 강의 나름 열심히 듣고있는 수강생입니다..! 정환님 강의 React.js, typescript,다 수강하고 이어서 next.js 수강중입니다. 지금은 2.10) 사전 렌더링와 데이터페칭 보고있는데요. 리액트에서의 데이터 페칭 설명해주시면서 기억나시나요?? 물어보셨는데 혹시 정환님 React.js 강의에서 데이터페칭 설명해주신 부분이 있었나요?? ㅠㅠㅠ 제가 놓친건지.. 다시 찾아봐도 찾기가 힘들어서요.. 답변 부탁 드립니다.

  • react
  • typescript
  • next.js
열시미하겟슴다 댓글 3 좋아요 0 조회수 93

Todo구현중 memo함수에 대해서

미해결

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

todo리스트 구현중 TodoItem.jsx에서 memo에 대해 강의를 보며 공부중입니다. 이렇게 console.log로 찍었는데 체크박스를 한 개만 찍어도 3가지 모두 다 console로 찍히는데 제대로 적용된 것 맞나요? 하이라이트를 켜도 색상이 비슷해서 구분이 잘 가지않습니다. 로그는 이렇게 찍힙니다. prev next = {"id":0,"isDone":false,"content":"React 공부하기","date":1764731042079}{"id":0,"isDone":true,"content":"React 공부하기","date":1764731042079} TodoItem.jsx?t=1764729548020:40 prev next = {"id":1,"isDone":false,"content":"빨래하기","date":1764731042079}{"id":1,"isDone":false,"content":"빨래하기","date":1764731042079} TodoItem.jsx?t=1764729548020:40 prev next = {"id":2,"isDone":false,"content":"노래 연습하기","date":1764731042079}{"id":2,"isDone":false,"content":"노래 연습하기","date":1764731042079} import { memo } from 'react'; import './TodoItem.css' function TodoItem({id, isDone, content, date, onUpdate, onDelete}) { const onChangeCheckbox = () => { onUpdate(id); } const onClickDeleteButton = () => { onDelete(id) } return ( <div className="TodoItem"> <input onChange={onChangeCheckbox} readOnly checked={isDone} type="checkbox"/> <div className="content">{content}</div> <div className="date">{new Date(date).toLocaleDateString()}</div> <button onClick={onClickDeleteButton}> 삭제 </button> </div> ); } export default memo(TodoItem, (prevProps, nextProps) => { console.log("prev next = " + JSON.stringify(prevProps) + JSON.stringify(nextProps)) 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 });

  • javascript
  • react
  • node.js
  • 카카오공채-개발
최어진 댓글 2 좋아요 0 조회수 70

RateLimitTest시 저는 2초로 해야 정상으로 나오는데

해결됨

스프링부트로 직접 만들면서 배우는 대규모 시스템 설계 - 캐시 전략

1초로하면 현재 성공, 실패 각각 200, 0으로 나오고 2초로 해야 100개 씩 성공하는데 정상인가요?

  • spring-boot
  • redis
  • backend
  • 시스템-디자인
  • cache
wisehero 댓글 2 좋아요 0 조회수 92

for, while문 작성

미해결

김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 입문 > 반복문을 공부하고 있는 학생입니다. for, while문에 대해 1번 2번 문제와 풀이를 하는 중인데요, 답안을 보니 int num, int count라는 변수를 각각 사용했더라구요. 그런데 저는 num선언을 통해서만 작성했는데. 보통 반복문의 경우 count라는 변수를 별개로 선언하여 반복하는 횟수를 잡아 개발하는지 문의드립니다. 참고로 제가 작성한 코드는 아래와 같습니다. /* for(int count = 1; count<=10; count++){ System.out.println(count); } int count1 = 1; while (count1<=10){ System.out.println(count1); count1++; } */ int num = 2; while (num<=20){ System.out.println(num); num = num+2; } for(int num1=2; num1<=20; num1=num1+2){ System.out.println(num1); //num1++; }

  • java
  • 객체지향
민지 댓글 1 좋아요 0 조회수 91

@PrePersist, @PreUpdate 호출 시점 질문드립니다.

미해결

실전! 스프링 데이터 JPA

@PrePersist 가 있는 메서드는 영속성 컨텍스트에 엔티티를 저장할때 즉, save()나 persist() 호출 시점에 호출되는것인가요? 아니면 flush()이후에 INSERT쿼리가 실행되기 직전에 호출되는것인가요? @PreUpdate 가 있는 메서드는 엔티티의 변경 감지가 일어나고 트랜잭션 커밋 또는 em.flush()시점에 UPDATE쿼리가 실행되는데, 이 UPDATE쿼리가 실행되기 직전에 호출되는것이 맞을까요?

  • java
  • spring
  • spring-boot
  • jpa
오리쉐리 댓글 2 좋아요 0 조회수 123

주식거래와 같은 실시간 보장이 필요한 상황에서 SAGA 패턴 도입에 대한 문의

해결됨

카카오 면접관이 알려주는 MSA 관점에서의 분산 트랜잭션 패턴

안녕하세요! 과거에, MSA 학습용으로 모의 주식 투자 서비스(?)를 만들어본 사람입니다. 당시에, 주식 매수의 기능을, 2개의 service 로 운영했었고, 이때 각 요청의 순서는 이벤트 기반으로 처리하였습니다. client -> stock service -> kafka -> payment service(이벤트 구독) 이때, 특정 문제에 대한 트랜잭션 보장을, 보장 로직을 통해 구현하였었습니다. 이때, kafka pub/sub 이벤트를 동기적으로 처리되었는지 확인하도록 구성해놓았었습니다. 주식 거래와 같은 일관성이 매우 중요한 서비스에서 어떤 방향성이 더 올바른(?) 방향이라고 생각하고, 어떤 생각을 가지고 계신지 궁금합니다. 현재 생각으로는, 2pc 를 채택하는게 더 올바른 선택이었다고 생각이 듭니다.

  • java
  • spring
  • mysql
  • spring-boot
  • msa
BeakGwa 댓글 2 좋아요 0 조회수 117

Tailwind CSS IntelliSense 작동이 안되요...

미해결

한 입 크기로 잘라먹는 React.js 실전 프로젝트 - SNS 편

안녕하세요 Tailwind CSS IntelliSense 작동이 안되서 그러는데 확인해 본 결과로 index.css에서 @import "tw-animate-css"; 이거와 @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } 이 코드가 들어가면 작동을 하지 않습니다 혹시 이게 왜 그럴까요...?

  • react
  • typescript
  • react-query
  • supabase
  • zustand
박 태영 댓글 2 좋아요 0 조회수 91

플러그인 질문

해결됨

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

강사님이 사용하시는 코드에서 오류가 났을때 빨간문자로 보이는 도움말? 은 무슨 플러그인을 사용하시는건가요?

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

next.js 는 핸드북 없나요?

해결됨

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

next.js 는 핸드북 없나요?

  • react
  • typescript
  • next.js
  • 카카오공채-개발
dorasir 댓글 2 좋아요 0 조회수 90

메타데이터 관리

미해결

죽음의 Spring Batch: 새벽 3시의 처절한 공포는 이제 끝이다.

킬구형 메타데이터쪽 update를 읽다가 이해가 안가는게 있는데 형이 update() 메서드는 매 트랜잭션의 커밋 직전에 호출된다. 단, 처리 도중 예외가 발생하여 트랜잭션이 롤백되는 경우에는 호출되지 않는다. 이는 실패한 처리 내용이 실행 정보에 반영되는 것을 방지한다. 라고 했는데 그러면 문제가 생겨서 update를 호출하지 않고 롤백이 됬다고 하면 open입장에서는 실패했는지 안했는지도 모르는거아니야? 실패를 해도 마지막으로 저장된 곳부터 다시 시작하니까 실패를 아예 저장을 안한다는거야? 재시작할때 메타테이블에서 execution값을 받아와서 괜찮은건가?

  • java
  • spring
  • spring-boot
  • spring-batch
  • backend
ABBCD 댓글 2 좋아요 1 조회수 94

고양이 이미지가 엑박이 뜨네요

미해결

만들면서 배우는 리액트 : 기초

API 스펙이 변경되었네요! 제보 감사합니다. https://github.com/milooy/cat-jjal-maker/blob/main/answers/29-useEffect.html#L48 위 코드를 참고해서 fetchCat 함수를 변경해주세요. 위 답변해주신대로 소스를 변경해도 고양이 이미지가 엑박으로 뜨질 않습니다.

  • javascript
  • react
gangsugi 댓글 1 좋아요 0 조회수 83

백)TODO관련

미해결

코드로 배우는 React 19 with 스프링부트 API서버

강의중에는 private long tno; private String title; private String content; private boolean complete; private LocalDate dueDate; 위와같은 설정인데, 왜 갑자기 private long tno; private String title; private String writer; private boolean complete; private LocalDate dueDate; 로 바뀌는 건가요? 이것에 대한 설명은 어디에 있는거죠? 몇강 몇분대에 있는지에 대해서 알려주시면 감사하겠습니다.

  • react
  • typescript
  • spring-boot
  • jpa
  • jwt
jhoh 댓글 2 좋아요 0 조회수 74

68강 ArrayEx6 클래스 질문

미해결

김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 혹시 이 코드도 정답으로 인정되나요? package array.ex; import java.util.Scanner; public class ArrayEx6 { public static void main(String[] args) { Scanner sc = new Scanner(System.in); System.out.print("입력받을 숫자의 개수를 입력하세요:"); int n = sc.nextInt(); System.out.println(n + "개의 정수를 입력하세요:"); int[] arr = new int[n]; for (int i = 0; i < n; i++) { arr[i] = sc.nextInt(); } int max = Integer.MIN_VALUE; int min = Integer.MAX_VALUE; for (int i = 0; i < n; i++) { max = Math.max(max, arr[i]); min = Math.min(min, arr[i]); } System.out.println("가장 작은 정수: " + min); System.out.println("가장 큰 정수: " + max); } }

  • java
lgh8079 댓글 1 좋아요 0 조회수 88

useState 훅

미해결

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

const [count,setCount] = useState(0); 선언되어 있을때 ()=>setCount(count+1); (count)=>setCount(count +1); 강의에서는 2번 처럼 사용 하던데 1번 처럼 사용해도 상관없나요? 차이가 있나요?

  • react
  • react-router
  • redux-toolkit
  • zustand
  • react.js
신박한 댓글 2 좋아요 0 조회수 50

디스코드 문의

해결됨

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

안녕하세요, 소개 영상에서는 디스코드 채널이 있는거 같은데요. 관련 링크가 없네요. 어디서 확인가능할까요?

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

인기 태그

인프런 TOP Writers

주간 인기글