- 내가 보려고 정리한 FrontEnd Tech Interview / 프론트엔드 기술 아티클 정리
PR은 언제나 환영입니다! 🎉
- 프론트엔드에서 흥미롭거나 읽을만한 아티클 및 공식문서, 영상 링크를 모아두는 장소
🍭 HTML
<script>
,<script async>
,<script defer>
사이의 차이점- 왜 일반적으로 CSS
<link>
태그를<head></head>
태그 사이에 위치시키고, JS<script>
태그를</body>
직전에 위치시키는 것이 좋은 방법인가요? - 점진적 렌더링(Progressive Rendering)이 무엇인가요?
- 이미지 태그에 srcset 속성을 사용하는 이유는 무엇인가요? 이 속성의 컨텐츠를 실행할 때 브라우저의 프로세스를 설명하세요.
- const와 var의 차이점은?
- 호이스팅이란
- 실행 컨텍스트
- this
- 클로저
- 스코프
- IIFE (Immediately-Invoked Function Expression, 즉시 실행 함수)
- 이벤트 버블링, 캡처링, 위임
- 콜 스택과 힙
- 프로토타입
- 자바스크립트의 비동기 작업 처리방식
- JavaScript와 관련하여 same-origin 정책을 설명하세요.
"use strict";
이 무엇인가요? 사용시 장단점이 무엇인가요?- 동기, 비동기 함수의 차이점을 설명하세요.
- 고차 함수(higher-order function)의 정의는 무엇인가요?
- 비동기 프로그래밍
- Chart.js vs D3.js
- 자바스크립트 가비지 컬렉션
- 타입과 인터페이스의 차이점
- 열거형(enum) 사용을 지양해야하는 이유
any
와unknown
의 차이
🍭 CSS
- Resetting과 Normalizing CSS의 차이점은 무엇인가요?
* { box-sizing: border-box; }
는 무엇을 하나요? 장점은 무엇인가요?
🍭 Network
- HTTP와 HTTPS의 차이점
- TCP와 UDP
- HTTP/1.1과 HTTP/2의 차이점
- GET과 POST의 차이는?
- REST API란?
- Cookie vs Session
- URL을 입력하고 벌어지는 일
🍭 React
- React Architecture 및 패턴과 관련된 아티클
- SWR 또는 React Query와 같은 라이브러리가 나타나게 된 배경 및 원인
- React 질문
- React 18 변경점
- 재조정(Reconciliation)
- When to
useMemo
anduseCallback
- React Strict Mode에서 렌더링이 두 번 되는 이유(함수가 두 번 호출되는 이유)
- Webpack이란 무엇인가?
- Babel vs Terser vs SWC
- 컴파일러 vs 트랜스파일러
- 프론트엔드 렌더링: SSG vs ISG vs SSR vs CSR
- Yarn Berry를 사용하는 이유
- Next.js의 작동 방식
- Vercel Edge Function
- Vercel Edge Middleware
- 모노레포란?
🍭 web
- CSR vs SSR
- 브라우저 렌더링 과정 (Critical Rendering Path)
- Reflow or Repaint(or ReDraw)과정 설명 및 최적화 방법
- CORS
- local storage vs session storage vs cookie
- XSS와 CSRF
- 프레임워크와 라이브러리의 차이점
- CORS는 왜 이렇게 우리를 힘들게 하는걸까?
- 브라우저의 동작 원리
- Core Web Vitals
- Lighthouse
- 함께 자라기
- 클린 애자일
- 클린 코드
- 실용주의 프로그래머
- 테스트 주도 개발로 배우는 객체 지향 설계와 실천
- 루비로 배우는 객체지향 디자인
- 테스트 주도 개발
- Front-end에서 추가적인 라이브러리를 사용하여 가독성있는 테스트를 작성해가는 과정을 정리