기록공간

스토리지(Storage)? 스토리지는 HTML5에서 추가되었다. 스토리지는 window(창) 객체의 하위 객체로, 하드에 영구로 저장되는 로컬 스토리지와 브라우저 실행 중에만 유효한 세션 스토리지 이렇게 두 종류로 나뉜다. 로컬 스토리지의 형태 로컬 스토리지는 키(Key)와 값(Value)의 형태로 이루어져있고, 이를 바탕으로 저장된다. 키는 저장된 값을 식별하고 가져오는데 사용된다. 키를 사용해 값을 저장하고, 반대로 값을 요청할 때에는 키를 통해서 하게된다. 키에 저장되는 값은 숫자나 문자열 또는 객체나 배열 같은 형태로 저장할 수 있다. 로컬 스토리지 메서드 및 속성

자바스크립트 코드는 html 태그 어디에 놓더라도 동작한다. 하지만 일반적인 사이트들의 html 코드를 살펴보면 맨 마지막에 가 삽입되어 있다는 것을 알 수 있다. 도대체 어떤 이유가 있는 것일까? 만약 다음과 같이 자바스크립트를 삽입했다고 가정해보자. 이렇게 간단한 자바스크립트 코드는 별 문제가 생기지 않을 것이다. 하지만 매우 무거운 자바스크립트 코드들이 포함되어 있다면 어떨까? 그 코드들을 불러오고 실행하느라, 그 밑에 있는 html 코드들이 로딩되지 못하게 될 것이고, 이는 브라우저가 렌더링 되는 것에 방해가 될 수 있다. 그래서 사용자는 완성되지 않은 중간 화면을 오랫동안 쳐다보고 있어야 할지도 모른다. alert( "Hello, JavaScript...!"); 다음과 같이 자바스크립트 코드를 ..

바닐라 자바스크립트? 바닐라 자바스크립트(Vanilla JS)란 프레임워크 또는 라이브러리가 적용되지 않은 순수한 자바스크립트를 뜻한다. 왜 하필 바닐라(Vanilla)? 위키백과에 따르면 바닐라의 뜻은 다음과 같다. 바닐라는 향신료 중 하나로, 난초의 일종인 바닐라속에 속해 있으며, 원산지는 멕시코이다. 바닐라라는 이름은 스페인어 "Vainilla"에서 나왔으며 작은 꼬투리, 콩을 뜻한다. 뜻에서 유추할 수 있듯, 바닐라는 콩이라는 뜻으로 "핵심, 근본이 되는" 이라는 의미를 비유적으로 표현할 수 있다. 그러므로 바닐라 자바스크립트는 핵심이 되는 아무것도 포함되지 않은 순수 자바스크립트를 함축적으로 표현하는 것이다. 프로그래밍적 관점에서의 바닐라 자바스크립트 오늘날 자바스크립트는 다양한 프레임워크와 라..

HTML의 특징 중 하나인 시맨틱(Semantic) 태그에 대해서 알아보도록 하자. 시맨틱 태그란? 우선 시맨틱(Semantic)이라는 단어가 무슨 뜻인지 부터 살펴보도록 하자. 시맨택(Semantic)은 "의미의, 의미론적인"이라는 뜻이다. 즉 HTML5에 도입된 시맨틱 태그는 개발자와 브라우저에게 의미있는 태그를 제공하게 된다. 예를 들어, 태그는 시맨틱이 아닌(non-semantic) 태그인 반면, , 태그는 시맨틱(sematic) 태그라고 볼 수 있다. 태그만 보고는 이 태그에 어떤 것이 들어갔는지 알 수 없다. 하지만, , 태그는 대략 어떤 내용이 들어갈지 그 의미를 유추할 수 있다. 태그 안에는 표가 들어갈 것이고, 태그 안에는 글이 들어갈 것이라는 정도는 유추가 가능하다. 위와 같이, 시맨틱..

AOP(Aspect Oriented Programming)은 흔히 '관점 지향 프로그래밍'이라는 용어로 번역되는데, 이때 '관점(Aspect)' 이라는 용어가 현실적으로 와닿지 않기 때문에 어렵게 느껴질 수 있다. '관점'이라는 용어는 개발자들에게는 '관심사(concern)'라는 말로 통용된다. '관심사'는 개발 시 필요한 고민이나 염두에 두어야 하는 일이라고 생각할 수 있는데, 코드를 작성하면서 염두에 두는 일들은 주로 다음과 같다. 파라미터가 올바르게 들어왔는가? 이 작업을 하는 사용자가 적절한 권한을 가진 사용자인가? 이 작업에서 발생할 수 있는 모든 예외는 어떻게 처리해야 하는가? 위와 같은 고민들은 핵심 로직은 아니지만, 코드를 온전하게 만들기 위해서 필요한 고민들인데 전통적인 방식에서는 개발자..

prefix : 실행될 쿼리의 문 안에 쿼리 가장 앞에 붙여준다. UPDATE board username=#{username}, password=#{password} 실행결과 : UPDATE board SET username=#{username}, password=#{password} prefixOverrides : 실행될 쿼리의 문 안에 쿼리 가장 앞에 해당하는 문자들이 있으면 자동으로 지워준다. SELECT * FROM board WHERE id=#{id} OR TT LIKE '%'||${searchContent}||'%' 실행결과 : SELECT * FROM board WHERE id=#{id} TT LIKE '%'||${searchContent}||'%' suffix : 실행 될 쿼리의 문 안에 ..

태그가 있는 HTML 문서를 서버로 보내면(POST) 곧이어 다른 페이지로 Redirect 된다고 가정해보자. 하지만 Redirect 방식은 GET방식이기 때문에 이러한 데이터 전송에는 적절하지 않다. 다음 그림은 Redirect의 특징을 나타낸다. Spitter라는 객체를 보내려고 한다. 하지만 Redirect가 발생하면 원래 요청은 끊어지고, 새로 HTTP GET 요청이 시작된다. 왜냐하면 Redirect는 서버가 브라우저(사용자)에게 "Redirect할 URL로 GET 요청 방식을 사용해 Redirect 해라" 라고 명령을 내리는 것이기 때문이다. 그러므로 Model에 담겨져 있던 데이터 Spitter 객체는 소멸한다. 결국 Redirect를 사용하여 Model 객체를 전달하는 것은 의미가 없다. ..

톰캣을 실행시 다음과 같은 오류가 뜬다면 Log4j2 라이브러리를 찾을 수 없다는 뜻이다. Maven으로 프로젝트를 진행하고 있다면 Log4j2는 API와 Core로 나뉘기 때문에 pom.xml에 이 두가지 라이브러리를 모두 추가 해주어야 한다. org.apache.logging.log4j log4j-api 2.0.1 org.apache.logging.log4j log4j-core 2.0.1 다음 링크에서 자기의 버전에 따른 pom.xml 추가 태그를 제공받을 수 있다. logging.apache.org/log4j/2.x/maven-artifacts.html