jamie-study

BrowerserRouter 적용 // App.js function App() { return ( } // --> "/" 접근 시 "/page" 링크로 이동 // = "/page" = "/page/:id" // --> 위에서 지정한 경로 외 ); } element에 Navigate를 사용하면 특정 링크 접근 시 다른 링크로 이동하게 할 수 있다! page 부분 : 위 코드는 내가 보기 편하려고 적용해본 것인데, 아래와 같이 써도 됨! 네비게이션에 Link 적용 // Nav.js function Nav() { return ( 메인 페이지 ); } 는 태그로 처리

React를 시작할 때마다 항상 폴더 구조가 고민이다 새로운 프로젝트를 시작했는데, 역시나 또 여기서부터 막혔다 물론 이전 프로젝트들 그대로 해도 되지만 좀 더 편하고, 효율적인 방향으로 하고 싶었고, 다른 사람들은 어떻게 하는지 궁금하기도 했다 정답은 없다고 하지만, 누가 봐도 아 이런 폴더구나 알아볼 수 있는 정석적인 방법이 있지 않을까 싶었다 첫 프로젝트를 할 때는 위와 같이 컴포넌트를 많이 쪼개지 않았다 src 폴더 아래 components, pages 2가지 폴더를 만들어서 pages 폴더에는 템플릿 용도로 파일들을 넣고, 모두 components 폴더에 넣었다 src components pages 이렇게 하니 파일을 찾는 것 자체도 어려웠고, 한 파일에 코드도 길어져서 보기가 힘들었다 최근 프..

loadRelationCountAndMap 이용 await this.testRepository .createQueryBuilder('user') .select([ 'user.id', 'user.name' ]) .loadRelationCountAndMap('user.followerCount', 'user.follwers') .getMany() /** * Counts number of entities of entity's relation and maps the value into some entity's property. * Optionally, you can add condition and parameters used in condition. */ loadRelationCountAndMap(mapToPro..

관계설정 레시피와 재료는 OneToMany 관계이다. // recipe.entity.ts @Entity() export class Recipe extends BaseEntity { @IsString() @Column() title: string @OneToMany(() => Ingredient, (ingredient) => ingredient.recipe) ingredients: Ingredient[] } // ingredient.entity.ts @Entity() export class Ingredient { @PrimaryGeneratedColumn() id: number; @IsString() @Column({ length: 10 }) name: string @ManyToOne(() => Recip..

개요 하나의 일기에 여러 개의 이미지들과 테마들을 함께 등록할 수 있음 일기, 이미지, 테마는 각각 테이블을 하나씩 갖고 있음 테마는 유저가 수정할 수 없는 값으로, 데이터들을 미리 저장해뒀음 관계 설정 일기와 이미지 : OneToMany (하나의 일기에 여러 개의 이미지 등록 가능) 일기와 테마 : ManyToMany (각 일기는 여러개의 테마, 각 테마는 여러 개의 일기를 가질 수 있음) 일기 생성 API // create-diary.dto.ts import { PickType } from "@nestjs/mapped-types"; import { IsNumber, IsString } from 'class-validator'; import { Diary } from "../entities/diary...

query를 boolean으로 받아오고 싶어 @Type(() => number) 적용해 숫자로 변환하듯이 @Type(() => Boolean)을 적용했더니 늘 true 값을 받아옴 아래와 같이 해결 export const booleanMapper = new Map([ ['undefined', undefined], ['true', true], ['false', false], ]); // test.dto.ts import { IsBoolean } from 'class-validator'; import { Transform } from 'class-transformer'; import { booleanMapper } from 'src/common/dto/boolean-mapper'; export class T..

numberArray를 쿼리로 보낼 때 string으로 보내짐! controller나 service 레이어에서 파싱해도 되지만, 아예 데이터를 받아올 때 변환해서 받아오고 싶어서 아래와 같이 작성함 import { IsNumber } from 'class-validator'; import { Transform } from 'class-transformer'; export class TestDto { @Transform(({ value }) => (JSON.parse(value))) // '[1]' -> [1] 파싱 후 @IsNumber({}, { each: true }) // 검증 numberArray: number[] } 참고 블로그 https://choidr.tistory.com/entry/NestJ..

express의 @Res를 사용하면 Nest.js의 표준 방식이 자동 비활성화된다. 이를 해결하려면 아래 2가지 방법이 있다 내가 직접 res 응답 객체를 컨트롤하여 응답을 보내기 두 방식 다 사용하려면, { passthrough: true } 옵션을 사용하기 공식 문서 https://docs.nestjs.com/controllers#library-specific-approach 참고 블로그 https://greatlaboratory.dev/nestjs/nestjs-02/