분류 전체보기 166

[ Error ] Not registered via @EnableConfigurationProperties, marked as Spring component, or scanned via @ConfigurationPropertiesScan

Not registered via @EnableConfigurationProperties, marked as Spring component, or scanned via @ConfigurationPropertiesScan config 관련한 부분이 제대로 등록되지 않아서 발생하는 에러이다.빈으로 등록해주는 클래스에 @Component, @Service 등이 있는지 확인하고, boot를 실행시키는 main 메서드가 있는 클래스에 @ConfigurationPropertiesScan 어노테이션이 추가되어 있는지 확인해주어야 한다.

ERROR 2024.05.20

[ Java ] - QueryDSL이란 무엇인가? (+기본 세팅)

QueryDSL :Query Domain Specific LanauageQueryDSL이란 무엇인가?">HTML 삽입미리보기할 수 없는 소스QueryDSL은 자바 코드를 기반으로 하여 쿼리를 작성 할 수 있도록 도와주는 도구로 직관적이고 유연한 쿼리 작성을 가능하게하기 때문에, 복잡한 쿼리나 동적 쿼리 또는 여러 테이블 간의 조인을 통한 값 조회가 요구되는 쿼리 생성이 필요한 경우 등에 JPQL(=JPA Query Lanauage)과 함께 널리 사용되는 라이브러리입니다.** 자바에서는 데이터베이스 관련 작업을 위해 기본적으로 jpaRepository가 사용되는데, jpaRepository는 자바에서 데이터베이스와 연동된 작업을 하기에 매우 편리하고 간단하지만, 단순 CRUD 위주의 작업을 벗어난 복잡한 ..

JAVA 2024.05.19

[ Error ] - 카프카 관련 에러

에러 메시지 Caused by: java.lang.IllegalStateException: No group.id found in consumer config, container properties, or @KafkaListener annotation; a group.id is required when group management is used. 위와 같은 에러는 스프링 부트에서 카프카 컨슈머 사용 시 설정해주어야 하는 내용 중 group.id를 설정해주지 않아 발생한 에러이다. 이를 해결해주기 위해서는 application.yml에 아래와 같이 group.id 관련한 내용을 추가해주면 된다.

ERROR 2024.01.01

[ Next.js ] - 폰트 적용하는 법 (next/font)

폰트 적용하는 법 (next/font) * next13 버전 기준 nextjs에서 프로젝트에 폰트를 적용하기 위해서는 next/font를 이용하는데, next/font는 모든 폰트 파일에 대해 자동으로 자체 호스팅 기능을 내장하고 있다. 자체 호스팅 기능을 제공한다는 것은 어플리케이션에서 사용되는 폰트 파일을 서버에 업로드하고, 해당 서버에서 자체적으로 폰트를 제공한다는 것을 의미한다. 이를 통해 본래 사용자가 웹 사이트를 방문할 때마다 폰트 파일을 외부 네트워크를 통해 다운로드하여 가져와 렌더링하던 과정을 생략할 수 있게 된다, 서버에서 자체적으로 호스팅된 폰트를 이용함으로써 폰트 파일을 최적으로 로드하는 것이 가능하고, 폰트를 불러오기 위해 외부 네트워크에 요청할 필요가 사라지기 때문에, 웹사이트의 ..

Javascript/Next.js 2023.12.13

[ Next.js ] - error (feat. Server Components)

You're importing a component that needs createContext. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default. 원인 Next.js의 경우 기본적으로 Server Components가 사용되는데, 이는 SSR(Server Side Rendering)즉 서버에서 렌더링 작업을 수행합니다. 위와 같은 에러는 Server Components에서 createContext와 같은 Client Components에서 사용되는 기능을 사용하려 했기 때문에 발생한 에러이다. Server Componen..

Javascript/Next.js 2023.11.29

[ WEB ] - sessionStorage? localStorage?

sessionStorage와 localStorage란? localStorage와 sessionStorage는 브라우저에서 데이터를 키:값 쌍의 객체 형태로 저장할 수 있게 해주는 스토리지이다. 두 스토리지는 데이터 유지 기간과, 데이터가 공유되는 범위에 있어서 차이를 가진다. sessionStorage에 저장된 데이터는 기본적으로 해당 세션이 유지되는 동안에만 유효한데, 이는 곧 브라우저가 열려 있는 경우에만 데이터가 유지됨을 의미한다. 기존 창에서 새로고침을 하는 것과 같은 경우에는 세션이 그대로 유지되지만 브라우저를 닫게 되면 기존의 데이터는 확인할 수 없다. 또한 기존 탭이 아닌 새로운 탭을 여는 경우에도 새로운 세션을 생성하기 때문에 이전의 다른 탭에 저장된 데이터의 내용은 공유되지 않는다. 즉 ..

이론 2023.11.22

[ React ] - 훅(Hook) 종류와 사용법 ( useCallback )

[ React ] - 훅(Hook) 종류와 사용법 ( useCallback ) HTML 삽입 미리보기할 수 없는 소스 useCallback은 함수를 캐싱하고, 재사용할 수 있게 해주는 훅으로, 성능 최적화를 위해 활용됩니다. useCallback은 함수를 매번 새로 생성하는 것을 막아주어 불필요한 렌더링을 줄이고 메모리 사용을 최적화시키는데 도움을 줍니다. useCallback의 경우 상위 컴포넌트에서 정의한 함수를 하위 컴포넌트에 props로 전달하여 사용시 함수를 메모리제이션함으로써, 상위 컴포넌트의 렌더링과 무관하게, 함수가 사용될 때에만 새로 생성되도록 하여 성능을 최적화하는데 도움을 줍니다. 사용법 useCallback은 기본적으로 두 개의 인자를 갖는데, 첫 번째 인자로는 콜백 함수가 들어가며..

Javascript/React 2023.11.22

[ Typescript ] - 제네릭 유틸리티 타입(Generic Utility Types)

제네릭 유틸리티 타입(Generic Utility Types) 타입 조작과 변환을 유연하게 할 수 있도록 타입스크립트에서 제공하는 유틸리티 타입이다. Record Record는 타입스크립트에서 사용되는 제네릭 유틸리티 타입 중의 하나이다. 기본적으로 Record와 같은 형태로 사용되며, 객체의 속성들을 정의할 때 사용한다. Partial T의 모든 속성을 선택적으로 만들어주는 타입으로, T 타입의 각 속성이 선택적으로 처리된다. 아래의 코드를 보면 단순히 User 타입으로 한 user의 경우 name과 email 속성이 정의되지 않아 에러가 발생하고 있지만, Partial타입의 partialUser의 경우 User 타입의 모든 속성이 선택적이 되어 name과 email이 정의되어 있지 않아도 에러가 발..

Typescript 2023.11.21

[ Next.js ] - app router란?

App router란? 기존에 nextjs에서 pages 폴더를 통하여 사이트의 라우팅을 하던 방식과 달리 파일 구조에 따라 사이트의 경로를 설정하는 방식이다. npx create-next-app를 통해 nextjs 어플리케이션 프로젝트를 생성할 경우 기존의 pages router 방식에서는 pages 폴더가 존재했으나 app router 방식에서는 src/app 폴더가 존재하며, 해당 폴더의 하위에 생성되는 폴더와 파일을 기준으로 사이트의 경로가 설정된다. 더불어 src/app 폴더의 하위에 기본적으로 layout.tsx 파일과 page.tsx 파일이 존재하는데, 파일명을 보면 알 수 있듯이 layout.tsx파일은 레이아웃을 정의하는 파일이며, page.tsx 파일은 사용자가 실질적으로 사이트의 루..

Javascript/Next.js 2023.11.19

[ Typescript ] - interface와 type의 차이

interface와 type의 차이 interface와 type 둘 다 타입스크립트에서 타입을 정의하기 위해 사용하며, 유사하지만 다음과 같이 차이를 지닌다. HTML 삽입 미리보기할 수 없는 소스 interface는 주로 구조적인 타입을 정의할 때 사용한다. interface의 선언 interface [interface명] { } ex) interface Person {} interface는 또한아래와 같이 동일한 명칭을 가진 interface를 여러 개 구현하는 것이 가능하며, 이때 해당 interface를 타입으로 선언하여 사용할 경우, 해당 interface 명칭을 가진 속성을 모두 포함하게 된다. interface Person { name: string; } interface Person { a..

Typescript 2023.11.16