개발개발

제네릭 제네릭을 이용하면 스택의 활용성을 높일 수 있다. 타입 보장 재사용성 generic을 공부하면, 오픈 소스 api를 막힘없이 이해할 수 있다. { function checkNotNull(arg: number | null): number { if(arg === nulll) { throw new Error('not valid number!') } return arg; } const result = checkNotNull(123); } checkNotNullString, checkNotNullNumber 이렇게 타입별로 함수를 만들어야 할까? 아무 타입이나 다 되게 만드려고 any를 쓴다면, 타입을 잃어버리게 된다! Generic은 쓸 때 타입이 결정되기 때문에 타입을 보장받을 수 있게 ..

이번 글에서는 도커가 무엇인지 알아보고 어떤 문제를 해결하기 위해 만들어졌고, 문제를 어떻게 해결했는지 알아봅니다. 도커란 컨테이너 기반의 오픈 소스 가상화 플랫폼이다. 먼저 도커를 알아보기 전에 서버를 관리하는 것이 어떤 것인지 알아보자 서버를 관리한다는 것 서버 관리는 복잡하다. 겉으로 봤을 때는 서버가 잘 도는 것 처럼 보이지만, 내부는 복잡하게 구성되어 있다. 도커 등장 이전에 서버 문서를 보면... oracle 설치해주세요. wordpress 설치해주세요. gitlab 설치해주세요 —> 뭔가 잘 안된다. 뭔가 어떻게 하는지도 모르겠는데, 블로그를 따라서 설치하다보면 떠야 할 게 안뜰 수 있고 서버에서 설정을 실수했거나 문서가 오래됐거나, 따라했을 때 제대로 설치안될 경우가 많다. 단순히 프로그램..

언어의 세 가지 구성 요소 기호가 들어갈 상자: 비트 상자에 들어갈 기호 상자의 순서 비트 비트는 2진법을 사용한다. 이 비트를 조합해 이어 붙여서 표현한다. 논리 연산 비트 사용법 중 하나는 true/false를 표현하느 ㄴ것이다. 다른 비트들이 표현하는 내용으로부터 새로운 비트를 만들어내는 동작을 '논리 연산'이라고 한다. 불리언 대수 불리언 연산자는 NOT, AND, OR과 합성연산인 XOR 드모르간의 법칙 NotNot 비가온다 or NotNot 춥다 ⇒ Not Not 코트를 입는다. Not(비가온다 and 춥다) ⇒ Not(코트를 입는다) Not 연산을 수행하는데 하드웨어에 실제로 돈이 많이 들고 연산을 연쇄적으로 사용하면 계산이 느려진다. 정수를 비트로 표현하는 방법 음수 표현 부..

리액트는 먼저 컴포넌트를 렌더링한 뒤, 이전 렌더링된 결과와 비교하여 DOM 업데이트를 결정한다. 만약 렌더 결과가 이전과 다르다면, React는 DOM을 업데이트한다. 리액트 memo는 고차 컴포넌트다. 컴포넌트가 React.memo() 로 래핑될 때, 리액트는 컴포넌트를 렌더링하고 결과를 메모이징한다. 그리고 다음 렌더링이 일어날 때 props가 같다면, 리액트는 메모이징된 내용을 재사용한다. export React.memo(function MyComponent({name, age}){ return ( {name}:{age} ) }) React.Memo(MyComponent)는 새로 메모이징된 컴포넌트를 반환한다. props인 name이나, age가 변경되지 않는다면, 다음 렌더링 때 메모이징된 내용..

브라우저의 구성 요소를 알아보고, 각 요소가 사용자가 주소를 입력하고 화면을 렌더링하기까지 어떤 역할을 하는지 알아봅니다. 브라우저의 구성 요소 사용자 인터페이스 브라우저 엔진 렌더링 엔진 통신 ex)HTTP UI 백엔드 자바스크립트 해석기 자료 저장소(client side storage) 브라우저 구성 요소 프로세스 브라우저 각각의 구성 요소별로 별도의 프로세스에서 제어된다. 크롬에서 렌더러 프로세스를 여러 개 사용하는 이유는 탭마다 렌더러 프로세스를 사용함으로서 한 탭이 응답하지 않을 때 다른 탭을 사용할 수 있기 때문이다. 브라우저 프로세스 주소 표시줄, 북마크 막대기, 뒤로 가기 버튼, 앞으로 가기 버튼 등 브라우저 UI 부분을 제어 힌다. UI 스레드, 네트워크 스레드, 스토리지 스레드등이 있다..

타입스크립트 기본 타입 이번 글에서는 타입스크립트 기본 타입을 정리했습니다. Array vs string 이 둘의 차이점은 readonly 변수를 만들 때 차이가 난다. function pushNumber(numbers: readonly number[]) { numbers.push(1) // warning (x) } function pushNumber(numbers: readonly Array) { numbers.push(1) // 'readonly' type modifier is only permitted on array and tuple literal types } Object의 불변성을 보장하기 하고 일관성 있는 코드를 작성하고 싶다면 string[]을 사용하는 것이 좋다. Tuple은 언제 사용할..