TIL - 지나치지 말고 집중해보기

기술면접을 준비하면서 새롭게 알아가는 내용들과 예상질문/예비답변을 작성해보려고 한다!예상질문들을 확인해보는데 면접 준비하면서 공부해야할게 너무 많아보인다...상태 즉, state는 컴포넌트 간의 데이터 전달에 용이하고 set함수를 이용하여 생명주기를 핸들링 할 수 있다

성능 최적화데이터를 특정 개수 만틈 쪼개서 로드스크롤 감지사용자가 페이지 하단에 도달하면 새로운 데이터를 로드, 뷰포트 높이 감지 로직 필요데이터 캐싱이미 로드된 데이터 캐싱. 사용자가 스크롤을 다시 올릴 때 다시 로드하지 않아도 된다.메모리 관리 가상 스크롤(Virt

동기의미: 요청과 결과가 동시에 이루어지는 것, 또는 약속장점: 순서대로 처리 된다.단점: 요청 후 응답 시간이 얼마나 걸리더라도 요청한 지점에서 대기해야한다.비동기의미: 요청과 결과가 동시에 이루어지지 않는 것, 또는 약속장점: 요청 후 응답 시간 동안 다른 요청을

버츄얼 돔버츄얼 돔은 리얼 돔의 복사본으로 컴포넌트에 새로운 변경사항이 있을 경우, 이를 리얼 돔에 반영하기 전 버츄얼 돔에 먼저 반영하여 리얼 돔과 비교했을 때 수정된 부분만 리얼 돔에 반영한다. 버츄얼 돔은 메모리에 저장되어 빠르게 수정할 수 있고 수정 사항을 한번

var 함수 스코프 ‘var’로 선언한 변수는 함수 스코프를 가지거나 전역 스코프를 가집니다. 호이스팅 ‘var’는 호이스팅이 되어 변수 선언 이전에도 사용 가능합니다.재선언, 재할당 가능합니다.let불록 스코프‘let’은 블록 레벨의 스코프를 가집니다.‘i

이번에 다뤄볼 기술면접 예상 질문은 아주 자신있다!== 와 ===의 차이는 생각보다 간단하다.== 연산자요소의 값을 기준으로 비교한다.넓은 범위의 포괄적인 비교 연산=== 연산자요소의 값과 타입을 기준으로 비교한다.== 보다 강력한 비교 연산을 수행한다.코드로 확인해보

브라우저 작동방식은 단계별로 이해하는 것이 좋을 것 같다.🔗 참고링크브라우저의 핵심 기능은 웹페이즈를 서버에 요청하고 응답받아 표시하는 역할이다.다음은 단계별로 정리해보겠다.Rendering EngineHTML과 CSS를 로드한다.HTML과 CSS는 파서에 의해서 D

대학생 때 훤히 꽤고 있던 HTTP Method인데...얼나마 지났다고 자신 있게 대답하기 어려워졌다.그러니까 미리미리 회고해뒀어야...오늘 GET과 POST를 다시는 정리하지 않겠다는 다짐으로 작성해 보자 ㅎㅎGet은 서버에 특정 데이터를 요청할 때 사용하는 http

이번 내용은 너무 어렵다...실제로 많이 사용해보지 못한 것들이 많아서 이해하는 것이 여간 어려운 것이 아니다...많은 내용들을 찾아보다가너무 잘 설명한 다른 블로그를 찾을 수 있었다.🔗 Leesu님의 velog

전공 수업 때의 기억을 되살려보자~!HTTP는 OSI 네트워크 통신 모델의 애플리케이션(응용) 계층의 프로토콜!HTTP는 여러 유형의 요청과 응답을 정의!예를 들면, 일부 데이터를 보고싶을 때는 GET연락처 양식 작성과 같은 일부 정보를 전송하고 싶을 때는 PUT서버에

이번엔 상태불변성에 대해서 알아보고 도대체 어떤 녀석이길래 중요한지에 대해서 학습해보자잉! 상태불변성(Immutability) 많은 파트에서 상태불변성에 대해서 학습했었다. 오늘 내가 집중해 볼 것은 React 혹은 프론트엔드에서의 상태 불변성이다. 프로그래밍 측면

어제는 모의면접이 진행되었다.CS 질문을 많이 받았는데 RESTful API에 대한 질문이 기억에 남는다.아는 질문이었지만 답변에는 허점이 많았다.확실하게 내가 알고있는지 점검해보며 TIL를 작성해보자잉먼저 키워드를 REST와 API로 쪼개보자.애플리케이션 프로그래밍

여러 아티클에서 지속적으로 boiler plate라는 키워드를 접했다.그때마다 앞뒤 문맥으로 뜻을 유추해가며 읽었는데더 이상 미루지 않고 Boiler Palte가 무엇인지 알아봐야겠다.참고한 아티클에 의하면Boiler Plate이란 단어의 어원은 신문사업에서 나왔다고

최근 프로젝트에 서버 상태 관리 라이브러리로 react-query를 이용했다.이 글은 기술적 의사결정에 의한 기술/스택 채택을 담은 글이다.내가 직접 이용하지 않은 react-query의 기능들도 있지만 경험과 학습을 동시에 진행해보고자 한다.서버 상태 관리를 위한 다

오늘은 다른 아티클을 읽다가 콜백함수라는 키워드를 봤다.오늘의 TIL은 콜백함수 너야...콜백함수는 무엇이며 나아가 콜백지옥은 무엇인가?콜백함수란 다른 함수에 인자로 전달되는 함수다.본 예시에서 a함수에 callback함수를 인자로 받는다.a(callback);을 실행

이번주 토요일에는 프라임닷에서 주관하는 현업 실무자와 함께하는 컬리어 세션이 진행됐다.부트캠프에서 만난 한 멘토님의 초청으로 참여하게 되었는데 얻어가는게 많았던 시간이었다.멘토님 감사합니다ㅎㅎ많이 Tip들이 오고갔지만 기술적인 대화에서 기본적인 것에 대한 이야기가 인상

가비지 컬렉션은 학과생 때 자주 듣던 단어이다.이번엔 가비지 컬렉션을 씹고 뜯고 맛보면서 확실하게 내 것으로 만들어보자.프로그래밍에서 메모리 관리는 매우 중요한데 시스템의 성능과 직관되기도 하기 때문이다.먼저 단어에 대한 이해부터 들어가보자.프로그래밍적 의미는 내가 이

프로젝트에서 CORS 에러를 해결한 적이 있다. 학과생 때 진행했던 프로젝트인데 복기 과정에서 CORS에 대한 완전한 이해가 동반되지 못했다고 생각이 들어서 이번 기회에 못을 박고 넘어가자. 내 기억... CORS 먼저 CORS란 무엇인지 짚고 넘어가자. CORS

이번엔 webpack과 babel에 대해서 글을 작성해보자.프로젝트 개발 과정에서 vite-bundle-visualizer를 사용한 경험이 있는데 이는 프로젝트를 구성하는 bundle를 시각적인 블록으로 크기를 확인할 수 있다.여기서 bundle하면 떠오르는 webpa

이번에는 새로운 테스트 도구에 대해서 알아보려고한다.아티클을 읽어보던 중에 흥미로운 내용이 있어서 글을 아니 쓸 수가 없었다.오늘의 주인공은 얼마전 넷플릭스에서 개발한 테스트 도구 SafeTest다.리액트를 이용한 프로젝트에서 Cypress를 활용해 E2E 테스트를 진

react-native를 학습을 위해 몇가지 강의 자료들을 시청했다.역시나 모든 학문의 시작점은 지루한 이론...그래도 일단 드가자React Native는 Facebook에 의해 개발되고, 현재 오픈소스로 관리되는 크로스플랫폼 모바일 애플리케이션 개발 프레임워크이다.

프론트엔드 개발자를 꿈꾸며 매번 React를 사용하던 내가 특별한 기회을 얻었다.바로 NextJS와 NestJS를 활용한 웹 애플리케이션 프로젝트이다.예상하기에 앞으로는 NextJS와 NestJS 관련 글을 많이 작성할 것 같다.프론트만 하다가 백엔드까지 하려니까 처음

이번 프로젝트에서 서비스를 배포하는 업무를 맡았다.평소 큰 생각없이 Vercel을 이용한 프론트엔드 배포를 수행해 왔는데NestJS를 Vercel로 배포하는 경험을 했다.작은 이슈들이 있었고 이를 해결하는 과정에서 명확하게 알지 못했던 Serverless에 대해 이해하