Velopers

국내 IT 기업 기술 블로그 최신 글

필터 1
Next.js Server Action과 프론트엔드 보안
QueryPie
프론트엔드

Next.js Server Action과 프론트엔드 보안

Next.js Server Action의 동작 방식과 기본 보안 메커니즘을 설명했습니다. 편의성 뒤에 숨은 인증·인가, 입력 검증, SSRF 등 보안 책임을 강조했습니다.

#Next.js#React
1800
자료구조를 활용한 복잡한 프론트엔드 컴포넌트 제작하기
토스
프론트엔드

자료구조를 활용한 복잡한 프론트엔드 컴포넌트 제작하기

토스증권 PC의 그리드 레이아웃을 이진 트리 자료구조로 직접 구현한 사례를 소개했습니다. 복잡한 요구사항을 데이터 구조와 컴포넌트 분리로 해결하고 저장·복구까지 구현했습니다.

#React#자료구조
36100
SK플래닛
프론트엔드

[Syrup 디자인 시스템] 개발: UX에서 FE로의 효과적인 핸드오프

디자인 시스템을 통해 UX와 FE 간 Hand-off를 표준화하고 협업 효율을 높인 사례를 설명했습니다. Figma, Token, Storybook, NPM을 연결해 일관성과 재사용성을 강화하는 과정도 다뤘습니다.

#Design System#Storybook
3000
네이버 D2
프론트엔드

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

네이버 FE 엔지니어들이 2025년 3월 FE News에서 프론트엔드 주요 소식을 큐레이션해 소개했습니다. 웹 성능 최적화와 CRA 종료 등 생태계 변화를 함께 다뤘습니다.

#JavaScript#React
12700
Next.js에서 Sentry로 프론트엔드 에러 모니터링하기
포스타입
프론트엔드

Next.js에서 Sentry로 프론트엔드 에러 모니터링하기

Next.js에서 Sentry를 도입해 프론트엔드 에러 모니터링을 강화한 사례를 정리했습니다. 수집 범위와 알림 기준을 조정해 중요한 오류만 선별하고 디버깅 정보를 보완했습니다.

#Next.js#Sentry
8100
무엇이든 물어보세요 (feat. 테스트 코드, ESLint Rule) | EP.10 캠프파이어 특집 하편
토스
프론트엔드

무엇이든 물어보세요 (feat. 테스트 코드, ESLint Rule) | EP.10 캠프파이어 특집 하편

시청자 질문을 바탕으로 테스트 코드, ESLint Rule, useEffect dependency 배열에 대한 프론트엔드 실무 인사이트를 공유했습니다. 토스 개발자들의 코드 리뷰와 내부 패키지 활용 사례도 함께 소개했습니다.

#test#ESLint
7100
"딸깍"이면 끝! 피그마에서 바로 리액트 컴포넌트로 변환하기
라포랩스
프론트엔드

"딸깍"이면 끝! 피그마에서 바로 리액트 컴포넌트로 변환하기

피그마 디자인을 React 컴포넌트로 바로 변환하는 플러그인 구현 과정을 소개했습니다. 사내 규칙을 반영한 자동화로 수작업을 줄이고 생산성을 높인 사례입니다.

#Figma#React
2100
SPA 환경에서의 버전 업데이트를 위한 모두싸인의 최신 버전 업데이트 기능 구현기
모두싸인
프론트엔드

SPA 환경에서의 버전 업데이트를 위한 모두싸인의 최신 버전 업데이트 기능 구현기

SPA에서 구 버전 리소스가 계속 유지되는 문제를 해결하기 위해 최신 버전 업데이트 기능을 구현했습니다. version.json 폴링과 버전 비교로 강제·선택 업데이트를 분기하고 전환율까지 측정했습니다.

#React#Vite
6800
코파일럿 “열일”하게 만드는 방법
우아한 형제들
AI

코파일럿 “열일”하게 만드는 방법

깃허브 코파일럿의 기본 기능과 VSCode에서의 활용법을 정리했습니다. 컨텍스트를 충분히 주고 슬래시 명령어와 챗 변수를 쓰면 더 유용하게 사용할 수 있습니다.

#GitHub Copilot#VSCode
4600
네이버 D2
프론트엔드

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

25년 2월 프런트엔드 기술 소식을 큐레이션해 소개했습니다. CSS 지문 채취, AI 개발 워크플로우, 토스 가이드, 포털 대체 방법을 다뤘습니다.

#CSS#JavaScript
4600
Vite를 이용한 FrontEnd프로젝트
데보션
프론트엔드

Vite를 이용한 FrontEnd프로젝트

Vite는 React뿐 아니라 여러 프레임워크를 지원하며 빠른 프로젝트 생성과 실행을 강점으로 소개했습니다. CRA보다 가볍고 구조가 익숙해 프런트엔드 개발에 효율적으로 활용할 수 있다고 설명했습니다.

#Vite#React
7800
3단계로 완성하는 유연한 디자인 시스템
라인
프론트엔드

3단계로 완성하는 유연한 디자인 시스템

디자이너와 개발자의 리소스 관리를 일원화하기 위해 3단계 토큰 기반 디자인 시스템을 구축했습니다. Figma와 코드, Storybook을 연결해 테마 전환과 컴포넌트 커스터마이징을 유연하게 운영했습니다.

#design system#Figma
4100
퍼블리셔와 개발자 협업을 위한 스토리북 깨짐 방지 방안
데보션
프론트엔드

퍼블리셔와 개발자 협업을 위한 스토리북 깨짐 방지 방안

퍼블리셔와 개발자 협업에서 스토리북이 깨지는 원인을 분석하고 CIC 패턴으로 역할을 분리했습니다. 스토리북용 props와 실행 환경 분기를 정리해 무결성을 유지했습니다.

#React#Storybook
3200
시각장애인을 위해 모달 컴포넌트 접근성 개선하기
데보션
프론트엔드

시각장애인을 위해 모달 컴포넌트 접근성 개선하기

시각장애인의 웹 탐색 방식에 맞춰 모달 접근성을 개선하는 방법을 소개했습니다. aria 속성, ESC 닫기, 포커스 트랩으로 키보드 탐색 경험을 보완했습니다.

#React#UI/UX
4700