🎨
Frontend — 335개 용어
React·Next.js·CSS·성능 지표·빌드 도구
Vanilla Extract👁 49
TypeScript 기반 zero-runtime CSS-in-JS. 타입 안전 CSS.
View Transitions API👁 49
페이지·상태 전환 시 부드러운 애니메이션을 CSS로 구현하는 웹 표준. 브라우저가 이전/이후 상태를 자동 크로스페이드.
Visual Regression Testing👁 49
UI 변경을 스크린샷 비교로 검출하는 테스트. Chromatic·Percy·Playwright.
Vite 환경변수👁 49
import.meta.env. VITE_ 접두사 클라이언트 노출.
Vitest👁 49
Vite 기반 고속 테스트 러너. Jest 호환 API, ESM 네이티브.
Vue 3.5 Reactivity👁 49
반응성 시스템 대규모 리팩터. 메모리·속도 개선.
Waku👁 49
RSC 학습용·제품용 미니멀 프레임워크. Daishi Kato.
Custom Elements👁 48
커스텀 HTML 태그 정의. 프레임워크 독립적 컴포넌트.
DaisyUI v5👁 48
Tailwind 기반 컴포넌트 라이브러리. 클래스 이름만으로.
Next Middleware Node Runtime👁 48
Next 16+ 미들웨어가 Node.js 런타임 선택 가능.
Open Props👁 48
디자인 토큰을 CSS 커스텀 속성으로 제공하는 라이브러리.
Parcel👁 48
Zero-config 번들러. Webpack 대안. V2에 Rust 기반 최적화.
Playwright Component Testing👁 48
React·Vue·Svelte 컴포넌트를 Playwright에서.
PostCSS👁 48
CSS를 AST로 변환하는 플러그인 기반 도구. Autoprefixer가 대표.
PPR👁 48
Partial Prerendering
Next.js가 도입한 렌더링 전략. 정적 shell을 먼저 보내고 동적 부분을 스트리밍으로 채움. SSG와 SSR의 장점 결합.
Prefetch / Preload👁 48
rel=preload (즉시·중요), rel=prefetch (다음 페이지용).
React Compiler Auto-Memo👁 48
useMemo·useCallback·React.memo를 컴파일러가 자동 삽입.
Remix Loader👁 48
Remix의 라우트별 데이터 페칭 함수. 서버에서 실행.
Rspack / Rsbuild👁 48
ByteDance의 Rust Webpack 호환 번들러·상위 도구.
RUM👁 48
Real User Monitoring
실사용자 브라우저에서 성능·에러 측정. Sentry·Datadog·Vercel Speed Insights.
SameSite 쿠키👁 48
Cross-site 요청 시 쿠키 전송 제어. CSRF 방어 핵심.
Scroll-Driven Animations👁 48
scroll·view-timeline으로 스크롤 기반 애니메이션을 CSS만으로.
subgrid👁 48
자식 그리드가 부모 그리드의 트랙을 상속하는 Grid 고급 기능.
Svelte 5 Runes👁 48
$state·$derived·$effect. Svelte의 차세대 반응성 API.
tailwindcss-animate👁 48
shadcn/ui가 사용하는 Tailwind 애니메이션 플러그인.
TanStack Virtual👁 48
수만 행도 부드럽게 렌더링하는 가상 스크롤 라이브러리.
use() 훅👁 48
React 19의 Promise·Context 언래핑. Suspense와 통합.
useFormStatus👁 48
React 19 폼 상태 훅. pending·method·data를 자식 컴포넌트에서 조회.
useRef👁 48
DOM 참조나 렌더와 무관한 가변값을 담는 React 훅.
Vite👁 48
Evan You(Vue 창시자)가 만든 차세대 프런트엔드 빌드 도구. Dev 서버는 esbuild + 브라우저 ESM으로 즉시 시작.
Vue Vapor Mode👁 48
Vue 3.6+의 VDOM-less 모드. SolidJS 스타일 컴파일 타임 반응성.
Zustand👁 48
미니멀 React 상태 관리 라이브러리. Redux의 복잡함 없이 훅 하나로.
clamp()👁 47
값을 최소·선호·최대로 조합하는 CSS 함수. 반응형 타이포에 필수.
Cross-Document View Transitions👁 47
MPA 페이지 전환을 같은 앱처럼. Chrome 126+.
CSP (Frontend)👁 47
script-src·style-src·img-src 등으로 리소스 로드 출처 제한. XSS 방어.
CSS 단위👁 47
px·%·rem·em·vw·vh·vmin·vmax·ch·ex 등. 상황별 선택 기준.
Docusaurus 3👁 47
Meta의 정적 문서 사이트. v3는 MDX 3·React 18.
Grid 고급👁 47
grid-template-areas·minmax·auto-fit·auto-fill·subgrid.
@layer (CSS Cascade Layers)👁 47
CSS 우선순위를 명시적 레이어로 관리하는 기능. !important 남발 예방.
Lottie👁 47
Airbnb의 After Effects 애니메이션을 웹·모바일에 JSON으로 렌더링.
Next.js 캐싱 계층👁 47
Request Memoization·Data Cache·Full Route Cache·Router Cache.
Nextra👁 47
Next.js 기반 문서 사이트 생성기. MDX·검색.
NPM Package👁 47
npm 레지스트리에 배포되는 자바스크립트 패키지. package.json·main·exports.
Oxc👁 47
Rust 기반 JS 컴파일러 생태계. oxlint·oxc-resolver·oxc-transformer.
Oxc👁 47
Rust JavaScript 컴파일러 스위트. Parser·Linter·Minifier·Transformer.
Payload CMS👁 47
TypeScript Next.js 기반 오픈소스 CMS. 2024 v3.
Playwright👁 47
Microsoft의 브라우저 자동화·E2E 테스트. Chromium·Firefox·WebKit 모두 지원.
prefers-reduced-motion👁 47
사용자 모션 감소 선호 미디어 쿼리. 접근성 기본.
React Portal👁 47
컴포넌트를 DOM 트리의 다른 곳에 렌더. 모달·툴팁 구현.
Remix SPA Mode👁 47
Remix를 서버 없이 SPA로 배포. 정적 호스팅.