🖼 프론트엔드 개발 (Front-End)

리액트 프로젝트를 하다 보면 팀원들이 내부 구현(Internal)에 직접 접근하는 경우가 많습니다. 예를 들어 bubbleSort.ts 같은 내부 구현에 의존하는 코드가 늘어나면, 리팩터링 시 모든 소비자 코드가 깨지고 유지보수가 어려워집니다.

JPEG, PNG, WebP, SVG — 언제 무엇을 써야 ‘진짜’ 빠르다원문 아이디어: Ibrahim Diallo, “What Learning React Won’t Teach You: Image Formats” (2025-07-28)

CSS는 이제 단순히 색상과 폰트만 조정하는 언어가 아니라, 레이아웃·모션·접근성까지 다루는 프론트엔드 핵심 툴킷이 되었습니다. 2025년 CSS 생태계 조사(State of CSS 2025)에서는 특히 몇 가지 문법이 “게임 체인저”로 꼽혔습니다.

import "./foo.json" with { type: "json" }에서 type: "json"처럼 type을 명시하는 건, 단순히 JSON이라는 정보를 붙이는 것이 아니라 해당 모듈이 어떤 포맷인지 명확히 선언하여 런타임이 "이건 코드가 아니라 데이터야"라는 식

Float16 지원은 JavaScript에서 메모리 효율성과 GPU 최적화를 위한 매우 실용적인 개선이고, 이전에는 불가능했던 저정밀도(float16) 표현이 가능해진다는 점에서 중요→ 16비트(2 bytes) float16은 존재하지 않았음.WebGL 같은 환경에서는

UTM 파라미터 구조 → 실무 트래킹 전략 → GA4 분석 → 자동 태깅 → 주의사항까지웹/앱 분석에서 가장 많이 쓰면서도 가장 많이 오해되는 기술이 UTM이다. 정확히 이해하면 트래픽 출처(어디에서 왔는지) → 행동(무엇을 했는지) → 전환(돈이 되었는지) 흐름

“누가 → 어디에 → 어떤 관계로 → 어떻게 측정하나”를 기준으로 정리한다.UTM은 링크를 “붙이는 사람”이 설정한다.측정은 반드시 “본인 사이트(목적지)”의 GA가 한다.

마이크로 프론트엔드 개념부터 Open Microfrontends 표준, 대기업 FE-MSA 현실과 채택 가능성, 실무에서 지금 무엇을 해야 할지까지 정리.

이제 프론트엔드는 UI가 아니라 AI 에이전트의 작업 공간이다. WebMCP, RSC, 메타데이터, DX까지 AI 시대를 전제로 한 FE 설계 원칙 정리.

Open Microfrontends 도입 시 FE 개발자가 맡게 될 계약 기반 통합 업무부터 Next.js App Router, TanStack Start, Valdi, Antigravity까지 아키텍처 변화를 한 번에 정리.

React Grab은 개발 중 화면에서 원하는 요소를 선택해 HTML·React 컴포넌트·소스 문맥을 즉시 복사해 Cursor·Claude Code·Copilot의 응답 속도를 평균 55%까지 높여준다. Next.js/Vite/Webpack에서 1분 만에 적용 가능.

브라우저 Document Picture-in-Picture API를 React에서 바로 사용. 기존 화면을 유지한 채 별도 PIP 창으로 UI를 분리해 채팅·미디어·도구 패널·모니터링 UI를 띄울 수 있다.

Microfrontends 로컬 프록시, Bun 패키지 매니저 안정화, 터미널 검색 기능 추가. 대규모 모노레포 개발환경을 한층 빠르고 단순하게 만드는 Turborepo 2.6 핵심 요약.

React Email 5.0 출시: 다크 모드 지원, Tailwind 4, Resend 템플릿 업로드, 8개 신규 컴포넌트 추가. 이메일 개발의 UX·DX 전반을 개선한 대규모 업데이트.

React 컴파일러는 빌드 타임에 React 컴포넌트·훅을 자동 메모이제이션해 리렌더 비용을 줄여주는 새 도구다. RC 단계이지만, React 17+ 앱·라이브러리에서 부분 도입·점진 적용이 가능하며, ESLint 플러그인과 함께 사용하는 것이 사실상 필수다.