안녕하세요, 이상혁입니다

profile
제 블로그에 오신 것을환영합니다!

기록들

  1. 프론트엔드 구조, 나만의 레이어드 레시피 🍰

    기존 프로젝트의 복잡한 구조를 개선하기 위해 백엔드의 계층화 패턴을 프론트엔드에 적용했는데, 프레젠테이션, 비즈니스, 퍼시스턴스, 데이터베이스 계층으로 나누되 프론트엔드 특성에 맞게 외부 API와 Web Storage를 데이터 계층으로 대체했습니다. 실제 구현 과정에서는 초기 설계의 80%만 이행되었고, 도메인별 분리보다는 페이지 경로 기준으로 비즈니스 로직을 관리하는 방식으로 전환했으며, FSD(Feature-Sliced Design) 방식을 참고하여 각 라우트별로 컴포넌트와 훅을 묶어 관리하는 구조로 발전시켰습니다.
    2025년 4월 13일
    프론트엔드 구조, 나만의 레이어드 레시피 🍰
  2. 무작정 적어보는 2024년 회고

    2024년 한 해 동안 다양한 변화와 도전을 겪으며 성장과 고민을 반복했다. 새로운 환경과 프로젝트, 연봉 협상 등에서 성취와 부담을 동시에 느꼈고, 감정적으로 흔들리는 순간도 많았다. 업무에 재미와 의미를 찾기 위해 노력했으며, 기본기와 자기계발의 중요성을 다시 깨달았다. 앞으로도 자신에게 투자하며 더 나은 성장을 다짐한다.
    2025년 1월 18일
    무작정 적어보는 2024년 회고
  3. React Query의 무한 스크롤

    무한 스크롤은 사용자가 페이지를 내릴 때마다 자동으로 데이터를 추가로 불러와 보여주는 UX 방식이다.Intersection Observer와 React Query의 useInfiniteQuery 훅을 활용하면 효율적으로 무한 스크롤을 구현할 수 있다. 핵심은 관찰 대상이 뷰포트에 들어오면 다음 페이지 데이터를 불러오고, 마지막 데이터까지 자연스럽게 이어주는 것이다.
    2023년 4월 17일
    React Query의 무한 스크롤
  4. 간단하게 사용해보는 React Query

    React에서 데이터 패칭과 상태 관리는 복잡해질 수 있는데, React Query를 사용하면 데이터 패칭, 캐싱, 동기화, 뮤테이션 등을 간편하게 처리할 수 있다. useQuery와 useMutation 훅을 활용하면 로딩, 에러, 최신 데이터 반영 등 다양한 요구사항을 쉽게 구현할 수 있으며, invalidateQueries, Optimistic Updates 등 고급 기능도 지원한다. 적절한 옵션 설정과 쿼리 키 관리로 효율적인 데이터 최신화와 캐싱이 가능해진다.
    2023년 2월 20일
    간단하게 사용해보는 React Query
  5. (AWS)VPC, EC2, ALB

    AWS에서 EC2 인스턴스를 사용하려면 VPC, 서브넷, 라우팅 테이블, 인터넷 게이트웨이 등 네트워크 환경을 먼저 구성해야 한다.EFS는 여러 인스턴스에서 공유 가능한 네트워크 파일 스토리지이며, Application Load Balancer는 트래픽을 여러 대상에 분산시켜 안정적인 서비스를 제공한다. 각 리소스의 보안 그룹, IP, 연결 설정 등 기본 개념과 실습 과정을 따라가면 AWS 인프라를 효과적으로 구축할 수 있다.
    2022년 6월 24일
    (AWS)VPC, EC2, ALB