덕's 머니스토리

thymeleaf 템플릿 엔진을 사용 중에 meta, link, input 태그 등을 닫지 않으면 아래와 유사한 에러 메시지가 뜹니다.org.xml.sax.SAXParseException: Open quote is expected for attribute “charset” associated with an element type “meta”.thymeleaf의 기본 설정이 아래 처럼 HTML5로 설정되어 있기 때문입니다. spring.thymeleaf.mode = HTML5 html 파일들을 webpack 등을 이용해 빌드를 하는 경우 등 수작업으로 맞춰주기가 귀찮거나 번거로운 경우에는 thymeleaf 모드를 legacy html5 모드로 변경해주면 됩니다.thymeleaf를 legcay html5 모..

ECMAScript 6 이 문서는 https://github.com/lukehoban/es6features 를 번역한 내용입니다. 번역 문서를 읽는 중, 오타나 어색한 문장이 있으면 이슈를 등록해주세요! Introduction ECMAScript 2015로도 알려져 있는 ECMAScript 6는 ECMAScript 표준의 가장 최신 버전입니다. ES6는 새로운 언어 기능이 포함된 주요 업데이트이며, 2009년도에 표준화된 ES5 이후로 언어 기능에 대한 첫 업데이트이기도 합니다. 현재 주요 JavaScript 엔진들에서 ES6 기능들을 구현 중에 있습니다. ECMAScript 6 언어의 전체 스펙을 확인하시려면 ES6 Standard를 확인하세요. ES6는 아래의 새로운 기능들을 포함하고 있습니다. ar..

foreach 반복문 foreach 반복문은 오직 Array 객체에서만 사용가능한 메서드입니다.(ES6부터는 Map, Set 등에서도 지원됩니다) 배열의 요소들을 반복하여 작업을 수행할 수 있습니다. foreach 구문의 인자로 callback 함수를 등록할 수 있고, 배열의 각 요소들이 반복될 때 이 callback 함수가 호출됩니다. callback 함수에서 배열 요소의 인덱스와 값에 접근할 수 있습니다. var items = ['item1', 'item2', 'item3']; items.forEach(function(item) { console.log(item); }); // 출력 결과: item, item2, item3 for …in 반복문 for in 반복문은 객체의 속성들을 반복하여 작업을 수..

Vue.js로 만든 어플리케이션이 규모가 커지게 되면 컴포넌트들을 분리함으로써 복잡성을 제어할 수 있습니다. 이를 통해 재사용성, 테스트 및 유지보수 용이라는 장점을 누릴 수 있습니다. 하지만 컴포넌트를 분리하면 각 컴포넌트 간의 통신은 더 불편해지게 됩니다. 이제 이벤트 버스(event bus)를 통해 이벤트 기반의 컴포넌트 간의 통신하는 방법을 살펴보겠습니다. Vue.js 이벤트 인터페이스 Vue.js에는 다음과 같은 이벤트 인터페이스가 존재합니다. $on(eventName) : 이벤트 감지 $emit(eventName) : 이벤트 트리거 동일 컴포넌트 내에서는 $on과 $emit을 이용하여 이벤트를 주고 받을 수 있습니다. 하지만 부모-자식 관계에서 $on을 이용하여 자식 컴포넌트에서 호출한 이벤트..

이 글은 vue-cli 2버전에 대해서 다룹니다. 현재 webpack 4가 탑재된 vue-cli 3버전이 나왔지만 베타(RC)버전입니다. Introduction 이 환경 설정은 대형 프로젝트에 적합하며, Webpack 과 vue-loader에 대한 사전지식이 있다고 가정하에 진행됩니다. 시작하기 전에 vue-loader 문서를 먼저 읽어보는 것을 추천합니다.Vue 프로젝트 템플릿은 빠르게 어플리케이션 코드를 작성할 수 있도록 대부분의 기능을 갖춘 개발 도구 설정을 제공합니다. vue list를 실행하여 사용가능한 공식 템플릿을 확인할 수 있습니다. 현재 사용할 수 있는 템플릿 목록은 다음과 같으며 이 튜토리얼에서는 webpack 템플릿을 이용하여 진행합니다. 만약 단순히 vue-loader를 경험하려고 ..

JetBrains에서 제공하는 IDE에서 ESLint의 설정된 룰에 맞게 자동으로 보정해주는 ESLint autofix 기능을 제공합니다. IntelliJ 혹은 WebStrom에서 사용할 수 있습니다.ESLint 경고가 뜨는 곳에서 ALT + ENTER 키를 누르면 다음과 같은 화면이 뜹니다.그리고 ESLint: Fix current file 을 눌러주면 끝입니다.그러면 다음과 같이 설정에 맞게 알아서 수정이 됩니다. 참고로 WebStrom은 2016.3 버전 이상에서만 기본으로 탑재되어 있다고 합니다.WebStrom 2016.3 이하의 버전에서 ESLint autofix 기능을 사용하고 싶으면 다음의 링크를 통해 설정하시면 됩니다.https://blog.jetbrains.com/webstorm/2016..

이펙티브 자바 Effective Java 2/E국내도서저자 : 조슈아 블로크(Joshua Bloch) / 이병준역출판 : 인사이트 2014.09.01상세보기 제네릭화(genericfication)로 혜택을 보는 것은 클래스뿐만 아니다. 메서드도 혜택을 본다. static 유틸리티 메서드는 특히 제네릭화하기 좋은 후보다. // 무인자 자료형 사용 - 권할 수 없는 방법(규칙23) public static Set union(Set s1, Set s2) { Set result = new HashSet(s1); result.addAll(s2); return result; } 형인자를 선언하는 형인자 목록(type parameter list)은 메서드의 수정자(modifier)와 반환값 자료형 사이에 둔다. //..

이펙티브 자바 Effective Java 2/E국내도서저자 : 조슈아 블로크(Joshua Bloch) / 이병준역출판 : 인사이트 2014.09.01상세보기 제네릭 자료형을 직접 만드는 것은 까다로운데, 배워둘 만한 가치는 있다. // Object를 사용한 컬렉션 - 제네릭을 적용할 중요 후보 public class Stack { private Object[] elements; private int size = 0; private static final int DEFAULT_INITIAL_CAPACITY = 16; public stack() { elements = new Object[DEFAULT_INITIAL_CAPACITY]; } public void push(Object e) { ensureCapa..