DEVLOG DEVLOG

1. Nest.js Auth module GraphQL로 Guard를 사용하려면 AuthGuard 클래스의 getRequest() 메소드를 오버라이드 해야함 @Injectable() export class JwtAuthGuard extends AuthGuard('jwt') { getRequest(context: ExecutionContext) { const ctx = GqlExecutionContext.create(context); return ctx.getContext().req; } } @Module({ imports: [ GraphQLModule.forRoot({ autoSchemaFile: 'schema.gql', context: ({ req }) => ({ req }), }), AuthModul..

Property Decorator @Prop @Prop(options: (PropOptions | Constructor[] | Constructor) = {}) import { Vue, Component, Prop } from 'vue-property-decorator' @Component export default class YourComponent extends Vue { @Prop(Number) readonly propA: number | undefined @Prop({ default: 'default value' }) readonly propB!: string @Prop([String, Boolean]) readonly propC: string | boolean | undefined } 각 Pro..

Class Component @Component decorator 사용하면 클래스 컴포넌트 사용 가능 import Vue from 'vue' import Component from 'vue-class-component' @Component export default class ExampleClass extends Vue { } data는 클래스의 property로 선언 가능 import Vue from 'vue' import Component from 'vue-class-component' @Component export default class ExampleClass extends Vue { private exampleData: string = 'example'; } method는 클래스의 functi..

빠른 Vue.js 개발을 위해 프로젝트의 구성을 도와주는 모듈 CLI vue create : Vue.js 프로젝트를 생성 vue ui : UI를 통해 프로젝트를 관리하는 CLI Service webpack, webpack-dev-server 위에 구축이 되며 CLI Plugin을 실행하는 핵심 서비스와 web pack에 대한 설정을 포함 webpack을 통해 애플리케이션의 개발 서버 실행, 빌드 등을 처리 CLI Plugin Bable/Typescript, ESLint, e2e Test 등과 같은 선택적으로 설치가 필요한 Plugin 사용법 설치 $ npm i -g @vue/cli 프로젝트 생성 $ vue create features Babel : ES6 이상 버전이나 Typescript로 코딩한 경우 ..

Vue에서 제공하는 특수 속성으로 v- 접두어가 붙어있음 렌더링 된 DOM에 특수한 반응형 동작을 지시 종류 1. v-text {{ }}의 기능과 동일 2. v-html HTML 태그를 지원 3. v-show 해당 엘리먼트를 보여줄지 여부(true/false) 4. v-if 엘리먼트의 표시 여부에 대한 조건문 v-else-if, v-else value > 5 5. v-pre 해당 엘리먼트에 지시문이 없다는걸 컴파일러에게 알려 컴파일 타임에 건너뜀 컴파일 속도를 향상 시킬 수 있음 6. v-cloak Vue 인스턴스가 준비되기 전 템플릿을 위한 HTML코드를 숨길 때 사용 value > 5 7. v-for {{ todo.text }} 8. v-on 사용자와 애플리케이션이 상호 작용할 수 있도록 메소드를 호..