한 걸음씩 기록하며

1. String Concatenations (’A’ + ‘B’) → ‘AB’ (’1’ + 2) → 12 숫자형이 문자형을 만나면 문자형으로 변한다. String Literals ${1 + 2} -> 3 백틱을 이용 2. Numeric Operators : add : substract / : divide : multiply % : remainder / 나머지 값만 리턴 ** : exponentiation / 제곱 3. Increment and decrement operators ++ : increment operator — : decrement operator 1) preIncrement (decrement도 동일) let A = 3; const B = ++A; console.log(A); // 4 co..

디버깅이란? 정확하게 코드에서 어느 부분이 문제를 초래하였는지 범위를 좁혀가면서 명확하게 버그를 처리하는 것을 뜻함 디버깅에서 가장 중요한 것은 문제를 정의하는 것, 그리고 그에 대한 솔루션을 찾는 것그러나 이 문제가 버그에만 국한하지는 않음 UX/UI, logic/flow, performance, cost 등 모든 문제들을 포함 즉, 1) 원하는 목표를 정해두고, 2) 지금 실제로 발생하는 버그와 이슈가 무엇인지 발견하여, 3) 그 차이를 좁혀나가는 것을 디버깅 디버거 기본 사용법 개인이 코드의 문제점을 찾을 수 있지만, 디버거를 사용하여 조금 더 상호소통적(interactive)으로 동적으로 값을 변경하고 확인할 수 있음 보통 Run and Debug를 사용 의심 가는 곳이 있다면 그 곳에 break..

CI : Continuous Integration CD : Continuous Delivery / Deployment 어플리케이션 개발 단계부터 배포 때까지 이 모든 단계들을 자동화를 통해서 조금 더 효율적이고 빠르게 사용자에게 빈번이 배포할 수 있도록 만드는 개발 프로세스 *CI (지속적인 통합) 버그 수정, 새로 만드는 기능들이 매일 레포에 주기적으로 빌드되고 테스트가 되어서 머지되는 것을 말함 이 방식은 1991년 Grady Booch에 의해서 사용되어지다가, 나중에는 extreme programming 개발 방법론에서 채택되어졌음 Graday Booch는 객체지향 프로그래밍에 관련된 아주 유명한 책을 쓴 저자 *Ci 포인트 1) 코드 변경 사항을 메인 레포에 주기적으로 빈번하게 머지해야한다. - ..

* Immutable vs Mutable - Immutable Data type 데이터 자체를 변경하지 못하는 것 primitive types, frozen objects (i.e object.freeze()) - Mutable Data type all objects JS에서 모든 array는 변경 가능 (다른 언어와 차이점) 1. 변수 (variable) / mutable / rw(read/write) 변수 : 변경될 수 있는 값 (mutable) let : ES6부터 추가됨 let name = ‘haksae’ name = ‘wonssi’ Block scope { }을 사용하면, 블럭 안에 있는 코드는 블럭 밖에서 볼 수 없음. 블럭 밖에서 접근해도 아무 값도 나오지 않는다. global scope 블..

HTML에서 JS를 포함할 때 어떻게 포함하는게 효율적인가? 1. head 안에 스크립트를 포함 브라우저가 한줄씩 파싱하다가 CSS와 병합하면서 DOM 요소로 병합 (parsing HTML) 파싱하다가, 필요한 자바 스크립트 파일을 다운받아서 실행 (fetching js, executting js) 단점 : js 파일이 엄청 크면, 출력까지 오래 걸릴 수 있음 이러한 방식으로 보통 하지 않음 2. body 안에 스크립트를 포함 (주로 뒤에) JS를 받기 전에도 페이지가 준비가 되어서, 사용자가 먼저 페이지에 컨텐츠를 볼 수 있음 단점 : 웹사이트가 자바스크립트에 의존적이라면 사용자가 의미있는 컨텐츠를 보기 위해서는 오래 기다려야하는 단점이 있다. 3. head+async async는 boolean 타입의..

1. 용어 정리 동기(Synchronous) 동기는 요청과 동시에 그 결과가 일어나는 뜻이다. 즉 함수를 호출 했을 때 이 함수의 결과를 호출한 쪽에서 처리하면 동기 비동기(Asynchronous) 비동기는 요청과 그 결과가 동시에 일어나지 않는 뜻이다. 즉 함수를 호출 했을 때 함수의 결과를 호출한쪽에서 처리하지 않을 수도 있다. 블로킹(Blocking) 블로킹은 자신의 수행결과가 끝날 때까지 제어권을 갖고 있는 것을 의미한다. 즉 연산이 끝날때까지 다른일을 수행하지 않고 대기하는 방식 논블로킹(Non-blocking) 자신이 호출되었을 때 제어권을 바로 자신을 호출한 쪽으로 넘기며, 자신을 호출한 쪽에서 다른 일을 할 수 있도록 하는 것을 의미합니다. 즉 연산이 끝날 때 까지 대기하는 것이 아니라 다..

1. Webhook이란? "A webhook in web development is a method of augmenting or altering the behavior of a web page or web application with custom callbacks." - 위키피디아 위의 설명에 따르면 웹훅은 웹 페이지 또는 웹 앱에서 발생하는 특정 행동(이벤트)들을 커스텀 콜백으로 변환해주는 것이다. 2. 왜 Webhook을 사용하는가? 일반적인 API(Polling)는 클라이언트가 서버를 호출하는 방식이라면, 웹훅은 서버에서 특정한 이벤트가 발생했을 때 클라이언트를 호출해주는 방식이다. (그렇기에 역방향 API라고도 부른다.) 아래의 그림이 폴링과 웹훅의 차이를 잘 보여준다. API 구현 방식 클라..

1. Low-level & High-level Language 1) Low-level Language 컴퓨터가 이해하기 쉽게 작성된, 하드웨어와 더 밀접한 언어를 뜻한다. 실행 속도가 매우 빠르지만 배우기가 어렵고, 유지보수가 힘들다. Machine language(기계어) 또는 Assembly language(어셈블리어)가 저레벨 언어에 해당한다. 2) High-level Programming Language 사람이 이해하기 쉽게 작성된 프로그래밍 언어 저레벨 언어보다 가독성이 높고 다루기가 쉽다는 장점이 있다. 3) compile Compile이란 고레벨 프로그래밍 언어로 쓰여진 프로그램으로 작성된 소스코드를 오브젝트 코드로 변환하는 것을 뜻한다. 명령어 실행을 위해서는 저레벨 언어인 기계어로 쓰여져..