Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[FEATURE] 메인 페이지 구현 #4

Open
18 of 23 tasks
Jaharim opened this issue May 24, 2023 · 0 comments
Open
18 of 23 tasks

[FEATURE] 메인 페이지 구현 #4

Jaharim opened this issue May 24, 2023 · 0 comments
Assignees
@Jaharim
Labels
enhancement New feature or request style
Milestone
React-Commerce 기능...

Comments

@Jaharim
Copy link
Contributor

Jaharim commented May 24, 2023 •
edited
Loading

📑 이슈 내용

메인 페이지 구현

📝 작업 내용

  • GlobalStyle 적용하기 ( style-reset 사용 )
    • App 전체 감싸주기
  • styled-component 로 컴포넌트마다 스타일 적용하기
    • styled-component function 외부 아래쪽에서 선언하기 ( 코드 가독성 )
  • react-router-dom 적용해서 페이징하기
  • API로부터 products 불러오기

  • Header
    • input focus & blur 시에 form 테두리 및 돋보기 색상 변경
      • react 방식으로 바꾸기
  • Slider
    • 더미 이미지파일 추가하기
    • 슬라이드 기능 추가하기
      • 양 옆 버튼
        • 버튼 호버시 style 변화
        • 버튼 눌러서 슬라이드 넘기기 버튼 (양 끝에서 한 번 더 누를 경우 반대쪽 끝으로 가는 기능)
      • slider indicator
        • slide 개수에 따른 버튼동적생성 기능 추가하기
        • 버튼 클릭시 삼항연산자로 className 추가 & 제거 해주기
  • Main
    • product-desc : 말줄임표처리
    • product/?page=num -> 페이지네이션하기
  • Footer
  • scrollToTopBtn 컴포넌트 구현하기

📍ETC

기타사항
@Jaharim Jaharim added enhancement New feature or request style labels May 24, 2023
@Jaharim Jaharim self-assigned this May 24, 2023
Jaharim added a commit that referenced this issue May 24, 2023
@Jaharim
💄 style: GlobalStyle 적용 (#4)
6e95a7e 
- 'styled-components'와 'styled-reset'을 이용해 App 전체에 CSS reset 적용
@Jaharim Jaharim changed the title [ Feature ] 메인 페이지 구현 [FEATURE] 메인 페이지 구현 May 25, 2023
Jaharim added a commit that referenced this issue May 26, 2023
@Jaharim
💄 style : svg 파일 추가 및 수정 (#4)
2ab5cbb 
- search-blur.svg. shopping-cart-button.svg 파일 추가
- search.svg <path> 의 stroke 색상값 변경
Jaharim added a commit that referenced this issue May 26, 2023
@Jaharim
✨ feat: Header 컴포넌트 생성 (#4)
f8bc673
Jaharim added a commit that referenced this issue May 26, 2023
@Jaharim
✨ feat: Slider 컴포넌트 생성 (#4)
4bc4834
Jaharim added a commit that referenced this issue May 26, 2023
@Jaharim
✨ feat: Main 컴포넌트 생성 (#4)
72c7450
Jaharim added a commit that referenced this issue May 26, 2023
@Jaharim
✨ feat: Footer 컴포넌트 생성 (#4)
cf5c11e
Jaharim added a commit that referenced this issue May 26, 2023
@Jaharim
✨ feat: App.js에 Components import (#4)
08ba1bb
Jaharim added a commit that referenced this issue May 27, 2023
@Jaharim
💄 style : svg 파일 추가 (#4)
573b07a 
- product page swipe button - left, right
Jaharim added a commit that referenced this issue May 27, 2023
@Jaharim
Revert "💄 style: 데스크탑 웹 반응형 css 설정 (#4)"
9c0faa7 
This reverts commit 54a95ed.
Jaharim added a commit that referenced this issue May 27, 2023
@Jaharim
Revert "✨ feat: react-router-dom 적용 (#4)"
5fea019 
This reverts commit a415b67.
Jaharim added a commit that referenced this issue May 27, 2023
@Jaharim
Revert "Revert "✨ feat: react-router-dom 적용 (#4)""
c5afc16 
This reverts commit 5fea019.
Jaharim added a commit that referenced this issue May 27, 2023
@Jaharim
Revert "Revert "💄 style: 데스크탑 웹 반응형 css 설정 (#4)""
5c9f0e4 
This reverts commit 9c0faa7.
Jaharim added a commit that referenced this issue May 28, 2023
@Jaharim
💄 style : slider 더미 이미지 파일 추가 (#4)
b33ef73
Jaharim added a commit that referenced this issue May 28, 2023
@Jaharim
💄 style: styled-component 선언 위치 수정 (#4)
a0967fd 
- styled-component function 외부 아래쪽에서 선언하기
Jaharim added a commit that referenced this issue May 28, 2023
@Jaharim
♻️ Refactor: getProducts 함수 에러 대응 코드 추가 (#4)
b6667e1 
This reverts commit 3ccf3a4.
Jaharim added a commit that referenced this issue May 28, 2023
@Jaharim
♻️ Refactor: getProducts 함수 에러 대응 코드 추가 (#4)
7167c94 
This reverts commit b6667e1.
Jaharim added a commit that referenced this issue May 28, 2023
@Jaharim
♻️ Refactor: onFocus, onBlur 발생 시 함수 실행 코드 수정 (#4)
6d077c8 
This reverts commit e30ad50.
Jaharim added a commit that referenced this issue May 28, 2023
@Jaharim
Refactor: onFocus, onBlur 발생 시 함수 실행 코드 수정 (#4)
92d9597 
This reverts commit 6d077c8.
Jaharim added a commit that referenced this issue May 28, 2023
@Jaharim
♻️ Refactor: onFocus, onBlur 발생 시 함수 실행 코드 수정 (#4)
b3eda6d 
This reverts commit 6d077c8.
Jaharim added a commit that referenced this issue Jun 1, 2023
@Jaharim
✨ feat: indicator 클릭으로 Slider 이미지 전환 기능 추가 (#4)
0cc5b35
Jaharim added a commit that referenced this issue Jun 2, 2023
@Jaharim
✨feat: swiper-btn 클릭으로 Slider 이미지 전환 기능 추가 (#4)
b25a212
Jaharim added a commit that referenced this issue Jun 2, 2023
@Jaharim
💄style: swiper 버튼 hover 시 css style 변화 (#4)
4e3fb41
Jaharim added a commit that referenced this issue Jun 7, 2023
@Jaharim
💄style: button css GlobalStyle 추가 (#4)
47d9f55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@Jaharim Jaharim

Labels
enhancement New feature or request style
Projects
None yet
Milestone
React-Commerce 기능구현 스터디 1회차
Development

No branches or pull requests
1 participant
@Jaharim