DevFest 송도 2024 후기

송도에서 열린 Devfest 에서 들은 세션 후기를 작성했습니다.

합성 컴포넌트로 공통컴포넌트 개선하기

효율적인 공통컴포넌트 관리 방식을 위해 합성컴포넌트로 리팩토링 한 과정을 담았습니다.

MSW 로 일정 병목현상 해결하기

프론트엔드 개발에서 백엔드 API의 지연 문제를 해결하기 위해 API 모킹 도구로 MSW 를 설정한 이유와 도입 방법에 대해 작성했습니다.

큐샵에 서브모듈 적용하기

큐샵의 에디터와 라이브페이지의 공통 컴포넌트를 서브모듈화 한 방식에 대해 작성한 글입니다.

서브모듈을 선택한 이유

큐샵의 에디터와 라이브페이지의 공통 컴포넌트를 효율적으로 사용하는 법에 대해 고민하고 작성한 글입니다.

submodule → vercel 배포 이슈 해결하기

git submodule 구축 후 vercel 로 프로젝트 배포 시 발생한 이슈를 해결한 과정에 대해 작성했습니다.

고차함수를 사용하는 이유

TypeError: Cannot assign to read only property '0' of object '[object Array]

리코일사용 중 발생한 읽기전용 데이터에 대해 해결하는 과정과 깊은복사에 대해 작성했습니다.

만다라트로 목표 실천하기!

만다라트로 목표를 실천하려는 이유와 커스텀 만다라트 계획표 제작기

나만의 Github Readme.md 꾸미기

README.md 를 통해 나만의 커스터마이징한 github 를 만드는 방법에 대해 소개합니다.

디자인시스템 npm 배포(vite+tailwindcss)

테일윈드 기반의 디자인 시스템을 배포한 경험과 이슈에 대해 작성해 보았습니다.

리액트쿼리로 페이지네이션+무한스크롤 구현

리액트쿼리에서 제공하는 페이지네이션,무한스크롤이 가능한 훅에 대해 알아보았습니다.

Github action Module not found error

빌드 할때도 에러가 없었지만 막상 배포 후 에러가 발생하여 해당 원인을 추적하며 해결한 경험에 대해 작성 했습니다.

next/bundle-analyzer 로 성능 개선하기

next/bundle-analyzer 을 통해 ED 의 첫 화면의 성능을 개선한 방식과 경험에 대해 작성했습니다.

yarn berry 와 craco

프로젝트에서 npm 대신 yarn 을 선택한 이유와 리액트에서 yarn berry 로 프로젝트 설정하는 방법에 대해 작성햇습니다.

intersection observer

intersection observer 의 기본개념을 익히고 이를 통해 얻을 수 있는 성능적인 이점에 대해 작성했습니다.

Recoil

사내 프로젝트에 쓰인 contextAPI을 리코일로 변경하기 위해 공부한 내용을 작성했습니다.

Next.js 에서 PWA 를 통한 웹푸시 설정하기

next.js 에서 yarn 으로 서비스워커와 매니페이스트 설정하는 내용을 담았습니다.

Next.js 데이터 페칭과 라우팅 리마인드

Next.js 가 App router 로 변경되며 많은 부분들이 변경 되었습니다. 본격 앱라우터 공부 전 넥스트의 기본 개념을 한번 더 리마인드 하기 위해 정리 한 글입니다.

인증방식에 따른 전략

인증 작동방식부터 쿠키,세션,토큰 개념을 정리하며 성격에 따라 적절한 auth 전략에 대한 생각을 작성했습니다.

Three.js 텍스트 효과

three.js 로 텍스트에 3d 효과를 주는 방법에 대해 작성했습니다.

Three.js 큐브 애니메이션

Three js 기초

webGL 기반의 3D 구현을 편하게 만들어준 라이브러리, Three.js 기초 원리에 대해 정리했습니다.

Three.js card interaction

Next.js Auth

Next.js 에서 간단하고 확장 가능한 사용자 인증 구현 라이브러리인 next-auth 에 대해 알아보았습니다.

firebase CLI 로 배포하기

파이어베이스 cli 배포하며 겪은 과정과 이슈 해결에 대해 작성했습니다.

git 을 통한 코드리뷰, suggestion

동료들과 git 으로 코드리뷰 하는 방식에 대해 작성해 보았습니다.

인프콘 2023 후기

2023 인프콘에서 훌륭한 개발자 선배들의 세션을 들으며 받았던 영감과 좋았던 기억에 대해 작성 했습니다.

home brew - command not found 에러

-

useTransition

디바운스, 쓰로틀 훅 없이 리액트에서 자체 제공하는 훅에 대해 알아보았습니다.

2023 인프콘 당첨되다.

인프콘 당첨 후기를 작성해보았습니다.

스토리북 공통컴포넌트 배포 (emotion)

각 버전 및 라이브러리 별로, 스토리북 설치방법부터 배포방법까지 작성 했습니다.

Next.js Script 와 Image 컴포넌트

Next.js 에서 제공하는 컴포넌트 중 script 와 image 의 옵션들에 대해 알아보았습니다.

permission denied, mkdir - yarn install error

-

내가 편하려고 모아둔 정규표현식 모음zip.

자주 쓰이는 유용한 정규표현식 과 hook 들을 한데 모아 정리하였습니다.

Next.js - Hydrate, Dynamic Import

Next.js 에서 성능 최적화를 위한 하이드레이션 개념과 다이나믹 임포트에 대해 작성해 보았습니다.

Next.js - SSR&SSG&ISR 의 이해

웹의 역사를 돌아보며 CSR 부터 SSR 까지 더 세부적으로 정리해 보았습니다.

일렉트론의 기본개념 + 넥스트론 기존프로젝트에 적용하기

사내 토이프로젝트에서 사용한 넥스트론 (next.js + electron ) 구축과정을 담았습니다.

리액트쿼리와 캐싱

리액트쿼리에서 중요한 개념인 캐싱에 대해 자세히 알아보고 적절한 옵션 사용법에 대해 작성 했습니다.

웹폰트와 최적화

-

디바운스 & 쓰로틀링

debounce 와 throttling 의 개념을 정리하고, 이를통해 성능을 최적화 할 수 있는 방법에 대해 작성했습니다.

React에서 카카오맵 사용하기

리액트에서 비동기로 카카오 맵 로드하는 방법에 대해 작성 했습니다.

defer and async

script 의 동작원리와 defer, async 에 대해 공부한 글입니다.

Channel IO with Next.js

Next.js 를 사용하는 엔코스테이 사이트에 채널톡 연동하는 과정을 담았습니다.

git 공부 모음 zip

선임께 배운 git 기본 개념부터 회사 내 git 전략에 대해 정리한 글입니다.