JWT란 JSON Web Token의 약자로, 두 개체에서 JSON 객체를 사용하여 가볍고 자가 수용적인(self-contained) 방식으로 정보를 안전성 있게 전달해준다. 자가수용적이라는 것은 필요한 모든 정보를 자체적으로 지니고 있다는 뜻이다. JWT 시스템에서 발급된 토큰은 토큰에 대한 기본정보, 전달할 정보 (로그인 시스템에서는 유저 정보) 그리고 토큰이 검증됐다는 것을 증명해주는 signature를 포함한다. JWT를 만들때는 JWT를 담당하는 라이브러리가 자동으로 인코딩 및 해싱 작업을 해준다. 다양한 프로그래밍 언어에서 지원 자가 수용적(self-contained). 사용자 인증에 필요한 모든 정보를 토큰 자체에 포함하기 때문에 별도의 인증 저장소가 필요없음. 쉽게 전달 될 수 있음. 두 ..

웹 기술의 진화 웹은 1993년 HTML 기반의 정적 페이지에서부터 시작되었다. 이 때 모든 웹사이트의 주요 기능은 단순히 링크가 전부였다. 사람들이 정적 웹사이트에 지루함을 느끼기 시작할 때, 누군가가 "정적인 페이지를 동적으로 만들자"라고 외쳤고, 그렇게 자바스크림트(Javascript)가 탄생했다. 그로부터 몇 년 후, 존 레식은 여러 브라우저에서 정상적으로 작동하는 자바스크립트 코드를 개발자들이 쉽게 작성할 수 있도록 jQuery를 만들었다. 이후 2010년 구글에선 강력한 단일 페이지 웹 애플리케이션(single-page web application)을 구축할 수 잇는 Angular JS를 소개해, 큰 인기를 끌었다. 그리고 2013년에는 페이스북의 소프트웨어 엔지니어인 Jordan Walke가..

ESNext의 주요 문법 살펴보기 (1) 비구조화 할당(destructuring assignment) ESNext는 '비구조화 할당(destructuring assignment)'이라고 하는 구문을 제공한다. 비구조화 할당은 객체와 배열에 적용할 수 있다. 다음 코드는 비구조화 할당을 적용한 예이다. let person = {name: "Jane", age: 22} let {name, age} = person // name = "jane", age = 22 let array = [1, 2, 3, 4] let [haed, ...rest] = array // head = 1, rest = [2, 3, 4] let a = 1, b = 2; [a, b] = [b, a] // a = 2, b = 1 02행을 살펴..

세 종류의 자바스크립트 자바스크립트는 현재 세 가지 종류가 있다. 웹 브라우저에서 동자갛는 표준 자바스크립트인 ES5(ECMAScript 5)와 2015년부터 매년 새로운 버전을 발표하는 ESNext, 그리고 ESNext에 타입(type) 기능을 추가한 타입스크리트(TypeScript)이다. 다음 그림은 ES5, ESNext, 타입스크립트 간의 관계를 보여준다. ESNext는 ES5의 모든 문법을 포함하고, 타입스크립트는 ESNext의 모든 문법을 포함한다. 따라서 타입스크립트로 개발했더라도 타입 기능을 사용하지 않는다면 ESNext 소스나 마찬가지이다. *ESNext 자바스크립트란? 자바스크립트의 공식 표준은 ECMAScript(줄여서 ES)이다. 2009년 발표된 ES5 버전이 있었는데 2015년에 ..

Virtual DOM 리액트의 주요 특징 중 하나는 Virtual DOM을 사용하는 것이다. DOM이란? Virtual DOM을 알아보기 전에, 먼저 DOM이 무엇인지부터 제대로 짚고 넘어가자. DOM은 'Document Object Model'의 약어이다. 즉, 객체로 문서 구조를 표현하는 방법으로 XML이나 HTML로 작성한다. 웹 브라우저는 DOM을 활용하여 객체에 자바스크립트와 CSS를 적용한다. DOM은 트리 형태라서 특정 노드를 찾거나 수정하거나 제거하거나 원하는 곳에 삽입할 수 있다. DOM은 과연 느릴까? 요즘 DOM API를 수많은 플랫폼과 웹 브라우저에서 사용하는데, 이 DOM에는 치명적인 한 가지 문제점이 있다. 바로 동적 UI에 최적화되어 있지 않다는 것이다. HTML은 자체적으로는..

리액트 이해 리액트는 자바스크립트 라이브러리로 사용자 인터페이스를 만드는 데 사용한다. 구조가 MVC, MVW 등인 프레임워크와 달리 오직 V(View)만 신경쓰는 라이브러리이다. 리액트 프로젝트에서 특정 부분이 어떻게 생길지 정하는 선언체가 있는데, 이를 컴포넌트(component)라고 한다. 컴포넌트는 다른 프레임워크에서 사용자 인터페이스를 다룰 때 사용하는 템플릿과는 다른 개념이다.템플릿은 보통 데이터셋이 주어지면 HTML 태그 형식을 문자열로 반환하는데, 이와 달리 컴포넌트는 좀 더 복합적인 개념이다. 컴포넌트는 재사용이 가능한 API로 수많은 기능들을 내장하고 있으며, 컴포넌트 하나에 해당 컴포넌트의 생김새와 작동 방식을 정의한다. 사용자 홤녀에 뷰를 보여 주는것을 렌더링이라고 한다. 리액트 라..

JAVA, C++, C#은 모두 객체지향 언어(Object-Oriented Programming, OOP)이다. 논리와 연산, 제공하는 서비스는 비슷하다. 모든 언어는 각자의 개성과 특징이 있으며, 깊게 보면 탄생 배경에 비롯된 언어마다의 철학이 있다고 생각한다. C++과 JAVA, C# 또한 이러한 점에서 각자 다른 차이가 있다. C++(1983) C++의 초창기는 “C보다 더 좋은 언어”를 목적으로 개발되었다고 사료된다. 사례로는 C++은 C언어로 컴파일링 후 기계어로 다시 컴파일링되는 형식이었다. C는 마이크로 프로세서가 직접 기계어로 번역해주지만, C++은 C언어에서 실행 가능한 파일로 만들어주는 셈이었다. 현재는 객체지향적 언어로 손꼽히고 있지만 C와 유사한 면이 많기에 어떠한 응용프로그램, 임..

제어의 역전 (Inversion Of Control, IoC) Don't call us, we will call you. - 헐리우드 원칙(Hollywood Principle) 우리가 프레임워크 없이 개발할 때에는 객체의 생성, 설정, 초기화, 메소드 호출, 소멸(이하 객체의 생명주기)을 프로그래머가 직접 관리한다. 또한 전통적인 프로그래밍에서는 외부 라이브러리를 사용할 때, 개발자가 직접 외부 라이브러리를 호출하는 형태로 이용한다. 하지만, 프레임워크를 사용하면 객체의 생명 주기를 모두 프레임워크에 위임할 수 있다. 즉, 외부 라이브러리가 프로그래머가 작성한 코드를 호출하고, 흐름을 제어한다. 이와 같이 개발자가 작성한 객체나 메서드의 제어를 개발자가 아니라 외부에 위임하는 설계 원칙을 제어의 역전이라..

간단한 정의 프레임워크 원하는 기능 구현에 집중하여 개발할 수 있도록 일정한 형태와 필요한 기능을 갖추고 있는 골격, 뼈대를 의미한다. 애플리케이션 개발 시 필수적인 코드, 알고리즘, DB 연동과 같은 기능들을 위해 어느 정도 뼈대(구조)를 제공하며 이러한 뼈대 위에서 사용자는 코드를 작성하여 애플리케이션을 개발한다. 앱/서버 등의 구동, 메모리 관리, 이벤트 루프 등의 공통된 부분은 프레임워크가 관리하며, 사용자는 프레임워크가 정해준 방식대로 클래스, 메서드들을 구현하면 된다. 프레임워크의 예시) Java 서버 개발에 사용되는 Spring Python 서버 개발에 사용되는 Django, Flask 안드로이드 앱 개발에 사용되는 Android 아이폰 앱 개발에 사용되는 Cocoa Touch 웹 개발에 사..

Java Bean 이란? 특정한 정보 (id, password, name, job...)등을 가지고 있는 클래스를 표현하는 하나의 규칙이고, 데이터를 표현하기 위한 목적을 지니고 있음. 이 규칙(규약)을 지닌 클래스를 Java Bean 이라고 함. Java Bean의 규약 반드시 클래스는 패키지화 되어야 함 멤버변수는 property(프로퍼티)라고 함 멤버변수는 private로 지정하고, 외부접근을 위한 get, set 메소드를 정의해야 함 get, set 메소드는 public으로 지정 JavaBean JavaBean은 데이터를 표현하는 것을 목적으로 하는 자바 클래스로서 아래와 같은 형태. JavaBean 규약에 따르는 클래스를 자바 빈 이라고 부르며, jsp에서 사용되는 자바 빈은 아래와 같은 형태...