🎨
Frontend — 335개 용어
React·Next.js·CSS·성능 지표·빌드 도구
Zod👁 53
TypeScript 최초 우선 스키마 검증. React Hook Form·tRPC 파트너.
CSS Grid👁 52
2차원 CSS 레이아웃 시스템. 행·열 동시 제어로 복잡한 레이아웃 표현.
CSS Modules👁 52
컴포넌트별로 클래스명을 격리하는 CSS 시스템. 빌드 타임에 해시 접미.
Error Boundary👁 52
React의 에러 경계 컴포넌트. 하위 트리 에러를 잡아 fallback UI.
esbuild👁 52
Go로 작성된 극고속 JS 번들러. Vite dev pre-bundling·TS 컴파일에 쓰임. 100배 빠른 속도로 유명.
Font 최적화👁 52
Variable Font·subset·font-display·preload. FOIT·FOUT 제어.
localStorage vs sessionStorage👁 52
브라우저 키-값 저장소. 영속 vs 탭 한정.
MobX👁 52
반응형 프록시 기반 상태 관리. 자동 의존성 추적. 객체 지향 스타일.
not-found.tsx👁 52
404 페이지. notFound() 함수와 조합.
OffscreenCanvas👁 52
Canvas를 Web Worker에서 렌더. 메인 스레드 블록 없음.
React Compiler👁 52
수동 memoization 없이도 React 컴포넌트를 자동 최적화하는 컴파일러. useMemo·useCallback·memo가 필요 없어진다.
Solid.js👁 52
Fine-grained 반응성 JSX 프레임워크. React와 문법 유사하되 VDOM 없이 극단적 성능.
SolidJS 1.x👁 52
세밀 반응성 프레임워크. VDOM 없이 컴파일러 반응성.
SvelteKit Load👁 52
서버·클라이언트 데이터 로딩 함수.
TTI👁 52
Time to Interactive
페이지가 완전히 상호작용 가능해진 시점. 긴 작업이 사라진 후.
Vite + Rolldown👁 52
Vite 6+는 Rolldown을 번들러로 전환 중.
WebCodecs API👁 52
비디오·오디오 저수준 인코딩·디코딩. WebRTC·ML 전처리.
Conform (React)👁 51
Remix·React의 progressive enhancement 폼 라이브러리.
CSS Nesting👁 51
네이티브 CSS 중첩 문법. Sass 없이도 중첩 가능. 2023년 주요 브라우저 지원.
Cypress👁 51
개발자 친화 E2E 테스트. 브라우저 내부에서 실행. Playwright에 점유율 내주는 중.
E2E Test👁 51
End-to-End
실제 사용자 흐름을 브라우저에서 자동화해 검증하는 테스트. 가장 현실적, 가장 느림.
Intercepting Routes👁 51
Next.js 라우트 인터셉트. Instagram 스타일 모달 라우팅.
MutationObserver👁 51
DOM 변경을 비동기로 관찰하는 API. 서드파티 스크립트·동적 UI 감시.
Next.js👁 51
Vercel의 React 풀스택 프레임워크. SSR·SSG·App Router·PPR.
Next.js Dynamic IO👁 51
정적·동적 렌더링 경계를 데이터 fetch로 자동 판별.
Next.js Route Handlers👁 51
App Router의 API 엔드포인트. Web Request/Response 기반.
Paint / Composite👁 51
브라우저 렌더링의 마지막 단계. Paint는 픽셀 그리기, Composite는 레이어 합성.
React 19👁 51
2024년 정식 출시. Actions·use()·Compiler·Document Metadata.
React Forget👁 51
React Compiler의 프로젝트명. Facebook 내부 코드네임.
Rspack👁 51
ByteDance가 만든 Rust 기반 Webpack 호환 번들러. Webpack 설정 그대로 쓰며 10배+ 빠른 빌드.
Shadow DOM👁 51
DOM을 캡슐화하는 브라우저 표준. Web Components의 스타일·마크업 격리.
Starlight (Astro)👁 51
Astro 팀의 정적 문서 테마. 최소 설정으로 시작.
Stitches👁 51
디자인 토큰 중심 CSS-in-JS. Radix와 함께 인기였으나 2023년 중단.
TanStack Form👁 51
타입 안전 프레임워크 중립 폼 라이브러리.
TanStack Table👁 51
Headless 테이블 라이브러리. 정렬·필터·페이지네이션·가상화.
useCallback👁 51
함수 참조를 메모이제이션하는 훅. 자식 컴포넌트 리렌더 방지에 활용.
useMemo👁 51
비싼 계산 결과를 캐시하는 React 훅. deps 변경 시에만 재계산.
useOptimistic👁 51
React 19의 낙관적 업데이트 훅. 서버 응답 전 즉시 UI 반영.
useReducer👁 51
복잡한 상태 전이를 reducer 패턴으로 다루는 React 훅. useState의 강화판.
WebGL👁 51
브라우저에서 GPU 가속 3D 그래픽을 렌더링하는 API. Three.js가 대표.
Web Worker 호환성👁 51
Service Worker·Worker·SharedWorker·AudioWorklet. 용도별 선택.
Zustand Slices 패턴👁 51
큰 store를 여러 slice로 분할해 관리하는 Zustand 조직화 패턴.
Client Boundary👁 50
RSC에서 Server와 Client 컴포넌트 경계. 직렬화 가능한 값만 전달.
CLS 최적화👁 50
width/height 속성·aspect-ratio·font-display·skeleton.
CSS 새 단위👁 50
dvh·svh·lvh·dvw — 동적 뷰포트 단위. 모바일 주소창 변화 대응.
Logical Properties👁 50
margin-block·padding-inline 등 방향 독립 CSS 속성. RTL·세로쓰기 지원.
next/font👁 50
Next.js 폰트 최적화. Google Fonts·Local 자동 최적화.
Next.js 16 주요 기능👁 50
Turbopack 기본·Partial Prerendering 안정·React 19 통합.
Next.js App Router👁 50
Next.js 13+의 RSC 기반 라우팅. Pages Router 대체.
nuqs👁 50
Next.js 검색 파라미터를 타입 안전 상태로 관리하는 훅.