프론트엔드 아티클

필터 0

선택된 필터 없음

React 상태 관리 라이브러리 비교: Zustand vs Recoil vs Jotai

· 2025년 10월 9일

프론트엔드

React 상태 관리 라이브러리 비교: Zustand vs Recoil vs Jotai

React 상태 관리 라이브러리로 Zustand, Recoil, Jotai를 비교했습니다. 프로젝트 규모와 상태 복잡도에 따라 적절한 도구를 선택하는 기준을 정리했습니다.

GraphQL 커스텀 디렉티브로 만드는 선언적 지연 로딩

SSR에서 개인화 필드 동기화와 중복 요청 문제를 GraphQL 커스텀 디렉티브로 해결한 사례를 소개했습니다.\n`@lazy`로 필요한 필드만 재조회해 네트워크 비용을 줄이고 개발자 경험을 개선했습니다.

#GraphQL#Apollo Client

65005분

· 2025년 10월 1일

프론트엔드

Cursor AI를 활용하여 Frontend 손쉽게 개발하기

Cursor AI로 Vue.js 프론트엔드를 빠르게 구성하고, 백엔드 API와 ECharts 차트·CloudWatch 모니터링을 연동하는 과정을 소개했습니다. 단순 작업은 효율적이지만 복잡한 기능은 반복 피드백과 디버깅이 필요했습니다.

레퍼런스 없는 광고센터 UX, 어떻게 풀었을까?

레퍼런스가 거의 없는 광고센터를 만들기 위해 영업 사원의 업무 루틴과 기존 운영 방식을 먼저 파악했습니다. 엑셀 기반 관리 구조를 힌트로 삼아 제휴점 단위의 주문·결제 흐름에 맞는 UX로 재설계했습니다.

Next.js App Router에서 prefetchQuery와 Suspense로 뚜루루뚜루 데이터 스트리밍하기

Next.js App Router에서 React Query v5.40.0과 Suspense로 데이터 로딩 전략을 비교했습니다. await 없는 prefetch와 점진적 렌더링으로 더 자연스러운 UX를 얻을 수 있음을 실험했습니다.

[Jetpack Compose — Part 2] Compose, 실전에서 빛을 발하다: 코드는 1/4로, 생산성은 4배로!

Jetpack Compose를 사내 서비스 UI에 적용한 실전 사례를 소개했습니다. 코드량과 파일 수를 줄이고, 디자인 시스템과 스크린샷 테스트로 생산성과 품질을 함께 높였습니다.

#Android#Jetpack Compose

76005분

"이 버튼 왜 안 눌려요?" 물류 현장의 목소리로 PDA 시스템 완성하기

· 2025년 9월 24일

프론트엔드

"이 버튼 왜 안 눌려요?" 물류 현장의 목소리로 PDA 시스템 완성하기

물류 현장 PDA의 제약을 웹과 PWA로 개선한 사례를 다뤘습니다. 스캐너 연동, 화면 최적화, 키패드 이슈 해결로 작업 효율을 높였습니다.

#PWA#웹

116005분

React Native에서 Kollus SDK 연동하기

· 2025년 9월 19일

프론트엔드

React Native에서 Kollus SDK 연동하기

React Native에서 Kollus SDK를 연동하기 위해 Android와 iOS 네이티브 브릿지 구성 방법을 정리했습니다. 또한 SDK 초기화와 영상 재생 URL 전달 흐름까지 단계별로 설명했습니다.

“보이지 않는 곳에서 만드는 차이, 플랫폼팀이 만드는 효율과 성장의 무대”

프론트엔드 플랫폼팀이 서비스 안정성, DX, 성능 개선을 위해 맡는 역할을 소개했습니다. 또한 Micro Frontends, 모니터링, CI/CD로 대규모 웹 서비스를 운영하는 방향을 설명했습니다.

#Micro Frontends#React

13005분

· 2025년 9월 15일

프론트엔드

모노레포 소개 및 도입기

모노레포와 멀티레포의 차이와 도입 사례를 비교하며, 프로젝트 특성에 맞는 구조 선택 기준을 정리했습니다. 또한 빌드 최적화와 초기 설정 자동화를 통해 개발 생산성을 높인 경험을 소개했습니다.

29CM 주문서 결제 혜택 UX 개편기:그래서 얼마에 살 수 있는 거에요?

주문서 결제 혜택을 더 직관적으로 보여주도록 UX와 상태 관리 구조를 개편했습니다. 그 결과 구매전환율과 혜택 사용 비중, 결제 속도가 함께 개선되었습니다.

하나의 프론트엔드 코드로 멀티 환경 운영하기

하나의 프론트엔드 코드베이스로 여러 환경을 운영하기 위해 분기 구조를 재설계했습니다. Route와 Component는 설정화·자동화하고, Logic은 단순 플래그로 유지해 생산성과 DX를 개선했습니다.

#AST#ESLint

222005분