소소한 개발일기

Lab 1. 웹팩 엔트리/아웃풋 실습: 1-webpack/1-entry 1. Lab1 브런치로 이동하기 /lecture-frontend-dev-env ❯ git checkout -f 1-webpack/1-entry 2. 프로젝트 초기화 및 package.josn 파일 생성 /lecture-frontend-dev-env ❯ npm init -y 3. webpack, webpack-cli 패키지 설치 /lecture-frontend-dev-env ❯ npm install -D webpack webpack-cli 4. webpack.config.js 생성 후, 설정 /lecture-frontend-dev-env/webpack.config.js const path = require('path');...

프론트엔드 개발 환경의 이해 2(Lint, 웹팩 심화) 개발환경을 구성하는데 필요한 도구 Lint(린트) 코드에서 발견된 문제 패턴을 식별하기 위한 정적 코드 분석 도구 1. ESLint 1.1 기본 개념 ESLint는 ECMAScript 코드에서 문제점을 검사하고 일부는 더 나은 코드로 정정하는 린트 도구 중의 하나다. 코드의 가독성을 높이고, 잠재적인 오류와 버그를 제거해 단단한 코드를...

프론트엔드 개발 환경의 이해 1(NPM, 웹팩, Babel) 개발환경을 구성하는데 필요한 도구 Node.js 프로젝트 전반에 사용되는 자바스크립트 기반 플랫폼 Webpack 모듈로 분리하여 코딩할 수 있게 도와주는 모듈 번들 Babel 구형 브라우저에서도 최신 자바스크립트 문법을 사용할 수 있도록 도와주는 도구 1. NPM(Node Package Manage) 1.1 왜 프론트엔드 개발에 Node.js가 필요한가? 1.1.1 최신...

자바로 배우는 리팩토링 입문 리팩토링 정의 리팩토링이란 외부에서 보는 프로그램 동작은 바꾸지 않고 프로그램의 내부 구조를 개전하는 것이다. 리팩토링해도 외부에서 보는 프로그램 동작은 변하지 않는다. 리팩토링하면 프로그램의 내부 구조가 개선된다. 리팩토링과 유닛 테스트 리팩토링해도 외부에서 보는 프로그램 동작은 변하지 않아야 한다. 이를 확인하기 위해 적어도 유닛 테스트(단일테스트)를 해야 한다. 리팩토링의...

방문자(Visitor) 의도 객체 구조를 이루는 원소에 대해 수행할 연산을 표현한다. 연산을 적용할 원소의 클래스를 변경하지 않고 새로운 연산을 정의할 수 있게 한다. 활용성 방문자 패턴은 다음의 경우에 사용한다. 다른 인터페이스를 가진 클래스가 객체 구조에 포함되어 있으며, 구체 클래스에 따라 달라진 연산을 이들 클래스의 객체에 대해 수행하고자 할 때 구조 Visitor...