DEVLOG DEVLOG

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..

원인 ESLint가 ES6 이상을 파싱할 때 발생하는 에러 해결 방법 1. babel-eslint 패키지를 설치 npm install babel-eslint 2. eslintrc.js 수정 module.exports = { ... parser: "babel-eslint", parserOptions: { jsx: true, ecmaVersion: 2020, }, ... };

원인 tsconfig파일에 outDir 옵션을 명시했을 경우에 발생 해결 방법 tsconfig파일에 exclude 옵션에 outDir path를 추가 { "compilerOptions": { ... "outDir": "./dist/", ... }, "exclude": ["./node_modules/", "./dist/**/*"] }

Jest JS Test Framework Test Runner, Test Matcher, Test Mock 모두 제공 사용법 npm install 2. package.json에 명령어 추가 // package.json { ... "scripts": { "test": "jest" } "jest": { "transform": { ".(ts|tsx)": "/node_modules/ts-jest/preprocessor.js" }, "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$", "moduleFileExtensions": ["ts", "tsx", "js"] } ... } Matchers // src/util/operator.ts const operat..

NestJS Document의 Authentication을 직접 실행해보는중에 문제가 발생함 docs.nestjs.com/techniques/authentication Documentation | NestJS - A progressive Node.js framework Nest is a framework for building efficient, scalable Node.js server-side applications. It uses progressive JavaScript, is built with TypeScript and combines elements of OOP (Object Oriented Progamming), FP (Functional Programming), and FRP (Functi..

// main.ts async function bootstrap() { const app = await NestFactory.create(AppModule); app.enableCors(); // 추가 await app.listen(3000); }

빠른 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 사용자와 애플리케이션이 상호 작용할 수 있도록 메소드를 호..