분류 전체보기
인증과 인가
인증과 인가란 웹 서비스를 만들면서 서버와 데이터를 주고받는 기본적인 기능들을 구현하게 되는데, 이때 인증과 인가에 대한 개념을 모르고 넘어간다면 서버와의 통신이 막연하고 어렵게 느껴질 수 있다. 그래서 인증과 인가라는 개념을 먼저 정리해보려고 한다. 사전적 의미를 찾아보니 인증(Authentication)이란 어떠한 문서나 행위가 정당한 절차로 이루어졌다는 것을 공적기관이 증명한다는 뜻이고, 인가(Authorization)란 대상의 옳음을 밝혀 인정한다는 뜻이다. 이 두가지의 개념은 출입증에 비교하면 쉽게 이해할 수 있다. 방문자가 회사 건물에 방문했다고 가정했을 때, 1) 인증은 방문자가 자신이 회사 건물에 들어갈 수 있는지 확인을 받는 과정이다. 2) 인가는 방문자가 회사 건물에 방문했을 때, 어떤..
SPA (Single Page Application)
SPA를 이해하려면 우선 서버와 클라이언트의 관계를 이해해야 한다. User가 서버에 html 을 요청하면 서버에서 모든 html을 보내주었던 방식이 전통적인 서버 사이드 방식이다. 페이지를 로딩할 때 마다 서버로부터 리소스를 전달받아 렌더링을 하면 속도가 느려지고 트래픽도 낭비된다. 그래서 최근에는 클라이언트 사이드 방식으로 우선 애플리케이션을 브라우저에 로드한 다음 필요한 데이터만 서버에서 전달받아 다시 렌더링을 한다. 이러한 클라이언트 사이드 방식은 SPA에서 사용되는 방식이고, SPA 구현에 리액트가 사용될때 라우터가 필요하다. 라우터를 이해하기 위해 먼저 SPA가 무엇인지 알아보겠다. 1. SPA 란 SPA는 Single Page Application 의 약자로, 페이지가 1개인 어플리케이션이란..
JWT(Json Web Token)
인증과 인가 글에서 웹 서비스 인증 방법으로 4가지를 간단하게 소개했었는데, 그중 토큰 기반 인증은 최근 모던 웹서비스에서 가장 많이 사용되는 방식이다. 토큰을 기반으로 하는 인증 시스템을 사용하는 데에는 여러 이유가 있다. 서버는 무상태성(stateless)의 속성을 가지고 있는데, 이는 클라이언트에서 전달받은 상태를 저장하지 않는다는 것이다. 상태 정보를 저장하지 않기 때문에 서버에서는 클라이언트에서 보내는 요청만으로 작업을 수행하고 마친다. 이러한 서버의 무상태성으로 서비스가 커지고 사용 유저가 많아지더라도 그에 맞춰 서버도 확장할 수 있게 되었다. 또한 토큰기반 인증 시스템은 로컬 영역에 유저 정보를 저장하지 않기 때문에 session/cookie 시스템보다 보안을 높일 수 있다. 더불어 모바일 ..
데이터 타입 (Data Type)
1. 자바스크립트의 데이터 타입 앞의 '표현식과 문'에서 간단히 언급했던 데이터 타입에 대해 자세히 알아보려 한다. 데이터 타입(=자료형)은 값의 종류를 말한다. 자바스크립트의 모든 값은 데이터 타입을 갖고, 총 7개의 데이터 타입을 제공한다. 데이터 타입은 원시 타입(primitive type)과 객체 타입(object/reference type)으로 분류할 수 있다. 원시타입: 숫자, 문자열, 불리언, undefined, null, symbol 객체타입: 객체, 함수, 배열 등 1. 1 숫자 타입 자바스크립트는 하나의 숫자 타입만 존재한다. 자바스크립트는 2진수, 8진수, 16진수에 대한 데이터 타입을 제공하지 않기 때문에 이들 값을 참조하면 모두 10진수로 해석된다. 숫자 타입은 추가적으로 세가지 ..
표현식과 문
1. 값 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 (또는 그 공간을 식별하기 위해 붙인 이름)인데, 이 변수에 할당되어 저장되는 것을 값이라 한다. 값(value)은 식이 평가 되어 생성된 결과를 말한다. 평가는 식을 해석해서 값을 생성하거나 참조하는 것을 의미한다. 2. 변수에 저장할 수 있는 값 = 데이터 타입 모든 값은 데이터 타입을 가지며, 메모리에 2진수, 즉 비트의 나열로 저장된다. 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석될 수 있다. 예를 들어, 메모리에 저장된 값 0100 001을 숫자로 해석하면 65이지만 문자로 해석하면 'A'다. 다음은 7가지의 데이터 타입이다. 숫자형 (Number) : 정수와 실수 값을 구분하지 않음 문자형 (String) : 작은/큰..
호이스팅 (Hoisting)
1. 호이스팅이란 호이스팅은 자바스크립트 고유의 특징으로, 식별자를 선언하는 과정에서 발생하는 현상이다. 선언문이 전체 소스코드의 중간에 있더라도 어디에 있든 상관없이, 선두로 끌어 올려진 것처럼 동작하는 것을 호이스팅이라고 말한다. 자바스크립트 엔진은 소스코드를 한줄씩 순차적으로 실행하기에 앞서 평가 과정을 거친다. 다시말해서 JS 소스코드를 parsing할 때 평가단계(런타임 이전)와 실행단계(런타임)로 나눠서 볼수 있는데, 소스 코드의 평가 과정에서는 JS 엔진은 변수 선언을 포함한 모든 선언문을 찾아내어 먼저 실행한다. 그 후, 평가과정이 끝나고 실행단계에서 소스코드를 상위부터 순차적으로 실행한다. 이때문에 변수 선언보다 그 변수의 참조 코드가 앞서 상위에 있더라도 위치에 상관없이 어디서든지 변수..
쿠키와 스토리지 (cookie & storage)
서버의 비연결성과 무상태라는 특성때문에 연결이 끊어지면 정보가 없어진다. 1. HTTP 쿠키 1.1 쿠키란 서버가 사용자의 웹 브라우저(클라이언트)에 전송하는 작은 데이터 조각으로 볼수 있다. 쿠키는 유저식별과 상태관리에 사용되고 있는 기능이다. 웹 사이트가 유저의 상태를 관리하기 위해 유저의 컴퓨터 상에 일시적으로 데이터를 저장해 두고, 다음에 그 유저가 동일한 웹사이트에 액세스 했을때 이전에 발행한 쿠키를 송신받을수 있다. 쿠키는 주로 3가지 목적으로 사용된다. 정보관리: 서버에 저장할 로그인, 장바구니, 게임 점수 등의 정보 관리 개인화: 사용자 선호, 테마 등의 세팅 트래킹: 사용자 행동을 기록 및 분석 (추천 아이템 또는 광고 등) 도메인 별로 따로 저장이 되고, 동일한 서버에 재 요청시에 저장..