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

NEW FEATURE

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

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

새로운 기술 블로그가 추가되었어요

필터 1
함수형 프로그래밍 (Functional Programming) 어떻게 적용할까?
비브로스
프론트엔드

함수형 프로그래밍 (Functional Programming) 어떻게 적용할까?

함수형 프로그래밍의 순수 함수·불변성·선언적 추상화·커링 개념을 설명했습니다. RxJS와 React Custom Hook 사례로 OOP와 FP를 상황에 맞게 혼용하는 방법을 소개합니다.

#JavaScript#함수형 프로그래밍
2500
Gatsby를 어떻게 적용할 수 있을까? (+ gatsby에 typescript 적용하기)
너드팩토리
프론트엔드

Gatsby를 어떻게 적용할 수 있을까? (+ gatsby에 typescript 적용하기)

Gatsby의 JAMstack 기반 사전 렌더링 구조와 React·SEO 측면의 선택 이유를 소개했습니다.\nJekyll 기술 블로그 마이그레이션 계획과 Gatsby에 TypeScript를 설정하는 과정을 정리했습니다.

#Gatsby#React
2300
Webpack Module Federation 도입 전에 알아야 할 것들
카카오엔터테인먼트FE
프론트엔드

Webpack Module Federation 도입 전에 알아야 할 것들

Webpack Module Federation의 원격 모듈 통합 원리와 핵심 용어를 설명했습니다. 독립 배포의 장점과 타입·환경별 경로 관리의 제약을 함께 짚었습니다.

#Webpack#Module Federation
000
Webpack Module Federation 도입 전에 알아야 할 것들
카카오엔터테인먼트FE
프론트엔드

Webpack Module Federation 도입 전에 알아야 할 것들

Webpack Module Federation의 원격 모듈 로딩 구조와 컨테이너 구성 요소를 설명했습니다. 독립 배포의 장점과 타입·환경별 경로 관리의 제약을 함께 짚었습니다.

#Webpack#Module Federation
2500
MSW 사용하여 테스트 코드 작성하기 with GraphQL, react-query
더핑크퐁컴퍼니
프론트엔드

MSW 사용하여 테스트 코드 작성하기 with GraphQL, react-query

MSW로 GraphQL·react-query 요청을 네트워크 수준에서 모킹하는 Jest 테스트 구성을 소개했습니다. 공통 렌더러와 핸들러로 응답별 UI를 검증하는 방법을 설명합니다.

#MSW#GraphQL
3200
GraphQL Interface 자동생성으로 빠르게 프론트엔드 개발하기
핏펫
프론트엔드

GraphQL Interface 자동생성으로 빠르게 프론트엔드 개발하기

GraphQL 스키마를 기반으로 Apollo Codegen에서 TypeScript 인터페이스를 자동 생성하는 방법을 소개했습니다. JSON 스키마를 분석해 프로젝트 요구에 맞는 생성 로직으로 확장하는 방향도 설명합니다.

#GraphQL#React
4500
스토리북 작성을 통해 얻게 되는 리팩토링 효과
카카오엔터테인먼트FE
프론트엔드

스토리북 작성을 통해 얻게 되는 리팩토링 효과

스토리북의 독립 렌더링 과정에서 컴포넌트의 책임 과다와 환경 의존성을 발견했습니다. 표현·데이터·레이아웃을 분리해 재사용성과 검증 가능성을 높였습니다.

#Storybook#React
000
스토리북 작성을 통해 얻게 되는 리팩토링 효과
카카오엔터테인먼트FE
프론트엔드

스토리북 작성을 통해 얻게 되는 리팩토링 효과

스토리북의 독립 렌더링은 컴포넌트의 과도한 책임과 환경 의존성을 드러내 리팩토링을 유도합니다. 렌더링·데이터·레이아웃을 분리하고 입력 범위를 제한하는 방식을 소개합니다.

#storybook#React
3400
쿠팡 파트너스

광고

개발자를 위한 서적을 확인해 보세요

이 게시물은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

#개발서적#프로그래밍
React Hook Form의 isDirty와 dirtyFields를 알아보자
화해
프론트엔드

React Hook Form의 isDirty와 dirtyFields를 알아보자

React Hook Form의 isDirty와 dirtyFields가 서로 다르게 계산되는 구조를 설명했습니다. setValue 사용 시 shouldDirty 옵션이 상태 재계산에 미치는 영향을 정리했습니다.

#React#React Hook Form
000
Lighthouse CI를 알아보고 Github Actions에 적용하기
카카오엔터테인먼트FE
데브옵스

Lighthouse CI를 알아보고 Github Actions에 적용하기

Lighthouse CI를 GitHub Actions에 연동해 웹 성능 측정과 보고서 생성을 자동화했습니다.\n임계값 검증과 PR 댓글 지표 공유로 성능 저하를 병합 전에 확인합니다.

#Lighthouse CI#GitHub Actions
000
Lighthouse CI를 알아보고 Github Actions에 적용하기
카카오엔터테인먼트FE
데브옵스

Lighthouse CI를 알아보고 Github Actions에 적용하기

Lighthouse CI를 GitHub Actions에 연동해 웹 성능 측정과 보고서 생성을 자동화했습니다. 점수 기준으로 CI를 실패시키고 PR 댓글에 FCP·LCP 등 상세 지표를 표시했습니다.

#Lighthouse#GitHub Actions
2800
무조건 스켈레톤 화면을 보여주는게 사용자 경험에 도움이 될까요?
카카오페이
프론트엔드

무조건 스켈레톤 화면을 보여주는게 사용자 경험에 도움이 될까요?

짧은 API 응답에 스켈레톤을 무조건 노출하면 오히려 화면이 덜그럭거릴 수 있음을 설명했습니다. React Suspense와 성능 지표를 활용한 지연 노출 방식을 제안했습니다.

#React#Suspense
1000
리덕스 사가(Redux Saga)란 무엇인가?
트렌비
프론트엔드

리덕스 사가(Redux Saga)란 무엇인가?

Redux의 상태 관리 원칙과 미들웨어의 부수 효과 처리 방식을 설명했습니다. Redux Saga의 제너레이터·이펙트 기반 비동기 제어 API를 정리했습니다.

#React#Redux
2600
지금은 맞고 그때는 틀리다 (기술 블로그 개편 여정)
비브로스
프론트엔드

지금은 맞고 그때는 틀리다 (기술 블로그 개편 여정)

Jekyll 기반 기술 블로그의 기능·확장 한계를 분석하고 Docusaurus로 재구축했습니다. 태그, 목차, 다크 모드와 URL 리다이렉트 기반 마이그레이션을 적용했습니다.

#Docusaurus#Jekyll
2600