곰돌이 놀이터

[잡동사니] 티스토리 스킨 편집

달나라 곰돌이 — Sat, 26 Sep 2020 23:16:25 +0900

모바일 관리화면에서 실수로 스킨을 변경하는 일이 자주 발생.. 추후에도 실수로 스킨을 변경하였을때 HTML 파일과 함께 그동안 추가/변경했던 CSS 가 초기화되는 불상사를 막기 위해 변경한 소스의 저장이 필요함 (화면을 변경할 때마다 갱신이 필요)

메인화면

/*  메인화면의 변경된 소스 기입 */

뷰화면

/* 문단모양의 인용부분 line-height 와 margin 값 줄임 */
.area_view blockquote, .area_view blockquote p {
    font-size: 18px;
    line-height: 15px;
}

.area_view blockquote {
    padding: 10px 20px;
    margin: 0 auto 10px;
    border-left: 5px solid #eee;
}

.area_view h4 {
	font-size: 18px;
	line-height: 15px;
	padding: 10px 20px;
	margin: 0px auto 25px;
	border-left: 5px solid rgb(238, 238, 238);
}

/* margin:0 auto 28; 마진값 제거 */ 
.area_view p {font-size:15px;line-height:28px; margin:0 auto 0; color:#555;}

/* 구에디터 customize */
.area_view h2 {
	box-sizing: border-box;
	font-weight: normal;
	line-height: 33px;
	color: rgb(88, 95, 105);
	font-size: 22px;
	text-shadow: none;
	padding-bottom: 5px;
	display: inline-block;
	border-bottom: 2px solid rgb(0, 118, 192);
	margin: 10px 0px 25px;
	border-radius: 0px !important;
}

/* 이외에 h4 속성 제거 */
.area_view h4 {
	font-size: 18px;
	line-height: 15px;
	padding: 10px 20px;
	margin: 0px auto 10px;
	border-left: 5px solid rgb(238, 238, 238);
}

.area_view h4 b {
	font-weight: 100;
  color: #5c5c5c;
}

[Linux] VI/VIM 단축키, 명령어 정리

달나라 곰돌이 — Sat, 26 Sep 2020 11:13:46 +0900

리눅스의 대표적인 에디터로 vi편집기 (또는 vim편집기)가 있으며, 명령어에 대해 정리를 하려고 한다. vim 에디터는 vi iMproved 의 약자로 기능상 약간의 차이가 있을뿐 다르지 않으며 리눅스에서는 vi를 입력하든 vim을 입력하든 둘 다 vim에디터를 실행시켜준다.

처음에는 단축키를 익혀야 하기 때문에 진입장벽이 높은 편이지만, 익숙해지기만 한다면 마우스로 하나하나 클릭하는것이 아닌 단축키만으로 모든 작업이 가능하기 때문에 더욱 더 빠르게 작업이 가능하다는 장점을 가진다.

또 텍스트 문서를 보거나 수정할 뿐만 아니라 리눅스에서 직접 코딩이 필요한 경우도 있을 수 있기 때문에 모든 단축키를 외우지는 못하더라도 어떤 단축키가 있는지 정도는 익혀야 할 것 같아서 정리를 해두려고 한다.

단축키/명령어

실행

명령어	동작
vi file	file 열기
vi file1 file2	file1과 file2를 순서대로 열기
view file / vi -R file	file을 읽기모드로 열기
vi + file	file을 열고 커서를 본문의 마지막 줄에 위치 시킴
vi +n file	file을 열어 n번째 줄에 위치 시킴
vi -r file	손상된 파일 회복

저장 및 종료

명령어	동작
:w	저장하기
:wq	저장 후 종료
:q	저장하지 않고 종료
:q!	변경된 내용을 저장하지 않고 강제로 종료

입력모드 전환

명령어	동작
i	커서의 위치에서 입력모드로 전환
I	커서가 위치한 줄의 맨 앞에서 입력모드로 전환
a	커서가 위치한 다음 칸에서 입력모드로 전환
A	커서가 위치한 줄의 맨 마지막에서 입력모드로 전환
o	커서가 위치한 줄의 아래에 빈 줄 삽입
O	커서가 위치한 줄의 위에 빈 줄 삽입
R	수정모드로 전환

커서이동

명령어	동작
w	다음 단어의 끝 부분으로 커서 이동
e	다음 단어 앞 부분으로 커서 이동
b	이전 단어로 이동
^, 0	줄의 처음으로 이동
$	줄의 마지막으로 이동
H	화면 맨 위로 이동
M	화면 중간으로 이동
L	화면 맨 아래로 이동
G	글의 맨 밑으로 이동
nG	n번째 줄로 이동
n%	n퍼센트에 해당하는 위치로 이동
[shift] + ↑	한 페이지 앞으로 이동
[shift] + ↓	한 페이지 뒤로 이동
[Ctrl] + i	한 화면 위로 이동
[Ctrl] + b	한 화면 아래로 이동
[Ctrl] + d	반 화면 위로 이동
[Ctrl] + u	반 화면 아래로 이동
[Ctrl] + e	한 줄 위로 이동
[Ctrl] + y	한 줄 아래로 이동

복사 및 붙여넣기

명령어	동작
yy	현재 커서가 위치한 줄을 버퍼로 복사
p	버퍼에 복사되어있는 내용을 커서 뒤에 삽입
P	버퍼에 복사되어있는 내용을 커서 앞에 삽입( shift + p )
ny	현재 커서가 위치한 줄에서부터 아래로 n줄 복사
:n1, n2y	n1~n2번째줄을 버퍼로 복사
:npu	n행에 버퍼에 복사되어있는 내용을 삽입
d	현재 커서가 위치해있는 단어 복사
nyy	현재 커서에서 부터 n만큼의 행 복사

삭제

명령어	동작
x	현재 커서가 위치한 문자 삭제
dw	단어 삭제
dd	현재 커서가 위치한 줄 삭제
ndd	현재 커서에서 부터 n만큼의 줄 삭제
d + ↑	현재 커서가 위치한 줄의 위로 2줄 삭제
d + ↓	현재 커서가 위치한 줄의 아래로 2줄 삭제
D	한줄 내에서 커서의 위치 뒤로 모두 삭제
u	바로 전에 수행한 명령 취소

문자열 찾기

명령어	동작
/name	name 문자열 찾기
n	다음 name으로 이동( 아래로 검색 )
N	이전 name으로 이동( 역방향, 위로 검색 )

문자열 대체

명령어	동작
:s/str/rep	현재 줄의 str을 rep로 대체
:l,.s/str/rep/	1부터 현재 줄의 str을 rep로 대체
:%s/str/rep/g	파일 전체 str을 rep로 전부 대체
:.$/aaa/bbb	커서의 위치로부터 파일의 끝까지 있는 모든 aaa를 bbb로 대체

기타

명령어	동작
:set nu	줄 번호 보여주기
:set nonu	줄 번호 보여주기 취소
.	바로 전에 실행한 명령어 재 실행
[ctrl] + l	불필요한 화면 정리후 다시 표시

[React] 내가 React를 선택한 이유

달나라 곰돌이 — Tue, 25 Aug 2020 20:45:40 +0900

나는 개발 트렌드를 구직사이트를 통해 얻고는 한다. 특히, 개발자 모집공고의 지원자격 서치를 통해 웹 개발 환경의 발전에 따른 개발 트렌드의 변화에 주목하는 편인데 이러한 트렌드의 변화중 한가지로 어느 순간부터 프론트엔드 개발자 자격요건이 'Jquery 라이브러리 사용가능자' 에서 'Angular, React, Vue 등의 라이브러리, 프레임워크 경험 및 가능자'로 급격히 바뀌기 시작하더니 현재는 많은 기업에서 요구하는 스펙이 되었다는 것이다.

이처럼 컴퓨터 엔지니어링 분야의 변화가 굉장히 다이나믹 하여 매년 끊임없이 새로운 언어들이 쏟아져 나오고 있고 기존 언어의 문제점들을 보강하며 새로운 방법론의 제시와 함께 업데이트가 이루어지고 있는데 그만큼 기존의 많은 언어나 기술들이 뒤쳐지며 사라지기도 한다.

때문에 우리는 트렌드를 따르는 직업을 가진만큼 트렌드에 민감해져야 할 필요가 있으므로, 이번 포스트를 통해 프론트엔드 프레임워크의 필요성과 프론트엔드 프레임워크중에서도 React 를 선택한 이유에 대해 정리를 해보려고 한다.

프론트엔드 라이브러리, 프레임워크의 등장

더욱 동적이고 복잡해진 웹 페이지

모든 웹 페이지를 만들기 위해서 굳이 프론트엔드 라이브러리를 사용해야 할 필요는 없다. 단순히 HTML과 CSS, 그리고 순수 자바스크립트 만으로도 웹 페이지를 얼마든지 제작할 수 있다. 특히, 정적 페이지를 만드는 것이 목적이라면 프론트엔드 라이브러리나 프레임워크의 도움은 필요하지 않을것이다.

하지만 요즘의 웹은 정적이고 단순한 페이지가 아니다. 웹 앱 혹은 웹 어플리케이션이라 불릴 정도로 복잡하고 동적이 되었다. 이처럼 복잡하고 동적인 웹 페이지가 늘이나고 웹의 크기가 커지자, 자바스크립트 파일의 관리가 어려워졌고, 이를 효율적으로 관리하기 위해 backbone.js와 같은 라이브러리가 등장하며 자바스크립트 파일의 조직적 관리가 용이해졌지만 이러한 웹 어플리케이션에서 UI를 동적으로 나타내기 위해서는 복잡하고 많은 상태를 관리해야 하는 부담이 생겼다. 그 원인으로 웹 페이지는 모든 페이지마다 HTML, CSS, Javascript 파일을 각기 가지고 있어야 했고, 따라서 페이지 간 이동을 할 때마다 HTML, CSS, Javascript 파일을 서버와 주고받아야 하기 때문에 속도가 느릴 수 밖에 없었다.

이때 SPA(Single Page Application)가 등장하게 되는데 SPA는 HTML, CSS, Javascript 파일을 최초 1회만 로드하고, 이후에는 자바스크립트 파일을 통해 DOM 또는 필요한 HTML 파일을 조작하는 방식을 말한다. 이는 서버로부터 완전한 새로운 페이지를 불러오지 않고, jsp파일 없이 index.html파일 하나에서 js, css등 리소스 파일들과 모듈들을 로드해서 페이지 이동 없이 특정영역만 새로 모듈을 호출하고 데이터를 바인딩하는 개념이다.

이처럼 웹의 발전과 함께 SPA 개발을 위한 ES6, Node.js와 npm 그리고 webpack, Babel과 Angular, React, Vue와 같은 프론트 라이브러리, 프레임워크가 등장하게 되었다.

라이브러리, 프레임워크 차이

2018/07/26 - [기본 개발 지식] - [기본] 플랫폼, 프레임워크, 라이브러리의, API 의 이해

프론트엔드 라이브러리, 프레임워크(앵귤러, 리액트, 뷰)의 등장

작성중..

리액트란

리액트는 페이스북이 만든 사용자 인터페이스(UI) 개발을 위한 라이브러리로 UI 컴포넌트를 만들어 캡슐화를 시켜주기 때문에 재사용성이 높고 한가지 작업만 하기 때문에 단순하고, 다양한 자바스크립트 프레임워크나 라이브러리와 함께 사용도 가능하다. 따라서 기존 코드를 모두 바꿀 필요없이 필요한 부분에서만 조금씩 리액트를 사용할 수도 있다.

특히 리액트는 기존의 라이브러리나 프레임워크와 달리 MVC 패턴이 아닌 그 중에서도 View에만 집중한 라이브러리인데, MVC의 특성상 확장이 어렵고 거대한 시스템에 어울리지 않다고 결론을 내린 페이스북이 이처럼 결정을 내린 것이다. 이유는 모델(Model)과 뷰(View)의 수가 가 커지고 양방향 데이터 플로우 일수록 더욱 복잡해져 디버깅과 코드를 이해하기 어려워지기 때문에 MVC는 작은 앱 개발 시 활용도가 더 높다는 것이다. 이에 좀 더 예측이 가능하도록 코드를 구조화 하기 위해 단방향 시스템 아키텍쳐인 Flux를 제안하게 되었다.

리액트를 사용하는 이유?

복잡하고 동적인 웹 어플리케이션에서 UI를 동적으로 나타내기 위해서는 많은 상태를 관리해야 하는 부담이 생긴다.

만약에 프로젝트 규모가 크고 다양한 UI와의 상호작용이 필요하다면 DOM 요소 하나하나를 직접 관리하고 복잡하게 늘어진 코드를 리팩토링 하는 것은 점점 힘들게 될 것이고 또한 이러한 복잡한 SPA에서는 DOM 조작이 많이 발생면 매번 브라우저가 연산을 해야 하므로 전체적인 프로세스가 비효율적이 되기 쉽다.

하지만 React의 Virtual DOM을 사용한다면, 실제 DOM에 적용시키기 전 가상의 DOM을 만들어 적용시키고, 최종 완성된 결과만을 실제 DOM으로 전달한다. 이를 통해 브라우저가 진행하는 연산의 양을 줄일 수 있어 성능이 개선된다. Virtual DOM은 렌더링도 되지 않기 때문에 연산 비용이 적다. 모든 변화를 Virtual DOM을 통해 묶고 이를 실제 DOM으로 전달하여 브라우저 전체를 새로고침 하지 않고도 컨텐츠를 빠르게 변경할 수 있다. 뿐만 아니라 React를 사용하면 사용자와 상호작용할 수 있는 interactive한 UI를 쉽게 만들 수 있고 기능과 UI 구현에 집중하고 불필요한 주의력 분산을 줄일 수 있게 된다.

리액트 특징

■ 자바스크립트 기반
리액트는 자바스크립트 기반으로 별도의 프레임워크를 배울 필요가 없으며 자바스크립트를 그대로 활용하면 된다. 앵귤러(Angular)또는 뷰(Vue)처럼 다른 언어를 배울 필요가 없기 때문에 자바스크립트와 HTML을 조금 아는 정도로도 개발이 가능하다.

■ 선언형
사용자 인터페이스를 만들때 쉽고 간결하게 해준다. 애플리케이션 안에서 각각 상태에 따른 디자인 뷰와 연결된 데이터가 변경되면, 이에 맞는 컴포넌트들을 올바르게 랜더링해 화면 구성을 해준다. 이 처럼 선언형의 화면뷰는 예측 가능한 코드 및 쉬운 디버깅을 하게 해준다.

■ 가상 DOM (Virtual DOM)
DOM Tree와 같은 구조체를 Virtual DOM으로 가진다. 'diffing'알고리즘을 통해 문서의 변화를 확인, 'Recomfillation' 진행으로 부분 조작이 가능하다. 무엇보다 DOM을 직접 조작하는 것이 아니라 In-memory의 가상 DOM을 조작하기 때문에 효율적이라고 빠르다.

■ 컴포넌트 (Components)
요소라고 하는 컴포넌트 별로 나누어 개발이 가능하다. 또 이렇게 개발한 것을 다른 곳에 활용할 수도 있다. 또 자바스크립트와 JSX를 조금 사용할 줄 안다면 간단하게 구현이 가능한데 이 때문에 개발을 쉽게 하고 유지보수를 하는데도 큰 장점이다. (*JSX란? 리액트로 HTML을 개발하는 방법, 매우 간단하며 쉽다.) 상태를 관리하는 컴포넌트들을 캡슐화해 빌드한 후 그 컴포넌트들을 복잡한 UI로 조합하여 구성이 가능한데, 컴포넌트 로직은 자바스크립트로 구성이 되어있어 애플리케이션을 통한 대량 데이터를 전송가능하게 하고 DOM의 외부상태를 쉽게 유지할 수도 있다.

■ 단방향 데이터플로우
데이터가 UI로 흐르는 구조이며, 데이터가 변했을때 UI가 업데이트 된다. 하지만 단방향이므로, UI쪽에서 데이터를 변화시키는 것은 불가능하다. 즉 데이터가 변하게 되면 UI는 변화된 새로운 데이터와 함께 업데이트 된다. 앵귤러(Angular)와 비교하면 앵귤러의 경우는 양방향 데이터플로우이며, 이와는 반대로 데이터를 관리하는 컴포넌트가 있고 데이터를 UI컴포넌트에 전달하는 단순한 데이터 흐름으로 이해해 쉽고 편리하게 구현 가능하다.

장점

■ Component를 사용해서 효율적으로 재사용이 가능하고 높고 유지보수가 용이
Component는 UI를 구성하는 개별적인 뷰 단위로 전체 앱은 각 Component들이 결합해서 만들어 지게 되는데 무엇보다 각 Component들은 앱의 다른 부분, 또는 다른 앱에서 쉽게 재사용이 가능하다. Redux의 창시자이며, 현재는 Facebook React Core팀의 일원인 Dan Abramov는 React의 목표가 성능보다는 유지가능한 앱을 만드는 것에 있다고 설명한다.

■ 생태계가 넓고, 다양한 라이브러리 사용 가능
개발을 하다보면 막히는 부분, 오류가 있는 부분이 많은데 Vue에 비해 사용자가 많고, 역시 Facebook에서 만들었다보니 확실히 커뮤니티나 자료가 굉장히 방대하다.

■ 리액트는 라이브러리이기 때문에 다른 프레임워크나 라이브러리와 혼용 가능
React는 다른 프레임워크나 라이브러리와 쉽게 함께 사용할 수 있고 이미 개발된 서비스에서도 일정 부분에서만 선택적으로 적용이 가능하여 단계적으로 React로의 변경이 가능하다.

■ virtual DOM을 활용하여 빠른 렌더링이 가능
DOM은 브라우저가 화면을 그리기위한 정보를 담고있는 문서 객체이다. JQuery처럼 실제 DOM을 변경할 경우, 변경할 부분이 일부분이더라도 DOM 전체를 다시 렌더링해야하고, 이는 성능 저하로 직결된다는 단점이 있다.
React는 렌더링 시 Virtual DOM, 즉 가상 DOM을 먼저 만든다. 그 후 실제 DOM과 비교를 하여 변경이 있는 부분(하위 컴포넌트)만 대체를 하기 때문에 리소스 낭비를 줄일 수 있다.

■ 단방향 데이터 바인딩을 통한 디버깅 용이, 다른 라이브러리에 비해 안정성이 높음
React 내에서의 데이터의 흐름은 부모(Parent)에서 자식(Child)으로 단방향적이다. 그렇기 때문에 디버깅이 용이하며, 다른 라이브러리에 비해 안전성이 높다.

■ 리액트 네이티브를 활용하여 앱 개발 가능
리액트 네이티브는 네이트브 모바일 앱을 만들기 위한 프레임워크로서 리액트를 기반으로 개발되었다. 리액트 라이브러리가 웹 개발자나 하이브리드 앱 개발자에게 유용하고 관심을 끌게 하는 기술이라면, 리액트 네이티브는 모바일 개발자들이 몹시 주목할 기술이다.

※ 리액트 네이티브 : 대다수의 모바일 앱은 하이브리드가 아닌 네이티브 앱 형식으로 개발이 되는데 여기서 일반적으로 안드로이드와 iOS에서 동시 작동하는 소스코드를 작성하기 위해서는 '웹뷰'를 이용해야만 했다. 그러나 웹뷰를 이용한 하이브리드 앱 기술은 기존의 네이티브 앱에서 지원하는 속성을 이해하지 못했는데 리액트 네이티브 활용으로 네이티브 속성을 그대로 이용하는 것이 가능해졌다.

단점

■ 프레임워크의 MVC 와 비교하였을때 V(View)만을 관리한다.
View 부분만을 관리하기 때문에 다른 부분은 써드파티 라이브러리(Third party library, 패키지)를 이용하거나 직접 구현해야한다.

■ 진입장벽이 낮지많은 않다.
순수 JavaScript의 개념을 잘 알고 있을 필요가 있고 React는 inline-template 과 JSX 를 사용하는데, 처음에는 적응이 어려울 수도 있다.

■ MVC 패턴과 비교하였을때 V(View)만을 관리한다.
IE8 이하 버전은 지원을 하지 않기때문에 필요하다면 React 14 이하의 버전을 사용하고 이것을 호환해주는 폴리필을 사용해야한다.

Angular, React, Vue 의 비교

Angular, React, Vue 간단비교

■ React
- 웹 뿐만 아니라 앱 개발에도 사용 ( React Native )
- 페이스북이라는 거대한 업체의 지원
- 가장 거대한 커뮤니티
- Virtual Dom

■ Vue
- 가장 적은 러닝커브
- 가볍고 빠르게 개발이 필요하다면 추천
- Evan You 라는 개인이 프로젝트 리더
- 상대적으로 작지만 빠르게 성장중인 커뮤니티
- 가장 최신에 릴리즈 시작한 프레임워크(2014년)
- 양방향 바인딩
- Virtual Dom

■ Angular
- 구글이라는 전세계적인 기업의 지원
- 가장 빠르게 릴리즈된 JS 프레임워크(2010년)
- 큰 커뮤니티
- 양방향 바인딩
- TypeScript 가장 먼저 도입
- 가장 체계적이고 잘 정리되어있는 문서
- 가장 복잡하고 큰 러닝커브

Angular, React, Vue 중 선택애야 하는 경우

■ 앵귤러를 선택해야 하는 경우
-기능이 풍부하고 규모가 큰 애플리케이션을 개발할 때
-믿을 수 있고 확장 가능한 프레임워크가 필요할 때
-채팅 앱이나 메시징 앱과 같은 실시간 애플리케이션을 개발할 때
-장기프로젝트이며, 투자규모도 상당한 네이티브 앱이나 하이브리드 앱, 또는 웹앱을 개발할 때
-타입스크립트(TypeScript)로 코딩해야 할 때
-객체지향(Object-oriented)프로그래밍을 해야 할 때

■ 리액트를 선택해야 하는 경우
-빠른 일정 안에 엔터프라이즈 수준의 가벼우면서도 현대적인 애플리케이션을 개발해야 할 때
-웹사이트 개발 솔루션을 안전하게 보호할 수 있는 유연한 프레임워크가 필요할 때
-크로스 플랫폼(cross-platform) 애플리케이션이나 싱글 페이지 애플리케이션(SPA)을 개발할 때
-기존의 앱에서 기능성을 확장할 때
-강력한 커뮤니티 지원과 솔루션이 필요할 때

■ 뷰를 선택해야 하는 경우
-시장 진입 단계에서 필요한 프레임워크를 선택할 때
-작고 가벼운 애플리케이션을 개발할 때
-기존의 프로젝트에서 현대적이지만 제한된 리소스를 가진 프레임워크로 마이그레이션을 해야할 때
-기업이 아니라 사용자 커뮤니티의 지원을 받는 프레임워크를 원할 때

Angular, React, Vue 의 선호도 비교

2020년 기준 구글, 스택오버플로우, 깃허브 트렌드, npm 다운로드 모두 리액트가 높은것으로 나타며 각각 현재 시장에서 어떤 위치를 차지하고 있는지 확인해보기로 한다.

■ 구글 트렌드(국내/해외포함)

■ 스택오버플로우 / 깃허브 트렌드

■ npm 다운로드

012

내가 리액트를 선택한 이유

작성중 ..

[Oracle] 쿼리 실행순서

달나라 곰돌이 — Wed, 8 Jul 2020 10:56:50 +0900

쿼리진행과정

1. 구문 분석(Parsing)

해당 쿼리가 문법적으로 틀리지 않은지 확인. 해당 SQL 개발자 도구가 이해할 수 있는 단위들로 분해하는 과정.

만약 구문이 부정확하다면 여기서 처리를 중단.

2. 표준화(Standardization)

실제로 필요없는 부분들이 제거. 표준화된 쿼리 트리(Standard Query Tree)가 만들어 진다.

3. 최적화(Optimization)

통계나 조각 정보 등을 바탕으로 실행 계획을 만들어 낸다. 쿼리처리에서 매우 중요한 단계

- 쿼리 분석 : 검색 제한자(SARG)인지 조인 조건인지 판단.

- 인덱스 선택 : 분포 통계 정보를 이용하여 인덱스검색이나 테이블 스캔 중의 하나를 선택. 여러 인덱스 중 가장 효율적인 인덱스를 선택

- 조인 처리 : JOIN, UNION, GROUP BY, ORDER BY 절을 가지고 있는지 확인하여 적절한 작업 순서를 선택

이 단계의 출력은 실행 계획(Execution Plan) 이다.

4. 컴파일(Compilation)

컴파일을 하면 이진 코드가 생성된다.

5. 실행(Execute)

실제 처리를 하고 결과를 돌려준다.

쿼리 작성/실행 순서

작성순서

SELECT
FROM
WHERE
GROUP BY
HAVING
ORDER BY

실행순서

FROM
ON
JOIN
WHERE
GROUP BY
HAVING
SELECT
DISTINCT
ORDER BY
TOP

설명

FROM 해당 데이터가 있는 곳을 찾아가서
WHERE 조건에 맞는 데이터로 필터링하고
GROUP BY 원하는 데이터로 가공
HAVING 가공한 데이터에서 조건에 맞는 것만
SELECT 뽑아내서
ORDER BY 정렬한다

[기본] AS-IS, TO-BE 분석

달나라 곰돌이 — Fri, 12 Jun 2020 16:32:08 +0900

차세대 프로젝트를 진행하게 되면 AS-IS 와 TO-BE 라는 용어를 많이 접하게 된다.
대충 영어의 뜻만 생각해 봐도 느낌이 올테지만 그래도 정리해두기로 한다.

※ 차세대 프로젝트이란?

금융권에서의 차세대 프로젝트는 고도화된 현재의 금융거래 처리에 한계가 있는 오래된 시스템을 걷어내고 새로운 언어나 프레임워크로 다시 개발하는것을 말하며, 전반적인 업무 파악과 이전 시스템의 이해가 필수적이다.

현상의 문제를 확인하고 해결하기 위해 '현재의 상황(AS-IS)'를 인식하고 현재의 상황과 '이상적인 지향점(TO-BE)'과의 차이(Gap)을 인식하고 이를 일치시키기 위한 일련의 전략적 사고 방식을 AS-IS, TO-BE 분석이라고 할 수 있다.

AS-IS

지금 현재의 '있는 그대로'를 의미. 즉, AS-IS 분석이란 현재의 업무 프로세스에 대한 분석을 뜻하고 이는 크게 3가지로 나누어진다.

■ AS-IS 프로세스 목록 작성
업무를 대분류, 중분류, 세분류, 프로세스 설명 등을 엑셀 등을 이용하여 목록을 작성하는 것

■ AS-IS 프로세스 체계도 작성
업무가 어떤 체계의 구조를 가지고 있는지에 대하여 계층구조 형태로 업무를 분류하는 작업

■ AS-IS 프로세스 정의서 작성
업무의 흐름에 대하여 Flow Chart 형태로 업무를 정의하는 작업

TO-BE

'미래의' 새로운것을 의미. 즉, 미래에 개선될 업무 프로세스에 대한 분석을 뜻하고 TO-BE 분석도 AS-BE 와 같이 크게 3가지로 나누어진다.

■ TO-BE 프로세스 목록 작성
TO-BE 프로세스 목록작성이란 시스템에서 업무를 업무를 대분류, 중분류, 세분류로 구분하여 세부업무에 대한 설명을 엑세등을 이용하여 목록을 작성

■ TO-BE 프로세스 체계도 작성
TO-BE 프로세스 체계도 작성이란 시스템 기준으로 업무가 어떤 체계의 구조를 가지고 있는지에 대하여 계층구조 형태로 업무를 분류하는 작업

■ TO-BE 프로세스 정의서 작성
TO-BE 프로세스 정의서란 시스템 기준으로 업무의 흐름에 대하여 Flow Chart 형태로 업무를 정의하는 작업

As-Is System 현재의 시스템

Obsolete 한물간, 구식의, 더이상 쓸모 없는

Preserved 보존된

Enhanced 강화한

Wholly New 전체적으로 새로운

To-Be System 새로운 시스템

[알고리즘Lv1] 같은 숫자는 싫어

달나라 곰돌이 — Thu, 14 May 2020 07:34:11 +0900

알고리즘 사이트

프로그래머스 문제로 이동

프로그래머스

코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.

programmers.co.kr

문제 설명

배열 arr가 주어집니다. 배열 arr의 각 원소는 숫자 0부터 9까지로 이루어져 있습니다. 이때, 배열 arr에서 연속적으로 나타나는 숫자는 하나만 남기고 전부 제거하려고 합니다. 단, 제거된 후 남은 수들을 반환할 때는 배열 arr의 원소들의 순서를 유지해야 합니다. 예를 들면,

arr = [1, 1, 3, 3, 0, 1, 1] 이면 [1, 3, 0, 1] 을 return 합니다.
arr = [4, 4, 4, 3, 3] 이면 [4, 3] 을 return 합니다.

배열 arr에서 연속적으로 나타나는 숫자는 제거하고 남은 수들을 return 하는 solution 함수를 완성해 주세요.

제한 조건

배열 arr의 크기 : 1,000,000 이하의 자연수
배열 arr의 원소의 크기 : 0보다 크거나 같고 9보다 작거나 같은 정수

입출력 예

arr	answer
[1,1,3,3,0,1,1]	[1,3,0,1]
[4,4,4,3,3]	[4,3]

입출력 예 설명

입출력 예 #1,2
문제의 예시와 같습니다.

해결

import java.util.*;

public class Solution {
    public ArrayList<Integer>  solution(int []arr) {
        ArrayList<Integer> list = new ArrayList<Integer>();

        for(int i=0; i<arr.length-1; i++){
            if(arr[i] != arr[i+1])list.add(arr[i]);
            if(i==arr.length-2)list.add(arr[arr.length-1]);
        }

        return list;
    }
}

[알고리즘Lv1] 가운데 글자 가져오기

달나라 곰돌이 — Wed, 13 May 2020 23:45:38 +0900

알고리즘 사이트

프로그래머스 문제로 이동

프로그래머스

programmers.co.kr

문제 설명

단어 s의 가운데 글자를 반환하는 함수, solution을 만들어 보세요. 단어의 길이가 짝수라면 가운데 두글자를 반환하면 됩니다.

제한 조건

s는 길이가 1 이상, 100이하인 스트링입니다.

입출력 예

s	return
"abcde"	"c"
"qwer"	"we"

해결

class Solution {
    public String solution(String s) {
        String answer = "";
        int length = s.length() / 2;
        int isOdd = s.length() % 2 != 0 ? 1 : 0;
                
        if(isOdd == 1) answer = s.substring(length,length+1);
        if(isOdd == 0) answer = s.substring(length-1,length+1);
        
        return answer;
    }
}

[알고리즘Lv1] 2016년

달나라 곰돌이 — Mon, 11 May 2020 21:56:31 +0900

알고리즘 사이트

프로그래머스 문제로 이동

프로그래머스

programmers.co.kr

문제 설명

2016년 1월 1일은 금요일입니다. 2016년 a월 b일은 무슨 요일일까요? 두 수 a ,b를 입력받아 2016년 a월 b일이 무슨 요일인지 리턴하는 함수, solution을 완성하세요. 요일의 이름은 일요일부터 토요일까지 각각 SUN,MON,TUE,WED,THU,FRI,SAT

입니다. 예를 들어 a=5, b=24라면 5월 24일은 화요일이므로 문자열 "TUE"를 반환하세요.

제한 조건

2016년은 윤년입니다.
2016년 a월 b일은 실제로 있는 날입니다. (13월 26일이나 2월 45일같은 날짜는 주어지지 않습니다)

입출력 예

a	b	result
5	24	"TUE"

해결

class Solution {
    public String solution(int a, int b) {
        int month = a;
        int day = b;
        String answer = "";
        int[] numberOfMonths = {31,29,31,30,31,30,31,31,30,31,30,31};
        String[] today ={"FRI","SAT","SUN","MON","TUE","WED","THU"};
        int sumNumber = 0;
        
        for(int i = 0 ; i< month-1; i++){
            sumNumber += numberOfMonths[i];
        }
        
        sumNumber += day-1;
        answer = today[sumNumber %7];

        return answer;
    }
}

[알고리즘Lv1] 폰켓몬

달나라 곰돌이 — Sun, 10 May 2020 22:29:52 +0900

알고리즘 사이트

프로그래머스 문제로 이동

프로그래머스

programmers.co.kr

문제 설명

당신은 폰켓몬을 잡기 위한 오랜 여행 끝에, 홍 박사님의 연구실에 도착했습니다. 홍 박사님은 당신에게 자신의 연구실에 있는 총 N 마리의 폰켓몬 중에서 N/2마리를 가져가도 좋다고 했습니다.
홍 박사님 연구실의 폰켓몬은 종류에 따라 번호를 붙여 구분합니다. 따라서 같은 종류의 폰켓몬은 같은 번호를 가지고 있습니다. 예를 들어 연구실에 총 4마리의 폰켓몬이 있고, 각 폰켓몬의 종류 번호가 [3번, 1번, 2번, 3번]이라면 이는 3번 폰켓몬 두 마리, 1번 폰켓몬 한 마리, 2번 폰켓몬 한 마리가 있음을 나타냅니다. 이때, 4마리의 폰켓몬 중 2마리를 고르는 방법은 다음과 같이 6가지가 있습니다.

첫 번째(3번), 두 번째(1번) 폰켓몬을 선택
첫 번째(3번), 세 번째(2번) 폰켓몬을 선택
첫 번째(3번), 네 번째(3번) 폰켓몬을 선택
두 번째(1번), 세 번째(2번) 폰켓몬을 선택
두 번째(1번), 네 번째(3번) 폰켓몬을 선택
세 번째(2번), 네 번째(3번) 폰켓몬을 선택

이때, 첫 번째(3번) 폰켓몬과 네 번째(3번) 폰켓몬을 선택하는 방법은 한 종류(3번 폰켓몬 두 마리)의 폰켓몬만 가질 수 있지만, 다른 방법들은 모두 두 종류의 폰켓몬을 가질 수 있습니다. 따라서 위 예시에서 가질 수 있는 폰켓몬 종류 수의 최댓값은 2가 됩니다.
당신은 최대한 다양한 종류의 폰켓몬을 가지길 원하기 때문에, 최대한 많은 종류의 폰켓몬을 포함해서 N/2마리를 선택하려 합니다. N마리 폰켓몬의 종류 번호가 담긴 배열 nums가 매개변수로 주어질 때, N/2마리의 폰켓몬을 선택하는 방법 중, 가장 많은 종류의 폰켓몬을 선택하는 방법을 찾아, 그때의 폰켓몬 종류 번호의 개수를 return 하도록 solution 함수를 완성해주세요.

제한 조건

nums는 폰켓몬의 종류 번호가 담긴 1차원 배열입니다.
nums의 길이(N)는 1 이상 10,000 이하의 자연수이며, 항상 짝수로 주어집니다.
폰켓몬의 종류 번호는 1 이상 200,000 이하의 자연수로 나타냅니다.
가장 많은 종류의 폰켓몬을 선택하는 방법이 여러 가지인 경우에도, 선택할 수 있는 폰켓몬 종류 개수의 최댓값 하나만 return 하면 됩니다.

입출력 예

nums	result
[3,1,2,3]	2
[3,3,3,2,2,4]	3
[3,3,3,2,2,2]	2

입출력 예 설명

입출력 예 #1
문제의 예시와 같습니다.

입출력 예 #2
6마리의 폰켓몬이 있으므로, 3마리의 폰켓몬을 골라야 합니다.
가장 많은 종류의 폰켓몬을 고르기 위해서는 3번 폰켓몬 한 마리, 2번 폰켓몬 한 마리, 4번 폰켓몬 한 마리를 고르면 되며, 따라서 3을 return 합니다.

입출력 예 #3
6마리의 폰켓몬이 있으므로, 3마리의 폰켓몬을 골라야 합니다.
가장 많은 종류의 폰켓몬을 고르기 위해서는 3번 폰켓몬 한 마리와 2번 폰켓몬 두 마리를 고르거나, 혹은 3번 폰켓몬 두 마리와 2번 폰켓몬 한 마리를 고르면 됩니다. 따라서 최대 고를 수 있는 폰켓몬 종류의 수는 2입니다.

해결

import java.util.*;

class Solution {
    public int solution(int[] nums) {
        int answer = 0;
        HashSet<Integer> hashSet = new HashSet<>();
        
        for(Integer item : nums){
            // HashSet은 중복값을 허용하지 않음
            hashSet.add(item);
        }
        
        answer = (nums.length / 2) < hashSet.size() ? (nums.length / 2) : hashSet.size(); 
        
        return answer;
    }
}

[기본] 디자인패턴 이란?

달나라 곰돌이 — Wed, 15 Apr 2020 20:19:03 +0900

디자인패턴

디자인 패턴이란?

소프트웨어 개발 방법에서 사용되는 디자인 패턴은 프로그램 개발에서 자주 나타나는 과제를 해결하기 위한 방법 중 하나로, 과거의 소프트웨어 개발 과정에서 발견된 설계의 노하우를 축적하여 이름을 붙여, 이후에 재이용하기 좋은 형태로 특정의 규약을 묶어서 정리한 것이다. 알고리즘과 같이 프로그램 코드로 바로 변환될 수 있는 형태는 아니지만, 특정한 상황에서 구조적인 문제를 해결하는 방식

간단히 말해 소프트웨어 설계할 때 또는 프로그램 개발과정에서 특정 부분에서 많이 발생하는 문제를 정리하여 상황에 따라 해결할 수 있는 해결책(패턴)

※ 패턴
다양한 소프트웨어들로 각기 다른 프로그램을 개발하는 과정에서 공통적인 문제점 또는 유사한 문제점이 존재하고 이를 처리하는 과정도 공통점이 있는데 이러한 유사점을 패턴이라 한다.

디자인패턴구조

콘텍스트(context)

문제가 발생하는 여러 상황. 즉, 패턴이 적용될 수 있는 상황을 말함

경우에 따라서는 패턴이 유용하지 못한 상황을 말하기도 함

문제(problem)

패턴이 적용되어 해결될 필요가 있는 여러 디자인 이슈들을 말함

이때 여러 제약 사항과 영향력도 문제 해결을 위해 고려해야 함

해결(solution)

문제를 해결하도록 설계를 구성하는 요소들과 그 요소들 사이의 관계, 책임, 협력 관계를 말함

해결은 반드시 구체적인 구현 방법이나 언어에 의존적이지 않으며 다양한 상황에 적용할 수 있는 일종의 템플릿

디자인패턴종류

GoF(Gang of Four) 디자인 패턴이라고 불리며, 4명의 유명한 개발자들에 의해 고안되었다

생성 (Creational) 패턴	구조 (Structural) 패턴	행동 (Behavioral) 패턴
싱글톤 (Singleton)	어댑터 (Adapter)	스트레티지 (Strategy)
팩토리 메쏘드 (Factory Methods)	브리지 (Bridge)	템플릿 메쏘드 (Template Meothods)
추상 팩토리 메쏘드 (Abstract Factory Methods)	컴퍼지트 (Composite)	옵저버 (Observer)
빌더 (Builder)	데코레이터 (Decorator)	스테이트 (State)
프로토타입 (Prototype)	퍼사드 (Facade)	비지터 (Visitor)
	플라이웨이트 (Flyweight)	커맨드 (Command)
	프록시 (Proxy)	인터프리터 (Interpreter)
		이터레이터 (Iterator)
		미디에이터 (Mediator)
		메멘토 (Memento)
		책임 연쇄 (Chain of Responsibility)

1. 생성(Creational) 패턴

객체 생성에 관련된 패턴

객체의 생성과 조합을 캡슐화해 특정 객체가 생성되거나 변경되어도 프로그램 구조에 영향을 크게 받지 않도록 유연성을 제공

1) 추상 팩토리(Abstract Factory)

구제적인 클래스에 의존하지 않고 서로 연관되거나 의존적인 객체들의 조합을 만드는 인터페이스를 제공하는 패턴

2) 팩토리 메서드(Factory Method)

객체 생성 처리를 서브 클래스로 분리해 처리하도록 캡슐화하는 패턴

3) 싱글턴(Singleton)

전역 변수를 사용하지 않고 객체를 하나만 생성하도록 하며, 생성된 객체를 어디에서든지 참조할 수 있도록 하는 패턴

2. 구조(Structural) 패턴

클래스나 객체를 조합해 더 큰 구조를 만드는 패턴

예를 들어 서로 다른 인터페이스를 지닌 2개의 객체를 묶어 단일 인터페이스를 제공하거나 객체들을 서로 묶어 새로운 기능을 제공하는 패턴

1) 컴퍼지트(Composite)

여러 개의 객체들로 구성된 복합 객체와 단일 객체를 클라이언트에서 구별 없이 다루게 해주는 패턴

2) 데커레이터(Decorator)

객체의 결합을 통해 기능을 동적으로 유연하게 확장할 수 있게 해주는 패턴

3. 행위(Behavioral) 패턴

객체나 클래스 사이의 알고리즘이나 책임 분배에 관련된 패턴

한 객체가 혼자 수행할 수 없는 작업을 여러 개의 객체로 어떻게 분배하는지, 또 그렇게 하면서도 객체 사이의 결합도를 최소화하는 것에 중점을 둔다

1) 옵서버(Observer)

한 객체의 상태 변화에 따라 다른 객체의 상태도 연동되도록 일대다 객체 의존 관계를 구성하는 패턴

2) 스테이트(State)

객체의 상태에 따라 객체의 행위 내용을 변경해주는 패턴

3) 스트래티지(Strategy)

행위를 클래스로 캡슐화해 동적으로 행위를 자유롭게 바꿀 수 있게 해주는 패턴

4) 템플릿 메서드(Template Method)

어떤 작업을 처리하는 일부분을 서브 클래스로 캡슐화해 전체 일을 수행하는 구조는 바꾸지 않으면서 특정 단계에서 수행하는 내역을 바꾸는 패턴

5) 커맨드(Command)

실행될 기능을 캡슐화함으로써 주어진 여러 기능을 실행할 수 있는 재사용성이 높은 클래스를 설계하는 패턴

[기본] 소켓(SOCKET)통신 이란?

달나라 곰돌이 — Wed, 23 Oct 2019 13:25:05 +0900

소켓통신

소켓(SOCKET)이란?

소켓(Socket)은 프로세스가 드넓은 네트워크 세계로 데이터를 내보내거나 혹은 그 세계로부터 데이터를 받기 위한 실제적인 창구 역할을 한다. 그러므로 프로세스가 데이터를 보내거나 받기 위해서는 반드시 소켓을 열어서 소켓에 데이터를 써보내거나 소켓으로부터 데이터를 읽어들여야 한다.

소켓은은 프로토콜, IP 주소, 포트 넘버로 정의된다.

* 프로토콜

프로토콜은 원래 외교상의 언어로써 의례나 국가간에 약속을 의미하며, 통신에서는 어떤 시스템이 다른 시스템과 통신을 원활하게 수용하도록 해주는 통신 규약, 약속

* IP

전 세계 컴퓨터에 부여된 고유의 식별 주소

* 포트

포트(Port)는 네트워크 상에서 통신하기 위해서 호스트 내부적으로 프로세스가 할당받아야 하는 고유한 숫자이다. 한 호스트 내에서 네트워크 통신을 하고 있는 프로세스를 식별하기 위해 사용되는 값이므로, 같은 호스트 내에서 서로 다른 프로세스가 같은 포트 넘버를 가질 수 없다. 즉, 같은 컴퓨터 내에서 프로그램을 식별하는 번호이다.

다시말해 소켓이은 떨어져 있는 두 호스트를 연결해주는 도구로써 인터페이스의 역할을 하는데 데이터를 주고 받을 수 있는 구조체로 소켓을 통해 데이터 통로가 만들어 진다. 이러한 소켓은 역할에 따라 서버 소켓, 클라이언트 소켓으로 구분된다.

소켓통신의 흐름

서버 (Server)

클라이언트 소켓의 연결 요청을 대기하고, 연결 요청이 오면 클라이언트 소켓을 생성하여 통신이 가능하게 한다

1) socket() 함수를 이용하여 소켓을 생성

2) bind() 함수로 ip와 port 번호를 설정하게 됩니다.

3) listen() 함수로 클라이언트의 접근 요청에 수신 대기열을 만들어 몇 개의 클라이언트를 대기 시킬지 결정

4) accept() 함수를 사용하여 클라이언트와의 연결을 기다림

클라이언트 (Client)

실제로 데이터 송수신이 일어나는 것은 클라이언트 소켓이다.

1) socket() 함수로 가장먼저 소켓을 연다.

2) connect() 함수를 이용하여 통신 할 서버의 설정된 ip와 port 번호에 통신을 시도

3) 통신을 시도 시, 서버가 accept() 함수를 이용하여 클라이언트의 socket descriptor를 반환

4) 이를 통해 클라이언트와 서버가 서로 read(), write() 를 하며 통신 (이 과정이 반복)

소켓종류

스트림 (TCP)

- 양방향으로 바이트 스트림을 전송, 연결 지향성

- 오류 수정, 정송처리, 흐름제어 보장

- 송신된 순서에 따라 중복되지 않게 데이터를 수신 → 오버헤드가 발생

- 소량의 데이터보다 대량의 데이터 전송에 적합 → TCP를 사용

데이터그램 (UDP)

- 비연결형소켓

- 데이터의 크기에 제한이 있음

- 확실하게 전달이 보장되지 않음, 데이터가 손실돼도 오류가 발생하지 않음

- 실시간 멀티미디어 정보를 처리하기 위해 주로 사용 ex) 전화

HTTP 통신과 SOCKET 통신의 비교

HTTP 통신

- Client의 요청(Request)이 있을 때만 서버가 응답(Response)하여 해당 정보를 전송하고 곧바로 연결을 종료하는 방식

HTTP 통신의 특징

- Client가 요청을 보내는 경우에만 Server가 응답하는 단방향 통신이다.

- Server로부터 응답을 받은 후에는 연결이 바로 종료된다.

- 실시간 연결이 아니고, 필요한 경우에만 Server로 요청을 보내는 상황에 유용하다.

- 요청을 보내 Server의 응답을 기다리는 어플리케이션의 개발에 주로 사용된다.

SOCKET 통신

- Server와 Client가 특정 Port를 통해 실시간으로 양방향 통신을 하는 방식

SOCKET 통신의 특징

- Server와 Client가 계속 연결을 유지하는 양방향 통신이다.

- Server와 Client가 실시간으로 데이터를 주고받는 상황이 필요한 경우에 사용된다.

- 실시간 동영상 Streaming이나 온라인 게임 등과 같은 경우에 자주 사용된다.

[Docker] 도커란?

달나라 곰돌이 — Sun, 20 Oct 2019 10:51:01 +0900

도커란?

도커

도커란 컨테이너 기반의 오픈소스 가상화 플랫폼으로 환경 분리를 도와준다.

ex) 나의 작업 환경은 윈도우고, 서버는 리눅스일때 작업물을 서버에 올렸는데 작동하지 않는경우

이때 도커를 통해 다른 머신에서도 같은 환경을 조성해 줄 수 있다.

도커의 특징

하이퍼바이저(Hypervisor) 없이 리눅스 컨테이너(LXC) 기술을 바탕으로 애플리케이션을 격리된 상태에서 실행하는 가상화 솔루션
플랫폼에 상관없이 실행될 수 있는 애플리케이션 컨테이너를 만드는 기술
리눅스 컨테이너 기술을 바탕으로 애플리케이션을 격리된 상태에서 실행하는 가상화 솔루션
리눅스 컨테이너 가상화 기술을 활용하여 애플리케이션 샌드박스를 자동 생성하는 기술

도커의 장점

1. 빠르고 가벼운 가상화 솔루션

호스트의 운영체제를 공유해 필요한 최소한의 리소스만 할당받아 동작하는 방식으로 단일 호스트에서 다중 워크로드를 구동할 수 있기 때문에 하이퍼바이저 기반 가상화솔루션에 비해 훨씬 더 가볍게 가상화 환경을 구성할 수 있다.

2. 개발자에게 자유로운 개발보장

개발 언어나 툴에 상관없이 어떠한 애플리케이션이라도 만들 수 있으며, Docker에서 만들어진 애플리케이션은 이동성이 좋아지고 어디서나 실행될 수 있다.

3. 뛰어난 보안성

서비스가 해킹도더라도 격리되어있어 원래의 서버에 영향을 미치지 않는 구조로 되어있다.

도커 이미지

이미지는 컨테이너를 생성할 때 필요한 요소이며, 가상 머신을 생성할 때 사용하는 ISO 파일과 비슷한 개념
컨테이너 실행에 필요한 파일과 설정값등을 포함하고 있는 것으로 상태값을 가지지 않고, 변하지 않는다.
컨테이너는 이미지를 실행한 상태라고 볼 수 있고 한 이미지로 여러개의 컨테이너를 생성할 수 있다.
이미지는 컨테이너를 실행하기 위한 모든 정보를 가지고 있기 때문에 더 이상 의존성 파일을 컴파일 하고 이것저것 설치할 필요가 없다.
docker 이미지는 docker hub에 등록하거나, docker registry 저장소를 직접 만들어 관리할 수 있다.

도커 이미지파일

이미지를 만들기 위해 dockerfile이라는 파일에 DSL(Domain-specific-language 언어를 이용하여 이미지 생성과정을 적는다.)
docker에서 사용하고 싶은 환경을 설정한다.(우분투, 파이썬, 깃 등)
이 파일을 통해 로컬에서와 서버에서 같은 환경을 조성해준다.

도커 컨테이너

도커 컨테이너는 이미지가 실행된 상태를 뜻한다.
도커 이미지를 기반으로 생성되며, 파일 시스템과 애플리케이션이 구체화돼 실행되는 상태. 즉, Dockerfile 을 실행시키면 도커 컨테이너가 되는것이다.
이미지 하나로는 수백개의 컨테이너를 생성할 수 있다. 마치 이 관계는 실행파일과 프로세스의 관계 같은 것이다.

도커 동작방식

도커 이미지를 빌드하기 위해 Dockerfile 을 작성한다.
Dockerfile 과 함께 도커 빌드 요청을 보낸다.
도커 서버에서는 도커 이미지를 빌드하여 로컬 저장소에 저장한다.
도커 push 명령을 받으면 도커 서버는 로컬의 도커 이미지를 도커 레지스트리에 올린다.
도커 run 명령을 배포할 도커 서버에 전송한다.
도커 run 명령을 받은 도커 서버는 도커 레지스트리에 이미지를 로컬 저장소로 다운 받는다.
도커 이미지를 이용하여 컨테이너를 시작한다.

도커와 가상머신의 차이

가상 머신은 한 컴퓨터 안에 하이퍼바이저가 물리 서버 자원들을 추상화하고, 공간을 분할하여 가상머신 이라는 독립적인 가상 환경의 서버를 이용한다. 즉, 한 컴퓨터에 있는 자원을 분배하여 사용하기 때문에 성능에 대한 이슈가 발생 할 수 있다. 반면 도커는 하이퍼 바이저와 게스트 os 가 필요가 없어서 비교적 가볍고 컨테이너안 실행 환경들이 독립적으로 돌아가는것이여서 좋은 성능을 발휘할 수 있다.

[왼쪽 가상머신 오른쪽 도커]

도커

도커는 반가상화 환경보다 더 발전한 형태로 Host OS 바로 위에서 동작하기 때문에 가상머신과 Guest OS를 동작시키기 위한 가상화 비용이 발생하지 않는다.

도커 이미지에 운영을 위한 어플리케이션 및 라이브러리만 격리하여 설치 가능하며, OS 시스템 자원은 Host와 공유한다. 따라서 이미지의 용량도 가상머신을 이용할때보다 훨씬 줄어들었다.

또한 이미지 용량뿐만 아니라 하드웨어를 가상화하는 계층이 없기 때문에 메모리 접근이나 네트워크 등을 이용하는 속도가 가상머신보다 훨씬 빠른데, Docker 1.1.2 버전 기준으로 벤치마킹 당시에는 Host OS로만 동작했을때와 속도 차이가 거의 3%도 나지 않는다.

가상머신

가상 성능이 좋지 못한 단점이 있다. CPU에 가상화를 위한 기능들이 추가되긴 했지만 물리적으로 하나의 환경으로 존재하는 것을 논리적으로 가상화해야 하기 때문에 그런 작업에 필요한 비용(overhead)이 추가적으로 발생하기 때문이다.

현재는 전가상화(Full Virualization)의 느린 속도를 개선하기 위한 반가상화(Paravirtualization) 방식이 개발되었고, 현재 널리 쓰이고 있다

[알고리즘Lv0] 짝수는 싫어요

달나라 곰돌이 — Tue, 8 Oct 2019 00:07:50 +0900

알고리즘 사이트

프로그래머스 문제로 이동

프로그래머스

programmers.co.kr

문제 설명

정수 n이 매개변수로 주어질 때, n 이하의 홀수가 오름차순으로 담긴 배열을 return하도록 solution 함수를 완성해주세요.

제한 조건

1 ≤ n ≤ 100

입출력 예

n	result
10	[1, 3, 5, 7, 9]
15	[1, 3, 5, 7, 9, 11, 13, 15]

입출력 예 설명

입출력 #1

10 이하의 홀수가 담긴 배열 [1, 3, 5, 7, 9]를 return합니다.

입출력 #1

15 이하의 홀수가 담긴 배열 [1, 3, 5, 7, 9, 11, 13, 15]를 return합니다.

해결

class Solution {
    public int[] solution(int n) {
        int temp = (n%2 == 0) ? n/2 : n/2+1;
        int[] answer = new int[temp];
        for(int i = 0; i < answer.length; i++){
            answer[i] = i * 2 + 1;
        }
        return answer;
    }
}

[알고리즘Lv0] 최빈값 구하기

달나라 곰돌이 — Mon, 7 Oct 2019 18:56:45 +0900

알고리즘 사이트

프로그래머스 문제로 이동

프로그래머스

programmers.co.kr

문제 설명

최빈값은 주어진 값 중에서 가장 자주 나오는 값을 의미합니다. 정수 배열 array가 매개변수로 주어질 때, 최빈값을 return 하도록 solution 함수를 완성해보세요. 최빈값이 여러 개면 -1을 return 합니다.

제한 조건

0 < array의 길이 < 100
0 ≤ array의 원소 < 1000

입출력 예

array	result
[1, 2, 3, 3, 3, 4]	3
[1, 1, 2, 2]	-1
[1]	1

입출력 예 설명

입출력 예 #1

[1, 2, 3, 3, 3, 4]에서 1은 1개 2는 1개 3은 3개 4는 1개로 최빈값은 3입니다.

입출력 예 #2

[1, 1, 2, 2]에서 1은 2개 2는 2개로 최빈값이 1, 2입니다. 최빈값이 여러 개이므로 -1을 return 합니다.

입출력 예 #3

[1]에는 1만 있으므로 최빈값은 1입니다.

해결

class Solution {
    public int solution(int[] array) {
        int answer=0;
        int arrayMax=0;
        for(int i=0; i<array.length; i++) {
            if(array[i]>arrayMax) {
                arrayMax=array[i];
            }
        }
        
        int[] count=new int[arrayMax+1];
        for(int j=0; j<array.length; j++) {
            count[array[j]]++;
        }
        
        int countMax=0;
        for(int m=0; m<count.length; m++) {
            if(count[m]>countMax) {
                countMax=count[m];
                answer=m;
            }
        }                                            
        
        int rep=0;
        for(int n=0; n<count.length; n++) {
            if(countMax==count[n]) { 
                rep++;
            }
        }
        
        if(rep!=1) {
            answer=-1;
        } 
        return answer;
    }
}

[알고리즘Lv0] 중앙값 구하기

달나라 곰돌이 — Mon, 7 Oct 2019 16:24:23 +0900

알고리즘 사이트

프로그래머스 문제로 이동

프로그래머스

programmers.co.kr

문제 설명

중앙값은 어떤 주어진 값들을 크기의 순서대로 정렬했을 때 가장 중앙에 위치하는 값을 의미합니다. 예를 들어 1, 2, 7, 10, 11의 중앙값은 7입니다. 정수 배열 array가 매개변수로 주어질 때, 중앙값을 return 하도록 solution 함수를 완성해보세요.

제한 조건

array의 길이는 홀수입니다.
0 < array의 길이 < 100
-1,000 < array의 원소 < 1,000

입출력 예

array	result
[1, 2, 7, 10, 11]	7
[9, -1, 0]	0

입출력 예 설명

입출력 예 #1

본문과 동일합니다.

입출력 예 #2

9, -1, 0을 오름차순 정렬하면 -1, 0, 9이고 가장 중앙에 위치하는 값은 0입니다.

해결

import java.util.*;

class Solution {
    public int solution(int[] array) {
        int answer = 0;
        int temp = 0;
        int[] tempList = new int[array.length];
        if(array.length == 1){
            answer = array[0];
        }else{
            Arrays.sort(array);
            answer = array[array.length/2];
        }
        return answer;
    }
}