프론트엔드 기술 블로그 최신 글

NEW FEATURE

기술을 읽던 곳에서, 다음 기회를 만나세요.

채용 검색부터 관심사 기반 추천, 내 적합도까지.

필터 0
선택된 필터 없음
Typescript - Union Type, Intersection Type, Etc.
카카오엔터테인먼트FE
프론트엔드

Typescript - Union Type, Intersection Type, Etc.

타입스크립트의 구조적 타입 시스템과 유니언·인터섹션 타입의 집합적 의미를 설명했습니다. 타입 좁히기, 템플릿 리터럴 타입, 객체 리터럴의 초과 속성 검사도 다뤘습니다.

#TypeScript#Tagged Union
000
Typescript - Union Type, Intersection Type, Etc.
카카오엔터테인먼트FE
프론트엔드

Typescript - Union Type, Intersection Type, Etc.

타입스크립트의 구조적 타입 시스템과 유니온·인터섹션 타입의 기본 개념을 설명했습니다. 또한 태그드 유니온과 템플릿 리터럴 타입, 객체 리터럴의 엄격한 검사까지 함께 정리했습니다.

#TypeScript#union type
2200
리팩터링 가이드 - 좋은 코딩 습관을 기르자
비브로스
프론트엔드

리팩터링 가이드 - 좋은 코딩 습관을 기르자

리팩터링의 의미와 코드 악취, 적용 시점을 정리한 글입니다. 함수 추출부터 조건문 분해까지 기본 기법을 예시와 함께 소개했습니다.

#refactoring#Java
200
리팩터링 가이드 - 좋은 코딩 습관을 기르자
비브로스
프론트엔드

리팩터링 가이드 - 좋은 코딩 습관을 기르자

리팩터링을 기능은 그대로 두고 코드 구조를 개선하는 방법으로 정리했습니다. 함수 추출, 조건문 분해, 특이 케이스 추가 같은 기본 기법과 적용 흐름을 소개했습니다.

#refactoring#Java
2400
모두를 위한 접근성 이야기
카카오페이
프론트엔드

모두를 위한 접근성 이야기

카카오페이 UI 개발 경험을 바탕으로 접근성을 지켜야 하는 이유와 쉽게 준수하는 방법을 공유합니다. 개발자가 실무에서 접근성을 적용할 때의 관점을 간단히 정리했습니다.

#UI/UX#접근성
1800
React의 Error Boundary를 이용하여 효과적으로 에러 처리하기
카카오엔터테인먼트FE
프론트엔드

React의 Error Boundary를 이용하여 효과적으로 에러 처리하기

Fetcher가 API 오류를 throw하고 지역·전역 Error Boundary가 이를 계층적으로 처리하는 방식을 소개했습니다. 오류 영역별 폴백 UI와 재시도 기능으로 나머지 콘텐츠를 유지하는 사용자 경험을 구현했습니다.

#React#error boundary
200
이제부터 이 컴포넌트는 제 겁니다
카카오엔터테인먼트FE
프론트엔드

이제부터 이 컴포넌트는 제 겁니다

리액트에서 렌더링과 상태 제어를 외부로 넘기는 IoC 패턴들을 정리했습니다. Render Props, 합성 컴포넌트, Controlled Props의 특징과 장단점을 비교했습니다.

#React#IoC
1800
React의 Error Boundary를 이용하여 효과적으로 에러 처리하기
카카오엔터테인먼트FE
프론트엔드

React의 Error Boundary를 이용하여 효과적으로 에러 처리하기

React Error Boundary로 렌더링 에러와 API 에러를 선언적으로 처리하는 구조를 소개했습니다. 제한된 범위의 ApiErrorBoundary와 전역 GlobalErrorBoundary로 재시도 UX까지 구성했습니다.

#React#error boundary
5000
안드로이드 멀티모듈 도입기 - 온보딩 프로젝트를 통한 안드로이드 멀티모듈 도입기
카카오헤어샵
프론트엔드

안드로이드 멀티모듈 도입기 - 온보딩 프로젝트를 통한 안드로이드 멀티모듈 도입기

안드로이드 온보딩 프로젝트에서 멀티모듈을 처음 도입한 경험을 다뤘습니다. 기존 단일 모듈 개발에서 구조를 바꾼 배경을 소개했습니다.

#Android#module
3600
LiveData에서 Flow로 변형해보기 - LiveData -> Flow(StateFlow & SharedFlow)
카카오헤어샵
프론트엔드

LiveData에서 Flow로 변형해보기 - LiveData -> Flow(StateFlow & SharedFlow)

Android에서 기존 LiveData를 Flow 계열로 옮겨 적용한 경험을 소개하는 글입니다. StateFlow와 SharedFlow를 설명하기 위해 먼저 LiveData의 개념을 정리합니다.

#Android#Kotlin
3800
유연하게 프로젝트별 개발환경 자동 설정하기(nvm) - nvm deeper shell integration 활용
카카오헤어샵
프론트엔드

유연하게 프로젝트별 개발환경 자동 설정하기(nvm) - nvm deeper shell integration 활용

여러 프론트엔드 프로젝트의 Node.js 버전 차이로 개발환경 관리가 필요한 상황을 다뤘습니다. nvm deeper shell integration으로 프로젝트별 환경을 자동 설정하는 방법을 소개했습니다.

#node.js
1600
React 컴포넌트와 추상화
카카오엔터테인먼트FE
프론트엔드

React 컴포넌트와 추상화

React 컴포넌트의 책임을 범용 UI와 도메인 로직으로 나누는 추상화 방법을 설명했습니다. 합성·커스텀 훅·상태 설계로 결합도를 낮추는 트레이드오프를 다뤘습니다.

#React#컴포넌트
100
React 컴포넌트와 추상화
카카오엔터테인먼트FE
프론트엔드

React 컴포넌트와 추상화

React 컴포넌트를 책임과 도메인 의존성 기준으로 어떻게 추상화할지 설명한 글입니다. 범용 컴포넌트 분리와 합성, 훅 활용을 통해 유연한 구조를 제안했습니다.

#React#컴포넌트
5000
스마트 TV에서 콘텐츠를 새롭게 탐색하는 방법
watcha
프론트엔드

스마트 TV에서 콘텐츠를 새롭게 탐색하는 방법

스마트 TV에서 콘텐츠를 새롭게 탐색하도록 예고편 중심의 왓고리즘 기능을 설계하고 검증한 사례를 소개했습니다. 사용자 조사와 UT를 통해 발견 경험을 강화했고, 배포 후 도움 평가와 재생 지표 개선도 확인했습니다.

#UI/UX#추천
3000