tailwindcss (6) 썸네일형 리스트형 State of CSS 2026, 새 기능보다 브라우저 지원이 더 큰 변수예요 State of CSS 2026, 새 기능보다 브라우저 지원이 더 큰 변수예요State of CSS 2026 썸네일CSS에 새 기능이 빠르게 늘면서 개발자는 외부 도구를 추가하기 전에 브라우저 지원부터 따져야 해요. 4,902명이 참여한 State of CSS 2026에서는 Anchor Positioning이 가장 관심을 받은 새 기능으로 꼽혔어요. 실무 도입을 늦추는 이유로는 브라우저 호환성이 다시 앞에 나왔어요. 1핵심 요약구분조사 결과개발자가 확인할 점새 기능Anchor Positioning 사용률이 전년보다 15%포인트 늘었어요지원 대상 브라우저와 대체 레이아웃을 먼저 정해야 해요보편화된 기능`:has()` 83.7%, `aspect-ratio` 81.3%, CSS Nesting 70.6%가 사용.. AI가 만든 화면을 다시 묶는 코드 중심 디자인 시스템 AI가 만든 화면을 다시 묶는 코드 중심 디자인 시스템AI 뉴스 썸네일AI 코딩 도구로 화면을 빠르게 만들 수 있게 되면서 디자인 시스템의 역할도 달라지고 있어요. 여러 팀이 각자 만든 결과물을 하나의 제품처럼 정리하려면 검증된 컴포넌트와 토큰, 접근성 규칙을 기계가 읽을 수 있는 형태로 제공해야 해요. Figma의 제품 아키텍트 TJ Pietre는 디자인에서 코드로 넘기던 단방향 작업보다 코드와 캔버스를 오가는 흐름에 무게를 둬요. 1 2핵심 요약구분핵심왜 볼 만한가요작업 순서AI가 만든 제품에서 공통 코드를 추출한 뒤 캔버스로 되돌려 검토해요이미 구현된 사업 논리를 살리면서 제품 간 차이를 정리할 수 있어요품질 기준컴포넌트·토큰·문서·접근성 속성을 함께 제공해요AI가 비슷한 화면을 제각각 다시 만드는.. Topcoat, Rust 서버 코드로 브라우저 반응성까지 묶어요 Topcoat, Rust 서버 코드로 브라우저 반응성까지 묶어요AI 뉴스 썸네일Rust 웹 개발에서 서버 렌더링과 브라우저 상호작용을 한 프로젝트 안에 묶으려면 선택지가 많지 않았어요. Topcoat는 비동기 컴포넌트가 데이터베이스를 직접 읽고, 타입 검사를 거친 Rust 표현식 일부를 브라우저에서 다시 실행하는 방식으로 이 간격을 줄이려 해요. 별도 웹 API와 WebAssembly 번들 없이 어디까지 갈 수 있는지가 이 프로젝트의 관전 포인트예요. 1핵심 요약구분핵심왜 볼 만한가요렌더링모든 마크업을 서버에서 만들어요비동기 컴포넌트가 데이터베이스를 직접 조회할 수 있어요브라우저 반응성`$(...)` 안의 Rust 표현식을 JavaScript로 바꿔요WebAssembly와 별도 클라이언트 빌드 없이 즉각.. 버튼 하나로 돌아본 프론트엔드 20년 버튼 하나로 돌아본 프론트엔드 20년AI 뉴스 썸네일2008년 무렵 웹 개발을 떠났다가 지금 돌아오면 `` 하나를 만드는 과정부터 낯설 수 있어요. jQuery, React, TypeScript, Vite, 서버 렌더링, 코딩 에이전트까지 여러 층이 더해졌기 때문이에요. David Poblador의 글은 각 도구가 어떤 불편을 해결하려고 등장했고, 그 해결책이 어떤 새 비용을 만들었는지 한 개의 버튼을 따라가며 보여줘요. 1핵심 요약시기해결하려던 문제뒤따른 비용jQuery와 AJAX브라우저 차이를 줄이고 페이지 일부만 바꿨어요데이터와 DOM 상태를 개발자가 직접 맞춰야 했어요컴포넌트 프레임워크상태에 따라 화면을 선언적으로 그렸어요런타임과 프레임워크 학습 비용이 커졌어요번들러와 고속 툴링모듈, 구형 브라우.. LinkedIn 채용 과제에 숨은 악성코드, 개발자 컴퓨터를 노렸어요 LinkedIn 채용 과제에 숨은 악성코드, 개발자 컴퓨터를 노렸어요LinkedIn 채용 과제 악성코드 보안 썸네일LinkedIn에서 받은 코딩 과제를 실행했다가 개발 환경이 공격당한 사례가 공개됐어요. 겉보기에는 평범한 React와 Web3 프로젝트였지만, `tailwind.config.js` 안에는 원격 제어와 정보 탈취로 이어지는 난독화 코드가 숨어 있었어요. 낯선 저장소를 개인 컴퓨터에서 바로 실행하는 습관이 왜 위험한지 구체적으로 보여 주는 사례예요. 1핵심 요약구분핵심왜 볼 만한가요공격 경로LinkedIn 채용 제안 뒤 비공개 GitHub 과제를 전달했어요개발자가 평소 신뢰하는 채용 절차와 개발 도구를 함께 악용했어요은닉 방식30,987바이트짜리 `tailwind.config.js`의 공백 뒤.. GitHub 활동을 99점짜리 축구 선수 카드로 바꾸는 GitFut GitHub 활동을 99점짜리 축구 선수 카드로 바꾸는 GitFutGitFut GitHub 선수 카드 썸네일GitHub 프로필을 숫자와 잔디 그래프로만 보여주기 아쉬웠다면 GitFut을 써볼 만해요. 커밋과 스타, 코드 리뷰 같은 활동을 읽어 99점 만점의 축구 선수 카드로 바꿔 주는 오픈소스 도구예요. 1핵심 요약구분내용확인할 점결과물GitHub 활동을 축구 선수 능력치와 카드 등급으로 표현해요개발 실력을 객관적으로 증명하는 점수로 받아들이면 곤란해요평가 항목커밋, 저장소 스타, Pull Request, 팔로워, 사용 언어, 리뷰와 이슈 활동을 조합해요공개 프로필에서 읽을 수 있는 활동만 반영해요활용 방식이미지 URL을 README나 포트폴리오에 넣을 수 있어요GitHub 통계가 바뀌면 카드도 다시 계.. 이전 1 다음
