저는 nest js를 이용한 백엔드 개발 시 컨트롤러에 전달받을 수 있는 쿼리 스트링, 라우트 파라미터, body 값 등에 대한 유효성 검증이 필요한 경우가 종종 있었습니다. 예를 들어 컨트롤러에서 intValue를 숫자형으로 받고 이를 활용한 비즈니스 로직을 설계했다고 가정합니다. 이때 컨트롤러에서 전달받은 intValue에 'hi'라는 문자열이 전달되면 어떻게 될까요? 예상치 못한 에러가 발생할 수 있죠. 이를 위해 저는 컨트롤러에서 전달받은 파라미터에 대한 유효성 검증 방법을 조사해보았습니다.  컨트롤러 파라미터 특징✅ 파라미터는 문자열로 전달된다✅ 기본적인 유효성 검증은 없다 controller에서 @Query 혹은 @Param, @Body 등의 파라미터는 모두 문자열로 들어옵니다. 예를 들어, ..

react를 이용해 작업하던 중 채팅창을 구현하려고 했습니다. textarea 태그를 이용해 채팅 입력 부분을 구현했고 해당 textarea에 onKeyUp 옵션을 적용해 엔터키를 누를 시 작성된 값이 서버로 전송되게 하려고 했습니다. 하지만 이때 이상한 에러가 발생했습니다. 영어를 작성하면 onKeyUp이 정상적으로 작동했지만, 한글로 작성하면 onKeyUp에 설정된 함수가 두 번 중복되어 실행되는 모습을 확인할 수 있었습니다. 이때 해결할 수 있는 방법을 공유하겠습니다. 상황onKeyDown, onKeyUp, onKeyPress 에러textarea나 input 태그에서는 onKeyDown, onKeyUp, onKeyPress 등을 이용해 키보드 이벤트를 탐지할 수 있습니다. 이때 크롬 브라우저에서 한..

데이터베이스의 하나의 테이블은 다양한 외래키를 가지는 경우가 흔합니다. 그리고 이런 테이블 데이터를 조회할 때 외래키에 대한 정보가 필요한 경우가 있습니다. 만약 게시물을 작성하는 기능을 구현했다고 가정합시다. 그럼 게시물 테이블과 유저 테이블은 N:1 관계를 맺고 있겠조? 이때 게시물 테이블에서 특정 게시물 데이터를 조회하는 과정에 해당 게시물을 작성한 유저의 pk값만 불러오고 싶다면 어떻게 할까요? ( 해당 게시물을 작성한 유저 정보 전부가 아닙니다. pk만! ex) 해당 게시물을 작성한 유저의 pk값 하나만 알고 싶은겁니다. ) 오늘은 typeorm을 이용한 조회 시 연관 관계 설정된 테이블의 모든 정보를 조회하지 않고 단순히 연관 관계 설정된 컬럼의 단순 데이터 하나만 필요할 때 어떻게 설정해야하..

NestJS에서는 컨트롤러에 쉽게 라우팅 설정이 가능합니다. 이때 다음과 같은 궁금증이 생겼습니다./post/:id 과 /post/category 두 경로는 어떻게 구분하는거지?/post/:id 와 /post/1 두 경로가 모두 존재한다면 어느 경로로 이동되지?오늘은 이렇게 헷갈리는 경우들을 모두 직접 테스트한 내용을 공유합니다.(이전 글)  [NestJS] 컨트롤러에서 브레이크 포인트 안 걸릴 때 체크해야할 것들! ( 동적 경로, 정적 경로, route저는 NestJS를 활용한 개발에 vscode를 이용하고 있습니다. 이때 vscode에는 브레이크 포인트(중단점)을 찍어서 디버깅할 수 있는 기능을 제공합니다. 그런데 가끔 Controller에 구현한 코드 위에 브레이sparkit.tistory.com ..

이전에 벨로그를 사용할 때는 시리즈를 구현할 수 있었습니다. 예를 들어 같은 주제의 글을 1편, 2편,... n 편 이런 식으로 시리즈물로 만들 수 있는 것이죠. 하지만 티스토리에서는 관련 기능이 없는 것으로 보입니다. 그래서 어떻게 하면 시리즈로 글을 작성해야 할 때 시리즈 글 목록을 보여줄 수 있는 방법에 대해 고민해 보았고 약간의 꼼수를 부려보아 해결해 보았습니다. 태그를 시리즈로티스토리에서는 태그 기능을 제공합니다. 저는 이 기능을 활용해 시리즈 기능을 흉내 내면 좋을 것 같다고 생각했습니다. 예를 들어 '티스토리 커스텀' 관련 시리즈 글들을 작성한다고 가정합시다. 그러면 해당 글들을 작성할 때는 태그에 '티스토리 커스텀'을 추가합니다. 이러면 '티스토리 커스텀' 태그를 조회해 글에서 목록으로 보..

티스토리 블로그를 시작하고 가장 신경쓰인 부분이 블로그 레이아웃입니다. 생각보다 많은 스킨이 제공되지 않더라고요. 그래서 일단 가장 많이 사용된다는 Odyssey 스킨을 적용한 후, 제가 직접 커스텀을 하기로 결정했습니다. 여러 커스텀 중 하나가 바로 sticky sidebar 입니다.❓sticky sidebar란?sticky sidebar란 페이지를 스크롤할 때 사이드바가 화면의 일정 위치에 고정되어 따라오는 UI 요소를 말합니다. 즉, 사용자가 페이지를 아래로 스크롤할 때 사이드바가 페이지를 스크롤함에 따라 함께 움직이지 않고, 설정된 위치에 "고정"되어 계속 화면에 보이게 되는 기능입니다. 이는 주로 내비게이션 메뉴나 중요한 정보가 담긴 요소에 사용됩니다.저는 블로그 글을 빠르게 훑기 위해서는 to..

저는 NestJS를 활용한 개발에 vscode를 이용하고 있습니다. 이때 vscode에는 브레이크 포인트(중단점)을 찍어서 디버깅할 수 있는 기능을 제공합니다. 그런데 가끔 Controller에 구현한 코드 위에 브레이크 포인트를 걸었음에도 불구하고 디버깅이 되지 않는(브레이크 포인트에 걸리지 않음) 경우가 가끔 있었는데요. 이때 제가 경로 설정 관련해서 놓치고 있던 정보들을 공유해 이런 에러 해결에 도움을 주려 합니다. 문제 상황# controller 코드 중 일부@Controller('post')export class PostController { constructor(private readonly postService: PostService) {} @Get(':id') async f..

저는 NestJS 프레임워크에서 tpyeorm을 사용해 데이터를 조회할 때 findBy 혹은 findOneBy 메서드를 사용해 왔습니다. 이때 메서드명을 통해 하나의 데이터만 조회하기 위해서는 findOneBy를 이용했고, 여러 데이터를 조회하기 위해서는 findBy를 사용했습니다. 하지만 만약 findBy를 이용해 하나의 데이터를 조회한다면 굳이  findOneBy 메서드의 필요성이 있을까? 혹시 하나의 데이터를 조회하는데 최적화된 방법이 findOneBy일까? 고민되었습니다. 이런 고민을 토대로 제가 알아본 findBy VS findOneBy, 어떤 메서드가 더 효율적인지에 대해 제 의견을 공유해보려합니다. 메서드 및 쿼리findBy 메서드 쿼리먼저 findBy 메서드를 사용했을 때는 하나의 쿼리만 ..

[TypeORM] @OneToMany, @ManyToOne - 옵션: cascade[TypeORM] @OneToMany, @ManyToOne - 옵션: eager / lazy[TypeORM] @OneToMany, @ManyToOne - 옵션: onDelete / onUpdate typeorm 사용해서 1:N 관계, N:1 관계를 구현할 때 사용되는 eager / lazy 옵션에 대한 설명입니다. onDelete / onUpdate설명에 앞서 설명에서 사용될 용어들을 미리 설명하고 가겠습니다.부모(엔티티)1:N 관계에서 1 쪽 엔티티를 의미. 게시물과 댓글 관계에서 게시물이 부모 역할을 한다.자식(엔티티)1:N 관계에서 N 쪽 엔티티를 의미. 게시물과 댓글 관계에서 댓글이 자식 역할을 한다.✅ 정의외래 키..

[TypeORM] @OneToMany, @ManyToOne - 옵션: cascade[TypeORM] @OneToMany, @ManyToOne - 옵션: eager / lazy[TypeORM] @OneToMany, @ManyToOne - 옵션: onDelete / onUpdate typeorm 사용해서 1:N 관계, N:1 관계를 구현할 때 사용되는 eager / lazy 옵션에 대한 설명입니다. eager / lazy설명에 앞서 설명에서 사용될 용어들을 미리 설명하고 가겠습니다.부모(엔티티)1:N 관계에서 1 쪽 엔티티를 의미. 게시물과 댓글 관계에서 게시물이 부모 역할을 한다.자식(엔티티)1:N 관계에서 N 쪽 엔티티를 의미. 게시물과 댓글 관계에서 댓글이 자식 역할을 한다.✅ 정의연관된 데이터의 로딩..