inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

build할 때 type오류에 대한 질문이 있습니다.

해결됨

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

안녕하세요! build할 때 계속해서 type 오류가 발생하여 질문 드립니다. 현재 page.tsx에는 아래와 같이 작성되어 있습니다. import BookItem from "@/components/book-item"; import { BookData } from "@/types"; export default async function Page({ searchParams, }: { searchParams: { q?: string; }; }) { const response = await fetch( `${process.env.NEXT_PUBLIC_API_SERVER_URL}/book/search?q=${searchParams.q}` ); if (!response.ok) { return <div>오류가 발생했습니다...</div>; } const books: BookData[] = await response.json(); return ( <div> {books.map((book) => ( <BookItem key={book.id} {...book} /> ))} </div> ); } 근데 여기서 build를 하면 아래와 같은 에러가 발생합니다. .next/types/app/(with-searchbar)/search/page.ts:34:29 Type error: Type 'Props' does not satisfy the constraint 'PageProps'. Types of property 'searchParams' are incompatible. Type 'Record<string, string | string[]> | undefined' is not assignable to type 'Promise<any> | undefined'. Type 'Record<string, string | string[]>' is missing the following properties from type 'Promise<any>': then, catch, finally, [Symbol.toStringTag] 32 | 33 | // Check the prop type of the entry function > 34 | checkFields<Diff<PageProps, FirstArg<TEntry['default']>, 'default'>>() | ^ 35 | 36 | // Check the arguments and return type of the generateMetadata function 37 | if ('generateMetadata' in entry) { Next.js build worker exited with code: 1 and signal: null 사실 gpt를 이용하여 받은 코드로 작성해보면 에러를 해결할 수는 있는데 이게 근본적인 해결 방법인지 잘 모르겠고, gpt가 작성한 코드가 잘 이해가 되지 않습니다. 우선 gpt에서 받은 답변은 아래와 같습니다. import BookItem from "@/components/book-item"; import { BookData } from "@/types"; export default async function Page({ searchParams }: any) { const qRaw = searchParams?.q; const q = Array.isArray(qRaw) ? qRaw[0] : qRaw ?? ""; const response = await fetch( `${process.env.NEXT_PUBLIC_API_SERVER_URL}/book/search?q=${encodeURIComponent(q)}` ); if (!response.ok) { return <div>오류가 발생했습니다...</div>; } const books: BookData[] = await response.json(); return ( <div> {books.map((book) => ( <BookItem key={book.id} {...book} /> ))} </div> ); } 이렇게 하면 해결은 되긴합니다. 다만 왜 해결이 되는 건지 이해가 잘 되지 않아서 그런데 왜 자꾸 build할 때 type 오류가 발생하는지 알려주시면 감사드리겠습니다!

  • react
  • typescript
  • next.js
khhan1990 댓글 2 좋아요 0 조회수 314

404에러 문의드립니다

해결됨

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

버튼눌러서 게시글 조회하면 404에러뜨는데 뭐가 문제인지 알 수 있을까요?

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

final int value를 생성자를 통해 초기화하는 경우

해결됨

김영한의 실전 자바 - 기본편

[질문 내용] final이 붙은 int value를 생성자를 통해 초기화하는 법을 배웠습니다. 그런데, final이 변수 앞에 붙은 경우, 생성자를 통해서 한번만 초기화 될 수 있다고 했는데, 아래 ConstructInit 메서드를 두 번 사용하여 초기화를 두 번 진행한 것을 볼 수 있습니다. 한번만 초기화 할 수 있다고 했는데, 왜 객체를 두개나 생성해서 final int value를 두번 초기화한 것일까요? final int value; public ConstructInit(int value) { this.value = value; } package final1; public class FinalFieldMain { public static void main(String[] args) { //final 필드 - 생성자 초기화 System.out.println("생성자 초기화"); ConstructInit constructInit1 = new ConstructInit(10); ConstructInit constructInit2 = new ConstructInit(20); //한번만 초기화 된다며 System.out.println(constructInit1.value); System.out.println(constructInit2.value); } }

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

7:10

해결됨

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

자식클래스 호출전에 부모클래스 먼저 호출된다했는데 출력값 둘쨋줄은 자식클래스의 기본 생성자인데 따로 호출한적이 없는데 왜 호출 되는건가요?? 그리고 부모클래스 기본생성자의 출력 시점은 eCar.star();를 호출할때 출력되는건가요?

  • python
  • java
  • c
  • 정보처리기사
피로한 염소 댓글 2 좋아요 0 조회수 107

인텔리제이

미해결

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

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. 인텔리제이 설치하고 설치옵션이 뜨는데 뭘 선택해야되나요?

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

javac에 대해서 궁금한 점이 있습니다

미해결

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

안녕하세요 강의를 보고 javac에 대해서 궁금한 점이 있어서 질문 드립니다. .class로 컴파일 된 파일을 각각 os에 맞는 자바가 각자의 os에 맞게 바꿔서 실행을 한다고 하셨는데 javac도 java이지 않나요?. 정확한지 모르겠지만 linux에서 컴파일한 .class와 window에서 컴파일한 .class의 값이 다르다면 window에서 컴파일한 .class 파일이 linux에서 실행이 되는 건가요? 모든 os에서 실행이 되려면 .class 파일의 내용은 같아야 될 것 같은데 궁금합니다.

  • java
  • 객체지향
Wonhyeok Jang 댓글 1 좋아요 0 조회수 122

material 파트까지 들은 후 생긴 궁금증

미해결

React Three fiber(R3F)로 배우는 인터렉티브 3D 웹 개발

안녕하세요 선생님. material까지 강의를 들으면서 두 가지 궁금한 점이 생겼습니다. 로컬 서버에서 ctrl+s 하면 자동으로 핫로딩되어 코드 변경사항이 화면에 반영되는 것으로 알고 있습니다. (리액트의 경우는 root부터 리렌더링) 그런데 핫로딩을 했을 때 바로 반영되는 코드가 있고, 직접 브라우저에서 새로고침해줘야 반영되는 코드가 있었습니다. <핫로딩 시 안변함 (only 새로고침으로만 변경사항 반영됨)> material wireframe 적용 camera fov, far 속성 그 외 등등 <핫로딩 시 변함> Geometry 종류 변경 transform 속성 변경 (position, scale, rotation) mesh color 변경 materal 종류 변경 그 외 등등 위와 같은 차이가 발생하는 이유를 잘 모르겠습니다. 내부 동작면에서 뭔가 다른게 있는 걸까요? (three.js 코드를 까보면 좀 명확해지려나요...) Mesh의 정의를 어떻게 내려야할지 잘 모르겠습니다. 아래 두 가지 중 어느 쪽이 더 맞는 설명일까요? Geometry와 material을 감싼 껍데기 Geometry와 material로 이루어진 하나의 물체 또, 종종 3D 모델링에서 정육면체, 삼각형 등을 오브젝트라고 부르는 걸 들은 적 있는 것 같은데, 해당 오브젝트라는 명칭이 맞는 명칭인가요? 그렇다면, Mesh = 오브젝트 라고 부를 수 있을까요? 감사합니다.

  • javascript
  • react
  • typescript
  • 인터랙티브-웹
  • three.js
  • webgl
  • react-three-fiber
dbjoung 댓글 1 좋아요 0 조회수 182

2.람다.pdf

해결됨

김영한의 실전 자바 - 고급 3편, 람다, 스트림, 함수형 프로그래밍

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문 전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 여기에 질문 내용을 남겨주세요. 2.람다.pdf 36p MyFunction 은 함수형 인터페이스이며, String apply(String s) => StringFunction 이거죠??

  • java
  • 함수형-프로그래밍
  • lambda
  • optional
rudnf9605 댓글 2 좋아요 0 조회수 212

문제와 풀이 invokeAll()로 풀때 예외처리

미해결

김영한의 실전 자바 - 고급 1편, 멀티스레드와 동시성

안녕하세요 해당 문제를 invokeAll()로 풀었는데 예외처리 부분을 어떻게 처리해야할지 궁금해 질문 올렸습니다. 저는 예외를 main메서드에서 잡았지만 , NewOrderService에 try-catch문을 써서 예외를 잡는게 뭔가 응집도가 높아보인다 해야하나? 관련있는 코드끼리 모여있어서 더 유지보수 하기 좋은 코드라고 생각합니다. 그럴려면 order 메서드 안에 이중 try문을 써야하는게 최선인가요? (invokeAll, future.get() 2번) public class NewOrderService { private final ExecutorService es = Executors.newFixedThreadPool(10); public void order(String orderNo) throws InterruptedException, ExecutionException { InventoryWork inventoryWork = new InventoryWork(orderNo); ShippingWork shippingWork = new ShippingWork(orderNo); AccountingWork accountingWork = new AccountingWork(orderNo); List<Callable<Boolean>> works = List.of(inventoryWork, shippingWork, accountingWork); //작업 요청 try { List<Future<Boolean>> futures = es.invokeAll(works); for (Future<Boolean> future : futures) { Boolean result = future.get(); } } finally { es.close(); } } .........InventoryWork,ShippingWork,AccountingWork 클래스 } public class OrderServiceTestMain { public static void main(String[] args) { String orderNo = "Order#1234"; NewOrderService orderService = new NewOrderService(); try { orderService.order(orderNo); log("모든 주문 처리가 성공적으로 완료되었습니다."); } catch (ExecutionException e) { log("일부 작업이 실패했습니다."); throw new RuntimeException(e); } catch (InterruptedException e) { throw new RuntimeException(e); } } }

  • java
  • 객체지향
  • 동시성
  • multithread
  • thread
한조 댓글 1 좋아요 0 조회수 134

tailwind 부분 도와주세요

미해결

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

어디를 수정해야 할까요? 지금 계속 다시 해보고 있는데 해결이 되지 않습니다ㅠ 앞서 이렇게 했었는데 해결되지 않아 다시 해보고있습니다..! tailwind.config.js 의 content에 이렇게 입력하는게 맞나요?? index.css에 이렇게 오류가 떠서요 ㅠㅠ -> 우측하단 언어모드를 tailwindCSS로 바꾸면 밑줄은 사라지는데 npm start 실행시 이렇게 뜹니다..!

  • react
  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
Sssu 댓글 2 좋아요 0 조회수 141

tailwind.config.js 의 content

미해결

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

tailwind.config.js 의 content에 이렇게 입력하는게 맞나요?? index.css에 이렇게 오류가 떠서요 ㅠㅠ -> 우측하단 언어모드를 tailwindCSS로 바꾸면 밑줄은 사라지는데 npm start 실행시 이렇게 뜹니다..!

  • react
  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
Sssu 댓글 1 좋아요 0 조회수 110

Tailwindcss 설정

미해결

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

npx tailwindcss init 작성시 'tailwind'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 라고 뜹니다 코드를 다르게 작성해야하나요?

  • react
  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
Sssu 댓글 2 좋아요 0 조회수 208

FutureTask 객체의 사용후 GC 유무

미해결

김영한의 실전 자바 - 고급 1편, 멀티스레드와 동시성

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문 전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요 Future 관련 공부를 하다가 궁금증이 생겨 질문 남겼습니다. ThreadPoolExecutor 객체 안에 FutureTask 객체를 만들고 그 안에 task(Callable 구현 객체)를 보관한다고 알고 있습니다. 그러면 스레드풀에 있는 스레드가 해당 Future 작업을 완료한 후에 main 스레드에서 future.get()으로 값을 반환 받고 난 후에 해당 future 객체는 GC가 알아서 처리해주는건가요?

  • java
  • 객체지향
  • 동시성
  • multithread
  • thread
한조 댓글 1 좋아요 0 조회수 92

tailwindcss 오류관련 문의 드립니다 ㅠㅠ

해결됨

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

버젼이 달라서인지.. CNA 했을 때 tailwind.config.js 파일이 없었습니다. 강의에서는 원래부터 존재하던데.. 그래서 어떻게어떻게 추가를 했는데. Error: It looks like you're trying to use tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss and update your PostCSS configuration. 라는 에러가 끝나지를 않네요 ㅠ GPT한테 열심히 물어봤는데 도저히 해결이 안돼서 문의드립니다. 밑은 제가 설정해둔 코드입니다. tailwind.config.js /** @type {import('tailwindcss').Config} */ module.exports = { content: [ "./src/**/*.{js,ts,jsx,tsx,html,css}", // 필요한 파일들 포함 "./app/**/*.{js,ts,jsx,tsx}", // Next.js의 `app` 폴더 추가 "./components/**/*.{js,ts,jsx,tsx}", // 컴포넌트 폴더 추가 ], theme: { extend: { colors: { 철수가좋아하는색깔: "#3498db", // 나만의 부트스트랩 만들기 영희가좋아하는색깔: "green", }, }, }, plugins: [], }; postcss.config.js module.exports = { plugins: { tailwindcss: {}, autoprefixer: {}, }, }; globals.css /* @import "tailwindcss"; */ @tailwind base; @tailwind components; @tailwind utilities; 로 해도 안되고, @import "tailwindcss"; 도 안됩니다...

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
jihun6548 댓글 1 좋아요 0 조회수 288

LinkedList의 for-each 동작 방식이 궁금합니다.

미해결

김영한의 실전 자바 - 중급 2편

본 강의 약 10분 쯤에 나오는 코드 private static boolean contains(LinkedList<Integer>[] buckets, int searchValue) { int hashIndex = hashIndex(searchValue); LinkedList<Integer> bucket = buckets[hashIndex]; for (Integer integer : bucket) { if (integer == searchValue) { return true; } } return false; } 이 부분에서 배열은 각 인덱스의 요소를 하나씩 꺼내는데 LinkedList는 어떤식으로 for-each문을 사용하는지 궁금합니다.

  • java
  • 객체지향
  • 코딩-테스트
  • 알고리즘
주성 댓글 1 좋아요 0 조회수 118

저도 tailwind.config.js 가 없네요..

해결됨

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

이거 관련해서 한번 정리해주시면 좋을거같습니다. ㅠㅠ 인터넷에서 찾아보고 gpt한테도 물어봤는데 해결방법을 못찾겠네요.

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

리액트 라우터 관련

미해결

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

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요, 리액트 학습 중에 궁금한 게 있어서 질문드려요. 기본 path 가 아닌 라우트로 바로 접속을 할때, html을 받으면 라우팅이 이뤄지구 useeffect로 api 요청이 가면서 페이지 렌더링이 이뤄지는건가요?

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

중급2편 수강 전 문의

미해결

김영한의 실전 자바 - 중급 1편

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 아니오 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) 예 중급2편 수강 전 문의 한번만 확인 부탁드려요 ㅠㅠ [질문 내용] 여기에 질문 내용을 남겨주세요.

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

getPostRecommend() tags 속성 사용

미해결

Next + React Query로 SNS 서비스 만들기

getPostRecommend() 함수 내부에서 tags : ['post', 'recommends'] 로 설정이 되어있는데, queryClient.prefetch 함수나, useQuery 함수의 queryKey와 항상 동일하게 일치시켜야 하나요? 불러온 데이터를 캐싱할 경우, react-query에서만 관리를 키를 관리해도 되지 않을까요?

  • react
  • next.js
  • react-query
  • next-auth
  • msw
그린티라떼 댓글 2 좋아요 0 조회수 102

2025년 3월 리액트버전

미해결

처음 만난 리액트(React)

혹시 현재 25년 3월기준 이 강의를 들으면 리액트 버전 차이로 인해 렌더링 방식이라던지 다른 점이 있어서 수강할때 불편할까요? - 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

  • HTML/CSS
  • javascript
  • react
mkisos7900 댓글 2 좋아요 1 조회수 233

인기 태그

인프런 TOP Writers

주간 인기글