개념 정리 14

[알고리즘] 시간 복잡도(Time Complexity)

알고리즘? 컴퓨터에게 내리는 지시사항을 나열한 것 시간 복잡도? 시간 복잡도는 n개의 입력 데이터에 대해 알고리즘이 문제를 해결하는데에 얼만큼의 시간(걸리는 절차 수)이 걸리는지를 나타내는 것을 말한다. 일반적으로 시간 복잡도를 나타내기 위해 점근적 표기법(asymptotic notation)을 사용한다. 점근적 표기법 - 중요하지 않은 상수와 계수들을 제거해 알고리즘의 실행 시간에서 중요한 성장률에 집중하는 방법을 의미함 점근적이라는 의미는 가장 큰 영향을 주는 요소만 계산한다는 의미 점근적 표기법에는 다음과 같은 세가지가 존재한다. 오메가 표기법(Big-Ω notation) 세타 포기법(Big-θ notation) 빅오 표기법(Big-O notation) 효율적인 방법을 고민한다는 것은 시간 복잡도를..

개념 정리 2023.02.20

package.json 작성하기

package.json은 프로젝트의 정보를 정의하고, 의존하는 패키지 버전 정보를 명시하는 파일이다. 일반적으로 Root 디렉토리에 위치한다. npm init 으로 package.json을 생성했다면 터미널에서 입력 프로세스와 함께 프로젝트 정보는 이미 name(프로젝트명)과 version(1.0.0)이 자동 입력되어 생성되었을 것이다. 패키지 변경은 버전 변경과 함께 제공되어야 한다는 것만 우선 기억하도록 하자. 이번 글은 패키지 정보에 포커스를 맞출 것이므로 프로젝트 정보에 대한 추가 설명을 진행하지 않겠다. 패키지와 모듈 1. 패키지 패키지는 package.json으로 설명되는 파일 또는 디렉토리이다. 패키지는 npm 레지스트리에 공개되기 위해 반드시 package.json 파일을 가지고 있어야 한..

개념 정리 2022.05.03

쿠키, 세션, 캐시, 토큰

클라이언트에서 요청(request)를 보내면 서버는 요청을 처리해서 응답(response)을 한다. 이 때 브라우저와 서버간에 데이터를 주고 받기 위한 방식으로 HTTP 프로토콜을 사용한다. HTTP 프로토콜이란 HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 상호간에 정의한 (데이터 교환 교환을 위한)규칙을 말한다. HTTP 프로토콜은 서버에 연결하고 요청해서 응답을 받으면 연결을 끊어버리는 Connectionless(비연결지향)와 연결을 끊는 순간 통신이 끝나며 상태 정보를 유지 않는 Stateless(상태정보비유지)라는 특징을 가진다. 이러한 특징 때문에 세션과 같은 별도의 추가 정보를 관리하지 않기 때문에 이러한 추가 정보를 가지고 있어야 하는 상황에는 쿠키, 세션 등을 이용해 클라이언트..

개념 정리 2022.05.02

package.json과 package-lock.json 그리고 node_modules

회사에서 지난 프로젝트의 소스코드를 유지, 수정하고 새로운 기능을 추가해야 하는 추가 프로젝트에 참여하게 됐다. 기존 소스 코드는 React로 만들어진 프로그램으로 아직 수정될 내용이나 추가될 기능에 대한 기획서를 받아보지 못한 상태에 코드 분석을 먼저 진행하기 위해 소스코드를 클론했다. 근데... npm install을 해도 아무리 해도 node_modules 폴더도 생성되지 않았으며 당연히 실행되지 않았다. 검색 및 지인 찬스를 이용해 결국 버전이 너무 낮은 모듈 때문에 그랬던 것으로 확인했다. 그도 그럴 것이 소스코드 마지막 수정이 3년전... 해당 모듈을 stable한 버전으로 변경하니 실행되는 것을 확인했다. 어찌저찌 상황은 해결했지만 보다 근본적인 의문이 생겼다. 그동안은 그냥 튜토리얼을 보고..

개념 정리 2022.04.21

스택(STACK), 큐(QUEUE)

스택이란? 스택(STACK)은 객체들의 집합소로 데이터를 기록하는 구조라고 보면된다. 스택이란 쌓아올린다는 것을 의미한다. 따라서, 스택 구조라는 것은 책을 쌓는 것처럼 차곡차곡 쌓아올린 형태의 구조를 말한다. 스택의 특징 스택은 같은 구조와 크기의 자료를 정해진 방향으로만 쌓을 수 있고, 정해진 곳을 통해서만 접근할 수 있다. 아래가 막혀있고 위가 뚫린 형태로 차곡차곡 쌓는 구조로 볼 수 있는데, 이러한 경우 가장 위의 자료가 가장 최근에 쌓인 자료가 된다. 스택은 시간 순서에 따라 자료가 쌓여 가장 마지막에 삽입된 자료가 가장 먼저 삭제된다는 구조적 특징을 가진다. 이를 후입선출(LIFO, Last-In-First-Out)구조라고 한다. 스택에서 삽입은 PUSH, 삭제는 POP이라는 용어로 사용하고 ..

개념 정리 2022.04.19

폴리필(polyfill)

JS는 새로운 문법이나 기존에 없던 내장 함수에 대한 정의가 추가되곤 한다. 새로운 문법을 사용해 코드를 작성할 경우, 트랜스파일러(예를 들자면 Babel)는 이를 표준에 맞는 코드로 변경해둔다. 반면, 새롭게 추가된 함수는 명세서(JS) 내 정의를 읽고 이에 맞게 직접 함수를 구현해야 사용할 수 있다. 이렇게 변경된 표준을 준사할 수 있게 기존 함수의 동작 방식을 수정하거나, 새롭게 구현한 함수의 스크립트를 "폴리필"이라고 부른다. 폴리필(polyfill)은 말 그대로 구현이 누락된 새로운 기능을 메꿔주는 (fall in) 역할을 한다. 좀 더 쉽게 바꿔 말하면 브라우저가 지원하지 않는 자바스크립트 코드를 지원 가능하도록 변환한 코드를 말한다. 주목할 만한 폴리필 두가지는 아래 참고 core js - ..

개념 정리 2022.02.07

terminal 명령어 모음

1) 홈 디렉토리로 이동 cd ~ 2) 새 디렉토리(폴더) 생성 mkdir [디렉토리(폴더)명] 3) 디렉토리(폴더) 이동 cd [디렉토리(폴더)명] 4) 부모 디렉토리로 이동 cd ../ 5) 현재 경로 출력(print working directory) pwd 6) 디렉토리 내용 출력 ls 7) 디렉토리의 폴더 상세 정보까지 출력 ls -l 8) 디렉토리의 숨김 파일과 디렉토리까지 출력 ls -a *tip: 옵션은 합쳐서 ls -al처럼 사용이 가능하다. 9) 파일이 있는 디렉토리를 내용과 함께 삭제 rm -rf [디렉토리(폴더)명] 10) vi 편집기로 [파일명.확장자명) 파일을 작성 vim [파일명.확장자명] 11) 파일 생성 touch [파일명.확장자명] 12) 터미널 창의 내용 삭제 clear ..

개념 정리 2022.01.25

git 명령어 모음

git 명령어 1) [파일명.확장자명]을 스테이지에 올림 git add [파일명.확장자명] git add . #수정한 전체파일을 스테이지에 올림 2) 커밋 메시지[메시지명]을 붙여 커밋 git commit -m "[메시지명]" 3) 메시지[메시지명]을 붙여서 스테이징과 커밋을 동시에 진행 git commit -a -m "[메시지명]" 4) 커밋 내역 확인 git log git log --pretty=oneline #한줄로 출력 git log --oneline #할줄에 한커밋씩 출력 git log --branches --graph. #커밋로그에 각 브랜치의 커밋을 그래프로 표시 5) 특정 커밋 내역 확인 git show [커밋 id] 6) 최근 버전과 작업 폴더의 수정 파일 사이의 차이를 출력 git di..

개념 정리 2022.01.21

이메일 템플릿(웹메일) 코딩 시 주의사항

HTML은 태그로 마크업할 것 네이버, 다음, 구글 등 이메일 클라이언트들은 각각 다른 이메일 렌더링 버전을 가지고 있다. 보안상의 이유로 일부 코드를 막아두거나 쓸 수 있는 태그와 속성, css 속성에 제한을 두고 있으며, 그로 인해 작성한 코드가 적용되지 않는 경우도 있다. 또한 기존 자주 사용하는 태그로 웹표준 방식의 마크업을 하게 되면 구조가 틀어지게 된다. 그러므로 대부분의 이메일 클라이언트에서 잘 나오는 태그가 크로스 브라우징에도 적합하다. CSS는 인라인 스타일로 작성할 것 css를 정의하는 방법은 아래와 같이 3가지가 있다. 외부문서 작성(Linked Style) 문서내부 작성(Embedded Style) 태그에 직접 지정(Inline Style) 이메일 클라이언트는 보안상의 이유로 나 태..

개념 정리 2022.01.21

<wbr> vs <br>

는 단어 중간에서 행바꿈될 수 있는 위치를 정의할 때 사용함. 길이가 굉장히 긴 단어의 경우, 브라우저는 자동으로 행바꿈을 실행하게 되는데 이때에 브라우저가 해당 단어를 잘못된 위치에서 행바꿈하지 않도록 요소를 사용하여 행바꿈 될 수 있는 위치를 직접 명시할 때 사용합니다. 태그는 길이가 긴 단어의 경우, 브라우저와 상관없이 무조건 행바꿈을 실행하도록 명시합니다. * 태그는 html5에서 새롭게 추가된 요소로 ie에서는 지원하지 않음. http://this.is.a.really.long.example.com/With/deeper/level/pages/deeper/level/pages/deeper/level/pages/deeper/level/pages/deeper/level/pages

개념 정리 2022.01.18