Den`s blog

오늘은 Svelte 를 typescript 그리고 svelte materialUI 설치까지 진행해보고자 한다. 1. Svelte 설치 하기 명령어를 통해 svelte project 를 설치하면 끝 ! npx degit sveltejs/template your-project cd your-project 그런 다음 package 설치해주고, 실행해 보자. npm i npm run dev 하고 나면 (보통 8080 포트) localhost:8080 에서 아래 화면을 볼 수 있다. 이렇게 설치~실행까지 완료해 보았다. 2. Typescript 설치 나는 typescript 를 좋아하기 때문에 svelte 에 ts 를 적용하고자 한다. 이미 프로젝트에서 준비가 다 되어 있는 상태이기 때문에 아래 명령어를 입력해주..

React 에서 GraphQL을 사용할 때 보통 useQuery를 사용한다. useQuery 란, API 로 치면 API Call 을 하는 것이라고 보면 된다. const ITEMS_QUERY = gql` query allItemsQuery($input: AllItemInput!) { allItems { ok error items { name registeredAt } } } `; const { data, loading } = useQuery(ITEMS_QUERY, { variables: { input: { page: 1, } } }); 위 코드는 GraphQL 에서 allItemsQuery 의 Query가 있고 그 input 으로 AllItemInput 이 있을 경우다. (AllItemInput 은 p..

NestJS 에서는 AutoValidation 기능을 해주는 사랑스러운 아이가 있다..! @nestjs/common 에 있는 ValidationPipe 라는 아이. const app = await NestFactory.create(AppModule); app.useGlobalPipes( new ValidationPipe({ whitelist: true, forbidNonWhitelisted: true, transform: true, }), ); const app = await NestFactory.create(AppModule); app.useGlobalPipes( new ValidationPipe({ whitelist: true, forbidNonWhitelisted: true, transform: t..

코드의 실행시점에서만 알 수 있는 Type/Key 들이 있는데, 이를 정의를 하고 싶다, 꼼꼼해지려면 뭐 예를 들어 오브젝트를 받긴 할건데 이 것의 값들이 동적으로 변해야하는 상황 (예를 들면 여러 API 를 통합하는 것이 될 수 있다) 그럴 때 사용할 수 있는 것이 Indexable 이다. 코드부터 보고 시작하자. interface Indexable { [key: string]: any; } Index Signature [] 로 감싸주면 된다. const indexable: Indexable = { test1: 1, test2: 2, test3: 3, }; Object.keys(indexable).forEach((k) => console.log(indexable[k])); // 1, 2, 3 해당 문법..