본문 바로가기
🎨

Frontend 335개 용어

React·Next.js·CSS·성능 지표·빌드 도구

shadcn/ui Themes👁 64
Tailwind v4·CSS 변수 기반 테마. 다크모드·브랜드 토큰.
Container Style Queries👁 63
부모 컨테이너의 속성 값에 따라 자식 스타일 분기.
IntersectionObserver👁 63
요소의 뷰포트 진입 여부를 효율적으로 감지하는 브라우저 API. 지연 로딩·무한 스크롤.
Headless UI👁 62
Tailwind 팀의 headless 컴포넌트 라이브러리. React·Vue 지원.
SWC vs Babel👁 62
JS/TS 트랜스파일러 선택.
Tailwind CSS👁 62
유틸리티 클래스 기반 CSS 프레임워크. <code>flex p-4 text-lg</code>처럼 클래스 조합만으로 스타일링.
JSX👁 60
JavaScript 안에 HTML 같은 문법. React의 핵심. Babel·SWC가 트랜스파일.
Lazy Loading👁 58
지연 로딩
필요한 시점까지 리소스 로딩을 미루는 기법. 이미지·컴포넌트·라우트에 모두 적용.
Radix UI👁 58
접근성 완벽 headless 컴포넌트. 스타일 자유, 동작만 제공.
Tree Shaking👁 58
사용되지 않는 코드를 번들에서 자동 제거하는 최적화. ES Module의 static 분석 덕에 가능.
Yup👁 58
JavaScript 스키마 검증 라이브러리. Zod 이전 주류. Formik과 자주 조합.
Remix / React Router v7👁 57
웹 표준 중심 React 프레임워크. 2024년 React Router와 통합.
Render Tree👁 57
브라우저가 DOM과 CSSOM을 결합해 만드는 실제 렌더링용 트리.
Tauri v2👁 57
Rust 기반 데스크톱·모바일 앱 프레임워크. Electron 대안.
axios👁 56
Node·브라우저용 HTTP 클라이언트. fetch 이전 표준. 인터셉터·변환 기능 풍부.
Jotai👁 56
Atom 기반 React 상태 관리. 작은 원자 상태들을 조합. Recoil의 단순화 버전.
React Hook Form👁 56
비제어(uncontrolled) 기반 고성능 React 폼 라이브러리. Zod·Yup 연동.
SWR vs React Query👁 56
서버 상태 라이브러리 비교. 기능 vs 간결함.
Zod👁 56
TypeScript 런타임 스키마 검증 라이브러리. 타입 자동 추론.
React👁 55
Meta가 만든 UI 라이브러리. 선언적 컴포넌트·단방향 데이터. 프런트엔드 1위.
React Actions👁 55
React 19의 비동기 작업 처리. form action·useActionState·useFormStatus.
React Fragment👁 55
여러 요소를 추가 DOM 노드 없이 묶는 React 기능. &lt;&gt;...&lt;/&gt;.
Tailwind vs CSS Modules👁 55
utility-first vs component-scoped CSS. 트레이드오프.
TSX👁 55
TypeScript + JSX. 타입 안전한 React 컴포넌트의 표준.
CLS👁 54
Cumulative Layout Shift
페이지 로드 중 예기치 않게 레이아웃이 밀리는 정도. 사용자 경험을 크게 해침. 0.1 이하 권장.
ESLint👁 54
JavaScript·TypeScript 정적 분석·린터. 코드 품질·버그 예방.
Loading UI👁 54
Next.js의 loading.tsx. 자동 Suspense.
Long Task👁 54
메인 스레드를 50ms 이상 점유한 작업. 반응성 저해의 원인.
Panda CSS👁 54
Zero-runtime CSS-in-JS. 디자인 토큰·타입 안전. Chakra UI 팀.
Polyfill👁 54
구버전 브라우저에 최신 API를 구현해 채워 넣는 코드.
reactive (Vue)👁 54
Vue 3 반응형 객체 생성. Proxy 기반.
tsup👁 54
esbuild 기반 TypeScript 라이브러리 번들러.
unbuild👁 54
Nuxt 팀의 라이브러리 번들러. Rollup·ESBuild 통합.
CSS light-dark()👁 53
다크모드를 간편 처리하는 CSS 함수. color-scheme 기반.
ky👁 53
fetch 기반 미니 HTTP 클라이언트. axios보다 훨씬 작고 현대적.
mdsvex👁 53
Svelte용 MDX. Svelte 컴포넌트를 Markdown에서.
MSW👁 53
Mock Service Worker
네트워크 레벨 API 모킹. Service Worker로 브라우저·Node 양쪽에서 동일 모의.
next/script👁 53
Next.js 스크립트 최적화. strategy로 로딩 타이밍 제어.
Nuxt👁 53
Vue 기반 풀스택 프레임워크. SSR·SSG·라우팅·모듈 생태계. Vue의 Next.js.
Redux👁 53
예측 가능한 상태 관리 라이브러리. Flux 패턴. 대규모 React 앱의 고전.
RSC 패턴👁 53
Server Component에서 Client로 props 전달·children prop 패턴.
Sass / SCSS👁 53
CSS 전처리기. 변수·중첩·믹스인·함수 제공. 대형 스타일시트 유지보수 향상.
Service Worker👁 53
브라우저 백그라운드에서 실행되는 JS. 네트워크 요청 가로채기, 오프라인 캐싱, 푸시 알림을 처리.
Sonner👁 53
세련된 React 토스트 라이브러리. shadcn/ui 기본 채택.
TanStack Query Devtools👁 53
서버 상태 캐시·쿼리를 시각화하는 브라우저 확장·컴포넌트.
tRPC + Next👁 53
Next.js App Router에서 tRPC 사용 패턴.
useTransition👁 53
React 18+의 동시성 훅. 무거운 상태 업데이트를 낮은 우선순위로 처리.
Vite Plugin👁 53
Vite 플러그인 시스템. Rollup 플러그인과 호환.
Web Worker👁 53
별도 스레드에서 JS를 실행하는 API. 메인 스레드 블록 없이 무거운 연산.
will-change👁 53
애니메이션 전 브라우저에 GPU 레이어 준비를 알리는 CSS 속성.