기록하는 개발자 기록하는 개발자

✔ React의 개념과 장점, 그리고 컴포넌트란 무엇인가요? React는 UI를 구축을 위한 자바스크립트 프론트엔드 라이브러리 입니다. 주로 Single Page Application를 만들 때 사용됩니다. React의 장점에는 virtual DOM을 사용해서 어플리케이션의 성능을 향상시키고, 클라이언트 사이드 렌더링이 가능합니다. 또한 다른 프레임워크와도 사용이 가능하며, 컴포넌트의 가독성을 높이며 유지보수가 쉽습니다. 여기서 컴포넌트란, 레고 블록과 같이 작은 단위로 만들어서 그것을 조립하는 것처럼 개발하는 방법입니다. 컴포넌트를 사용한다면 캡슐화, 확장성, 결합성, 재사용성과 같은 이점이 있습니다. [정리] 개념: UI를 구축하기 위한 자바스크립트 프론트엔드 라이브러리 장점: virtual DOM을..

HTTP(Hyper Text Transfer Protocol) 인터넷에서 클라이언트와 서버가 데이터를 주고받을 수 있는 프로토콜(규칙)입니다. 클라이언트는 데이터를 서버로 요청하는 요청자이며, 흔히 웹브라우저가 그 역할을 하고 응용프로그램에서는 HTTP요청을 위해 사용하는 라이브러리가 클라이언트 역할을 합니다. 서버는 클라이언트가 요청한 데이터를 제공하는 제공자이며, 이미지,HTML파일처럼 파일을 제공하는 서버,API서버 등 다양하게 있습니다. HTTP통신에서는 서버가 제공하는 결과를 응답(Response)라고 합니다. 80번 port를 이용합니다. HTTP 통신을 위해 저는 Axios 라이브러리를 사용해본적이 있습니다. HTTP 메세지 구조 HTTP Request 구조 HTTP Request 메세지는 ..

제가 아는 캐시는 $ 캐시밖에 없습니다.. 그래서 이번에는 캐시에 대하여 공부해봤습니다. 캐시 란...? 데이터나 자원을 미리 저장해놓는 임시 저장소 입니다. 일반적으로 캐시는 프로세서나 애플리케이션 내부에서 동작하며, 빠른 속도로 접근할 수 있고, 시스템의 성능을 개선할 수 있습니다. 캐시는 데이터의 일부만 저장하고 저장된 데이터는 일정 시간이 지나면 만료 됩니다. 캐시의 장,단점에 대해 설명해주세요. 장점 접근 속도가 빠릅니다. - 캐시에 저장된 데이터나 자원은 빠른 접근이 가능하기 때문에, 매번 원본 데이터나 자원에 접근하는 것 보다 더욱 빠른 속도로 데이터나 자원에 접근할 수 있습니다. 시스템 성능이 개선됩니다. - 빠른 접근 속도로 인해 시스템의 처리량이 개선되고, 더 많은 요청을 처리할 수 ..

음.. 프레임워크와 라이브러리의 차이점. 제가 예전에 테크유튜브를 보다가 프레임워크와 라이브러리의 차이점에 대해서 설명하는 영상을 보았는데요. 오래전이라 기억은 자세히 나지 않지만 차이점은 이랬습니다. 프레임워크 : 정해진 규정에 맞게만 코드를 작성하면 됨 라이브러리 : 이 코드가 아니면 안됨 근데 React 공식문서를 가보면 대문에 React는 라이브러리 라고 소개하고있는데, 음.. 저렇게 따지면 React는 프레임워크가 아닌가? 라는 생각이 듭니다. 그래서 아직도 React가 프레임워크다, 라이브러리다 공방이 펼쳐지고 있는 것 같은데요. 오늘 주제를 통해서 프레임워크와 라이브러리의 차이점이 뭔지 확실히 알아보겠습니다! 프레임워크 뼈대나 기반구조를 뜻하며, 제어의 역전 개념이 적용된 대표적인 기술. 전..

parameter와 argument는 분명히 다르다고 하는데 저는 뭐가 다른지 알지 못합니다. 자, 이번에는 GPT선생님한테 물어보았습니다. GPT선생님은 parameter와 argument가 자바스크립트 함수에서 매우 중요한 개념이라고 하네요. 개념은 GPT선생님이 답변해준걸 보고 한번에 이해됐습니다. parameter는 함수를 "정의 할 때" 함수의 인자를 나타내는 변수를 말합니다. 함수를 "호출하기 전"에 미리 정의되며, 함수의 인자 값을 함수 내부에서 참조하여 사용합니다. // 예시코드 const greet = (name) => { console.log(`hello, ${name}!`); } 위 예제에서 name은 함수 greet의 parameter입니다. argument는 함수를 "호출 할 때"..

정말 많이 들어봤던 호이스팅! 이 호이스팅은 어떤 역할을 하고 또 무엇일까요? ..저도 몰라서 찾아봤습니다. MDN에는 이렇게 적혀있습니다. 호이스팅 JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다. 반면 let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않습니다. 호이스팅을 설명할 땐 주로 "변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는 것"으로 말하곤 합니다. 따라서 변수를 정의하는 코드보다 사용하는 코드가 앞서 등장할 수 있습니다. 다만 선언과 초기화를 함께 수행하는 경우, 선언 코드까지..

프론트엔드 개발자라면 필수로 알고 있어야 하는 브라우저 렌더링 과정! 사실 지금까지의 개발은 많은 부분들이 그 기술에 대해서만 공부하고, 원리만 조금 알고서 공식문서를 보며 코드를 작성했던 것 같습니다. 브라우저에 어떻게해서 이런 화면이 나타나고 그런건 고민해본 적이 없는 것 같은데요. 취업 준비를 하다보니 이러한 지식을 필수로 알고있어야 했고 저는 프론트엔드 개발자로서 한발자국 더 성장하기 위해 CS관련 지식을 쌓고 있습니다. 그래서 거두절미 하고 현재 면접에서 브라우저 렌더링 과정을 설명할 수 있나요? 라고 질문을 받는다면, 현재까지는 "아니요" 입니다. 관련 자료를 찾아봤습니다. 그래서 브라우저 렌더링이 뭔데..? 브라우저 렌더링이란, HTML, CSS, JavaScript 등 개발자가 작성한 문서..