Code & Beyond

  • 홈
  • 태그
  • 방명록

Refactoring 1

범용 Slider & Card 공통 컴포넌트 리팩토링으로 재사용성과 확장성 높이기

같이 진행하던 사이드 프로젝트를 리팩토링하던 중, 처음부터 눈에 띄는 컴포넌트가 하나 있었다. 바로 카드(Card)와 슬라이더(Slider) 컴포넌트였다. 프로젝트 안에는 앨범, 아티스트, 트랙을 각각 보여주는 카드 컴포넌트가 있었고, 이를 감싸는 슬라이더 컴포넌트 또한 각각 따로 구현돼 있었다. 즉, AlbumCard, ArtistCard, TrackCard... 그리고 AlbumSlider, ArtistSlider, TrackSlider처럼 중복된 컴포넌트가 줄줄이 이어져 있었다. 그렇지만 이 카드들은 사실 거의 동일한 구조를 가지고 있다.이미지가 있고타이틀과 서브타이틀이 있고클릭하면 다른 페이지로 이동하거나버튼 하나가 추가로 붙는 정도였다. 단지, 어떤 API를 받아오는지, 어디로 이동하는지, 버튼..

React 2025.06.09
이전
1
다음
더보기
프로필사진

Code & Beyond

  • 분류 전체보기 (14)
    • 경험 (0)
    • Review (0)
    • Cloud (2)
    • Algorithm (4)
    • Database (4)
    • React Native (1)
    • React (3)

Tag

데이터베이스, inordertraversal, DB, 분산저장관련이론, React, firebae rn 연동, leetcode, 리덕스대신, minimum depth of binary tree, 이진트리순회방식, 알고리즘, doit알고리즘코딩테스트자바편, saac03, 파티셔닝비교, 트랜잭션의속성, 94. binary tree inorder traversal, AWS, 분산저장기법, 구간합 java, cloud자격증,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2026/05   »
일 월 화 수 목 금 토
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31

방문자수Total

  • Today :
  • Yesterday :
github

  • github

티스토리툴바