그리디(탐욕) 알고리즘 가장 좋은 것만 취한다는 의미에서의 그리디이다. 이전 결과를 신경쓰지 않고, 현재 상황에서 자신이 가진 최적 값과 입력된 값을 비교해 최적인 값을 취한다. 언제 사용하는가? 최적의 해(최대, 최소 등)를 구해야 하는 경우 주의할 점 항상 최적해를 도출하는가에 대한 주의를 해야 한다. 자주 등장하는 유형 순회하며 최적해 고르기 처음부터 끝까지 쭉 훑으며 비교해 최적해를 계속 갱신하는 방식 배열에서 최대/최소값 찾기가 이에 해당한다. 최적해를 도출할 공식을 정한 뒤 예외를 쳐 냄 항상 최적인 공식이 정해져 있고, 이를 최대한 많이 적용하는 방식 웬만한 난이도에서면 최적인 공식만을 적용할 수 없도록 예외가 존재한다. 이를 빠짐없이 찾아내는 것이 어려워 은근 정답률이 낮은 유형 최대/최소..
정의 ESLint ECMA로 이루어진 코드의 오류 체크, 가독성 향상(들여쓰기, 줄간격 체크) 등을 위해 사용하는 도구. Prettier ESLint와 달리 오류 체크는 하지 않으나 code formatting을 일관된 스타일로 고정하는 도구. ESLint &Prettier 보통 두 가지를 함께 사용한다. 이를 통해 얻을 수 있는 이점은, 개발자의 실수로 발생하는 오류를 사전에 예방하고, 협업 시 코드 스타일을 일관되게 함으로써 가독성을 향상시킬 수 있다는 것이다. 팀 프로젝트에서는 코드 리뷰를 자주 하게 되므로 서로의 코드를 익숙하게 검토하기 위해서라도 lint와 prettier 도입은 필수적이다. 자주 사용하는 설정 NPM // 이 2개의 경우 global 설치도 해 두면 좋다. (최초 1회만) np..
주석 /* 주석입니다 */ 중첩 .parent { color: red; .child { background-color: blue; } } 상위 선택자 참조 "&" .parent { /* 여기서 &는 .parent 를 가리킴 */ } 상위 선택자 무시 "@at-root" .parent { $w: 100px; @at-root .parent2 { ... } } 상위 선택자에 선언된 값은 쓰고싶은데 .parent의 자식은 아닐 때 사용한다. 변수 $변수명: 값; /*ex*/ $red: #ff0000; $header-color: $red; 여타 프로그래밍 언어와 동일하게 중괄호 내에서 선언 시 그 밖에서는 사용 불가. 글로벌 변수 !global $변수명: 값 !global; 있으면 그대로 없으면 새 걸로 !def..
서버가 실행될 환경이 개발 환경(development)인지 배포 환경(production)인지에 따라 별도의 코드가 실행되어야 할 일이 많다. 이 환경을 관리하는 방법에 대하여 알아보았다. 설정법 우선 node가 설치되어있어야 한다. (linux/mac 환경을 기준으로 하였다.) 개발 환경으로 설정하려면 다음과 같이 입력해주면 된다. export NODE_ENV=development 배포 환경으로 설정하려면 다음과 같이 입력해주면 된다. export NODE_ENV=production 사용법 node express 환경에서 설정된 NODE_ENV를 확인하는 방법은 다음과 같다. app.get("env") 따라서 별도의 config.json 파일을 생성해 환경에 따라 다른 객체를 반환하도록 한 뒤, { "..
웹팩(Webpack)이란 웹팩은 모듈 번들러(module bundler)이다. 웹팩을 통한 빌드가 수행되면, 프로그램의 시작 지점인 entry point부터 시작하여 의존하는 모듈들을 읽어내려가 하나의 파일로 묶는(bundle)다. 모듈화의 대상은 Web Application을 구성하는 요소로, html, css, js, image file(JPG, PNG) 등이 이에 해당한다. 웹팩을 사용하는 이유? 웹팩을 사용하는 대표적인 이유는 다음의 세 가지이다. 1. 자바스크립트의 전역 공간 공유로 인해 발생하는 문제를 --> 모듈화, 모듈 번들링을 통해 해결 2. 요소(html, css, js, image)의 압축과 전처리와 같은, 반복 작업의 자동화 3. 성능 향상 (웹팩은 자원이 필요한 순간에만 요청한다...
Tag 특정 커밋을 찾기 위해 branch와 같은 것을 활용할 수도 있으나 repository의 버전(version)을 표현하기 위해서는 주로 git tag 기능을 이용한다. 주요 명령어는 다음과 같다. git tag: 현재 존재하는 태그 목록 출력 git tag {tag name}: HEAD가 가리키는 commit에 {tag name} 태그를 붙임 git tag {tag name} {commit id}: 특정 커밋에 {tag name} 태그를 붙임 git show {tag name}: 해당 {tag name}이 가리키는 commit을 출력 git tag -d {tag name}: 해당 {tag name} 태그를 삭제 주로 프로젝트의 버전을 표시하기 위해 사용되므로, tag를 이용해 remote repo..
미들웨어(middleware)? 미들웨어란, 특정 기능을 수행하는 함수이다. 미들웨어 함수는 요청 오브젝트(req), 응답 오브젝트 (res), 그리고 애플리케이션의 요청-응답 주기 중 그 다음의 미들웨어 함수 대한 액세스 권한을 갖는다. (출처: express 공식 문서) Express 애플리케이션은 다음과 같은 유형의 미들웨어를 사용할 수 있다고 한다. 애플리케이션 레벨 미들웨어 라우터 레벨 미들웨어 오류 처리 미들웨어 기본 제공 미들웨어 써드파티 미들웨어 애플리케이션 레벨 미들웨어 app.use 또는 app.GET/POST 함수를 통해 작동하는 미들웨어 함수를 말한다. const func1 = (req, res, next) => { // req.id = 'not_panpan'; req.id = 'p..
웹 화면을 구성하다보면 수평, 수직으로 자료를 나란히 배치해야 하는 일이 자주 발생한다. 이를 위해 주로 사용되는 방법들을 한 곳에 정리해보기로 한다. 컨테이너에 부여하는 속성(자식 노드들을 위해 부여되는 속성)은 빨간색으로 표시하였다. 이 속성들은 레이아웃 배치를 위해 사용된다. 1. 수평 레이아웃 구성 (float + clear) float를 이용하면 요소를 수평으로 배치할 수 있으며, clear 속성을 명시해 줌으로써 다음 요소들은 지정한 컨테이너 아래에 쌓이도록 할 수 있다. clear 속성을 명시할 때에는 :after 가상 선택자를 이용하는 방법이 가장 깔끔하다. menu 1 menu 2 menu 3 login hello 결과 넘칠 시 아래로 내려간다. 브라우저 크기에 따라 가운데 영역이 변화한..