Velopers
모든 태그
태그

Next.js 기술 블로그 글

Next.js 태그가 달린 국내 IT 기업 기술 블로그 글을 최신순으로 모았습니다.

전체 112개최신 20개 표시
홈에서 필터

관련 태그

#React238#SSR53#LLM995#TypeScript112#CSS48#Tailwind CSS8#web80#Claude Code49#모노레포17#TanStack Query9#Android198#Spring Boot179

최신 게시글

20개 표시

프론트엔드

Playwright E2E 테스트로 자가개선 루프 구축하기

AI가 코드를 더 빨리 만들수록 검증이 병목이 된다고 설명했습니다. Playwright E2E와 에이전트를 조합해 결정론적인 자가개선 테스트 루프를 구축하는 방법을 소개했습니다.

#Playwright#E2E 테스트#Next.js
2100

기타

아임웹의 새로운 기술블로그를 소개합니다.

아임웹이 기술 블로그를 새로 런칭하며 외부 플랫폼의 한계를 보완하고 자체 도메인 기반 구조를 만들었습니다. 또한 운영 설정, 작성 가이드, 외부 접점까지 함께 정비해 기술 조직의 포트폴리오로 삼았습니다.

#Next.js#Notion#GitHub Pages
200

AI

개발자 없이 5분 만에 버그를 고친 QA, 우리가 설계한 것과 설계하지 않은 것

AI 코딩 도구를 개인용에서 팀과 비개발자용으로 확장한 설계 과정을 다뤘습니다. Slack 기반 인터페이스와 품질 게이트로 QA와 기획자도 안전하게 작업하도록 만든 사례입니다.

#Claude Code#Slack#Jira
6600

프론트엔드

FE News 26년 5월 소식을 전해드립니다.

MDN 아키텍처 개편, React 접근성 점검, RSC 캐싱과 Cursor SDK 소식을 정리했습니다.\n웹 표준, 캐싱 경계, 코딩 에이전트의 제품 내 활용 흐름을 함께 살펴볼 수 있습니다.

#React#web#accessibility
14200

데브옵스

CMS 모노레포 개선기: 빌드 시간 단축부터 번들 최적화까지

모노레포 CMS의 빌드 파이프라인을 개선해 배포 시간을 14분에서 8분으로 줄였습니다. 병렬 빌드, 캐시 최적화, 안정성 보강과 번들 최적화까지 함께 다뤘습니다.

#Next.js#Spring Boot#모노레포
9700

기타

Gemini 3.1 Flash Live, Lyria 3 Pro 등 3월 넷째 주 Google for Developers 위클리 업데이트를 지금 확인하세요!

Google for Developers의 3월 넷째 주 주요 업데이트를 제품군별로 정리해 소개했습니다. 관심 분야의 최신 발표와 문서를 링크로 바로 확인할 수 있습니다.

#Gemini#Android#Google Cloud
000

아키텍처

멀티 프레임워크 디자인 시스템, 결국 운영 가능한 구조를 선택한 이유

React와 Vue를 함께 지원하던 디자인 시스템에서 운영 비용을 줄이기 위해 지원 범위를 재정의했습니다. React는 컴포넌트 운영축으로, Vue는 파운데이션 중심으로 전환한 사례입니다.

#React#Vue.js#Next.js
6500

프론트엔드

그때는 맞고 지금은 틀리다. Yarn Berry에서 pnpm으로 패키지 매니저 전환기

카카오페이가 Yarn Berry에서 pnpm으로 전환한 배경과 검증 과정을 공유했습니다. 메모리 스파이크를 해결하고 배포 효율과 도커 이미지 크기도 개선했습니다.

#pnpm#Yarn Berry#Next.js
16900

AI

AI와 협업을 통한 GitHub Spec Kit 을 활용한 명세 기반 개발(Spec-Driven Development, SDD) 프로세스 소개

GitHub Spec Kit 기반 SDD 프로세스를 소개하며 명세를 중심으로 AI와 협업하는 흐름을 정리했습니다. 4단계 워크플로우와 TDD·BDD 비교, 로그인 예시까지 함께 설명했습니다.

#Next.js#GitHub#LLM
11500

프론트엔드

FE News 26년 3월 소식을 전해드립니다!

FE 엔지니어들이 React 재단, CSS Day, Claude Code, TypeScript, Vinext 같은 프런트엔드 관련 소식을 소개했습니다.\nNext.js 대안과 성능 개선 사례를 포함한 월간 기술 큐레이션입니다.

#React#CSS#Claude Code
12400

프론트엔드

[디자인 시스템 어떻게 만들었어요?(3)] Tree Shaking과 구형 브라우저 대응

Next.js 환경에서 디자인 시스템 라이브러리의 번들 최적화와 구형 브라우저 대응 방법을 정리했습니다. 모듈 구조 유지, transpilePackages, 폴리필 전략을 통해 서비스 단의 호환성과 성능을 함께 개선했습니다.

#Next.js#React#Tree Shaking
8600

AI

AI 코딩 에이전트에게 사고 과정을 설계하다— /start부터 Agent Teams까지

AI 코딩 에이전트의 작업 방식을 사고 흐름과 규칙 체계로 설계한 사례를 정리한 글입니다. /start·/done, 페르소나, Agent Teams로 협업과 검증을 표준화했습니다.

#LLM#Cursor#Claude
5600

프론트엔드

쏘카 디자인 시스템 2.0 개발기 2편: 기술로 굴리기(웹)

쏘카 디자인 시스템 2.0 웹 개발에서 컴포넌트 구조, 패키지 전략, LLM 활용 방식을 정리했습니다. 상태 결합도에 따라 Hook과 객체를 분리하고, rollup과 Instructions 체계로 운영성을 높였습니다.

#React#Next.js#SSR
9400

AI

AI와 협업을 통한 GitHub Spec Kit 을 활용한 명세 기반 개발(Spec-Driven Development, SDD) 프로세스 소개

GitHub Spec Kit을 바탕으로 SDD의 4단계 흐름을 정리했습니다. 명세를 중심에 두어 AI 코딩의 불확실성을 줄이는 방법을 소개했습니다.

#Next.js#React#Tailwind CSS
9900

프론트엔드

FE News 26년 2월 소식을 전해드립니다!

FE 관련 주요 소식을 모아 소개한 큐레이션 글입니다. React 최적화, 합성 컴포넌트 패턴, jQuery 4.0.0 변경점을 함께 다뤘습니다.

#React#Next.js#jQuery
4400

프론트엔드

Next.js에서 QueryClient를 전역변수로 사용해도 될까요?

Next.js SSR에서 전역 QueryClient를 공유하면 요청 데이터가 누적되어 메모리 누수가 발생했습니다. 요청마다 QueryClient를 분리해 GC가 회수할 수 있도록 개선했습니다.

#Next.js#TanStack Query#SSR
15900

프론트엔드

styled-components에서 Tailwind CSS로 안전하게 대규모 마이그레이션하기

styled-components에서 Tailwind CSS로의 대규모 점진 마이그레이션 방법을 다뤘습니다. CSS Cascade Layers와 SSR/CSR 대응으로 스타일 충돌 없이 전환했습니다.

#Tailwind CSS#styled-components#CSS Cascade Layers
11800

프론트엔드

사용자가 페이지 로딩을 눈치채지 못하게 만들기 — RSC 도입 이야기

Next.js App Router에서 RSC와 TanStack Query prefetch를 결합해 이벤트 상세 페이지의 초기 로딩과 레이아웃 시프트를 개선했습니다. LCP는 약 38% 줄었고, 선택적 적용과 서버 부하 모니터링 전략도 함께 정리했습니다.

#Next.js#RSC#TanStack Query
3100

프론트엔드

텍스트 접근성을 개선했더니 거래액이 올랐습니다.

기기 글자 크기 설정을 반영해 텍스트 접근성을 개선한 사례를 소개했습니다. SSR, SSG, CSR 모두에서 FOUT를 줄이고 거래액과 탐색성 개선까지 확인했습니다.

#React Native#Next.js#CSS
4700

프론트엔드

AST로 Outdated 없는 퍼널 문서 만들기

AST로 퍼널 라우팅을 정적 분석해 문서를 자동 생성하고, 코드 변경 시에도 최신 상태를 유지하는 방법을 소개했습니다. 조건 분기와 훅 내부 이동까지 추출해 Mermaid 다이어그램으로 시각화했습니다.

#AST#TypeScript#Next.js
9700