재귀함수 어떤 사건이 자기 자신을 포함하고 다시 자기 자신을 사용하여 정의될 때 재귀적(recursive)이라고 한다. 설명할 때 자기를 포함한 것이라고 생각하면 편하다. 그냥 자기를 설명할 때 나는 나야 나라는 건 나야 이렇게 설명하는 것이라고 볼 수 있다. -나무 위키 정의는 무지하게 쉽다. 내가 나를 부르면 되는 것이다. 재귀 함수와 콜 스택 함수를 호출하면 콜 스택이라는 곳에 함수가 stack으로 쌓인다. 즉, 최상위에 함수가 끝날 때까지 그 아래에 있는 함수는 남아 있다는 것이다. function c(){ console.log('C'); } function b(){ console.log('B'); c(); } function a(){ console.log('A'); b(); } a(); // c..

삽입 정렬은 가장 처음 요소는 정렬이 되어있다고 생각하고 다음 요소부터 하나씩 비교하면서 정렬하는 방법이다. ..... 이걸 또 정렬될 때까지 하면 된다. 삽입 정렬에서 중요한 것은 위치를 찾아 들어갈 때 요소들을 한 칸씩 뒤로 밀어줘야 한다. swap의 방식이 아니기 때문이다. 그래서 정렬된 요소들에 대해 뒤에서 부터 비교를 해준 후 한 칸씩 당기면서 찾아들어간다. 반복해서 들어갈 위치를 찾는다. 전체 사이클은 첫 번째 요소를 제외한(첫 번째 요소는 정렬된요소로 간주하니까!) 전체요소의 길이만큼 돌 것이고 한 사이클당 요소는 앞에 정렬된 요소의 길이만큼 돌아야 할것이다. code function insertionSort(array){ for(let i=1; i=0; j--){ // 한 사이클 // 정렬..

selectionSort는 말 그대로 선택해서 정렬한다. 작은 것을 찾아서 앞으로 보낸다. 이것이 전부다. 이 걸 또 정렬될 때까지 계속하는 거다. 새로운 배열을 만들어 가장 작은 값을 하나씩 넣어서 줄 수 도 있겠고, 원본 배열을 변경해서 하는 방법이 있을 수도 있겠다. 나는 원본 배열을 변경하는 방식으로 진행을 하려 한다. 역시 이번에도 반복문을 어떻게 구성해야 할지가 제일 중요하다. 일단 전체 요소만큼 에 사이클이 나올 것이고, 한 사이클마다 최솟값을 찾아야 한다. 또한 한 사이클을 돌게 되면 맨 앞은 제일 작은 수가 된다. code function selectionSort(array){ for(let i=0; i

bubbleSort는 인접한 두 요소를 가지고 비교해서 정렬하는 정렬 알고리즘이다. ... 한 사이클을 돌면 이렇게 가장 큰 요소가 제일 뒤로 간다. 또 다음 싸이클을 돌면 요소는 10, 12, 13, 15, 16, 20으로 정렬이 되어있을 것이다. 이걸 정렬될 때까지 계속하는 것이다. 개인적으로 이런 정렬 알고리즘을 풀 때 반복문을 어떻게 구성하느냐가 핵심인 것 같다. 나는 항상 이론으로는 이해가 어렵지 않은데 코드로 옮기려고만 하면 너무 어려웠다. 지금도 뭐 다르진 않지만... 각설하고, 모든 요소만큼 사이클이 돌아야 하므로 반복문은 0 ~ 배열의 길이 - 1 까지는 돌아야 할 것 같고, 한 사이클당 반복은 인접한 요소들을 모두 확인하고 마지막 요소가 가장 크다는 것을 알고 있으니까 0 ~ 배열의 길..

포트폴리오 사이트를 하나 만들었다. portfolio Web site created using create-react-app www.artdev.me (이놈에 cra를 안쓰던지 해야겠다. 내가 초기세팅을 해버려야겠다... 저게 계속뜬다...) ec2를 이용해서 배포를 했는데 안되는 부분이 있어서 로그를 남긴다. 지금 배포된 상태는 ec2에 express를 설치하고 static파일을 보여주는 방식으로 배포가 되어있다. static파일들은 react에서 빌드된 파일들이고, 따라서 해당 사이트에 접근하려면 포트번호를 명시해주어서 접근해야 한다. 내가 사용하는 ec2는 **** port를 tcp포트로 열어놓고 사용하고 있다. (80포트는 못쓰게? 되어있는것 같았다.) express는 지금 ****포트를 사용하고..

Flux? flux 패턴은 mvc의 복잡함때문에 나온 패턴이다. [Development] MVC 패턴 MVC 는 로직을 model, view, controller로 분리하여 data를 처리하는 방법을 말한다. view에서는 화면을 담당한다. controller는 data를 받아서 model에게 넘겨준다. 또한 model에서 data를 받아와서 view에게 주.. artdev.tistory.com mvc패턴은 view와 model사이에 양방향으로 data가 흐르기 때문에 한쪽 view에서 data 변경을 하면 다른쪽view에서도 data가 변경되고 또 그에따른 data가 변경에 다른 view가 영향을 받고...이런식으로 꼬일수가 있다고 한다. 특히 app의 규모가 커지면 이런일이 발생하게 된다고 한다. 사..

MVC 는 로직을 model, view, controller로 분리하여 data를 처리하는 방법을 말한다. view에서는 화면을 담당한다. controller는 data를 받아서 model에게 넘겨준다. 또한 model에서 data를 받아와서 view에게 주는 역할도 한다. model은 해당 data를 관리한다. 말로만 들어서는 잘 이해가 가지 않을 수 있다. // headers.pug 위 코드는 html template 언어인 pug를 사용하여 작성한것이다. indent를 사용하여 구분하는것 외에는 큰 차이는 없다. form tag로 get요청을 보내는 소스이다. 검색어를 넘기는것 같다. view에서 data를 넘기면 controller는 // controller.js controller는 해당 dat..

앞선 포스팅에서 비동기 함수를 사용할때의 callback hell을 설명한 바 있다. [Javascript] 비동기함수(2) - CallBack 비동기와 콜백 저번 포스팅에서는 비동기 함수가 어떻게 작동하는지 보았다. client에서 자원을 server에게 요청하는 코드들은 대부분 비동기함수로 작동을 한다. 예를 들어 어떤 이벤트가 발생했을때 아래의 함수.. artdev.tistory.com 2015년 6월 , Ecma International 에서는 es2015라는 새로운 문법을 도입하였다. 약 500p 분량의 내용이 있는데 나도 아직 모르는문법이 수두룩하다. ecma2015바로가기 es6라 불리는 이 문법에 promise가 설명되어있다. 조금 deep해서 mdn의 설명을봐도 좋을것 같다. -mdn m..

비동기와 콜백 저번 포스팅에서는 비동기 함수가 어떻게 작동하는지 보았다. client에서 자원을 server에게 요청하는 코드들은 대부분 비동기함수로 작동을 한다. 예를 들어 어떤 이벤트가 발생했을때 아래의 함수가 실행된다고 가정해보자. server에게 data를 가져오는 http요청을 하는 함수이다. // Client side code... function getUserData() { //request (kim 이라는 user의 데이터를 요청 ) someCallToServer({username:"kim"},(err,data)=> { if(err){ return "err!!!"; }else{ // 받아온 data를 가지고 작업... } }) } 보통 이런식으로 작업을 하게 된다. callback으로 넘겨..

// JWT란? // 왜쓰는가? // npm package 소개