도커란? 도커는 컨테이너를 생성하고 관리하기 위한 도구입니다. 리눅스 컨테이너에 여러 기능을 추가하여 애플리케이션을 컨테이너로 조금 더 쉽게 사용할 수 있도록 만들어진 오픈소스 프로젝트로 go 언어로 작성되어 있습니다. 기존에 쓰이던 가상화 방법인 가상 머신과 달리 도커 컨테이너는 성능의 손실이 거의 없어 클라우드 인프라 솔루션으로 주목받...
Class 클래스
Class 자바스크팁트는 프로토타입 기반의 객체지향 언어입니다. static method or static properties 프로터타입에 할당되지 않고 생성자 함수 객체에 직접 할당되어있는 프로퍼티와 메소드를 static method, static properties라고 합니다. 생성자 함수를 new 연산자 없이 함수로써 호출할 ...
객체 지향 Prototype
객체지향 프로그래밍 OOP(Object Oriented Programming) 이란? 서로 관련 있는 데이터와 함수를 객체(하나의 역할을 수행하는 메소드와 변수의 묶음)로 정의해서 서로 상호작용할 수 있도록 프로그래밍해나가는 것을 의미합니다. 각 객체는 메시지를 받을 수 있고, 데이터를 처리할 수도 있으며, 또 다른 객체에게 메시지를 전달할...
Javascript This
자바스크립트에서 this는 실행 컨텍스트가 생성될 때 바인딩됩니다. 즉, 함수가 호출될 때 this가 결정된다는 것입니다. 아래 소스를 보면 어떻게 호출했느냐에 따라 this가 달라집니다. var student = { name: "jennie", myName: function () { console.log(this.name); }...
실행 컨텍스트
실행 컨텍스트란? 자바스크립트가 실행되는 환경으로 함수를 실행할 때 필요한 조건, 환경정보를 제공하는 객체입니다. 실행 컨텍스트를 이해하면 Scope, hoisting, closure, this와 같은 중요한 동작을 이해할 수 있습니다. 실행 컨텍스트의 내부 var a = 1; function outer() { console.log...
JS 데이터 타입(원시형 vs 참조형)
자바스크립트에서 데이터 타입에는 아래와 같이 원시형과 참조형으로 나뉩니다. 자바스크립트 메모리 구조는 스택 메모리(정적 할당, 변수, 원시형 데이터 저장)와 힙 메모리(동적 할당, 참조형 데이터, 저장) 영역으로 나뉘어 있습니다. 원시형(Primitive Type) 객체를 제외한 모든 타입은 원시 값(불변 값)으로 값을 그대로 할당합니다...
바벨(Babel) 설정하기
바벨(Babel)을 왜 사용할까? 바벨은 트랜스파일러로 최신 자바스크립트(타입스크립트, JSX 포함)가 모든 브라우저에서 동작하도록 변환해 줍니다. 실행이 안되는 구버전 웹브라우저를 대응하기 위해 배포할 때에 예전 방식의 자바스크립트로 변환해서 배포하려고 사용합니다. 바벨 빌드 과정 파싱(Parsing): 코드를 분해하는 과정 ...
React Query
React-Query란? React 애플리케이션에서 데이터를 가져오기 위한 라이브러리입니다. 데이터 Fetching, 캐싱, 동기화, 서버 쪽 데이터 업데이트 비동기 과정에서 데이터를 관리하기 편하게 할 수 있습니다. 사용하는 이유 아래와 같이 React는 데이터를 가져올 때 useEffect를 사용하고 useState를 사용하여 상태를 유지합...
CRA(React Create App) 웹팩 설정하기
CRA(Create React App)는 프로젝트 초기 세팅 및 복잡한 과정을 해결해줍니다. 예를 들어, 아래와 같은 명령어로 타입스크립트 환경의 리액트 프로젝트를 만들 수 있습니다. yarn create react-app my-app --template typescript 이렇게 프로젝트를 만들게 되면 바벨이나 웹팩 같은 종속된 라이브러리나 ...
HTTP와 HTTPS
HTTP 란? http는 Hyper Text Transfer Protocol의 약자로 웹에서 요청과 응답의 형태로 정보를 주고받을 수 있는 프로토콜입니다. TCP 기반으로 작동하며 비연결성, 비상태성 특징을 가집니다. 이로 인해 많은 실제 동시 접속을 최소화하여 더 많은 유저의 요청 처리를 할 수 있습니다. ...