Skip to content

[feat] 검색 페이지 api 연결 전 뷰 생성#241

Open
hoeun0723 wants to merge 10 commits intodevelopfrom
feat/#238-searching_page
Open

[feat] 검색 페이지 api 연결 전 뷰 생성#241
hoeun0723 wants to merge 10 commits intodevelopfrom
feat/#238-searching_page

Conversation

@hoeun0723
Copy link
Copy Markdown
Member

@hoeun0723 hoeun0723 commented Sep 9, 2024

Related Issue 🍫

Summary 🍪

  • 검색 component 생성
  • diary feeling 별 버튼 생성 (버튼 누를시 api 호출 코드 작성 완료)
  • 최근 검색 정보 리스트 component 생성 (추후 api 연결 하면서 delete method 구현 필요)
  • 검색 정보 기반 일기 list component 생성 (추후 api 연결 하면서 query 사용하여 list 실시간 업데이트 필요)
  • component 를 page 내부에서 위치 조절

Before i request PR review 🍰

  • 아직 스타일도 그렇고, api 연결 코드적인 부분이 부족한게 많습니다. api 연결 작업하면서 자잘한 부분들 다 고쳐서 완벽하게 이행되도록 하겠습니다. 뷰 코드 작업이 오늘까지 목표였어서 미리 pr 올려둡니다 ! 혹시나 추후 작업에 충돌 사항이 있을까 하여 해당 부분 확인 완료 되면 merge 하면 좋을 거 같습니다 !

View

bandicam.2024-09-09.18-37-58-031.mp4

P1su and others added 10 commits August 26, 2024 00:50
* refactor: 폰트 default 설정

* fix: default 폰트를 theme에 설정

* fix: globalstyle에도 font default 추가

* fix: 허니어리란? black으로 색상 변동

* fix: 모바일 숫자가 폰트 적용 안되는 이슈로 default 폰트 코드 삭제

* fix: 일기 수정하기 삭제하기 폰트 사이즈 줄이기

* fix: 다양한 브라우저마다 폰트가 다르게 보여지는 것 때문에 padding을 없애고, width 값을 고정하여 width 100%로 맞추기

* fix: og tag 이미지 이슈 해결

* fix: globalstyle에 font 다 없애기

* fix: theme 에서 default fonts 재 삭제

* [refactor]날씨 주석 해제 (#212)

* refactor: 감정 여부 조건문 수정

* refactor: 날씨 주석 해제

* [refactor] 느린 일기 페이지 리팩토링 (#218)

* style: style 파일 들여쓰기 수정

* style: 배경색 theme 활용하여 적용

* style: 공통된 부분을 공통 style 속성으로 관리

* style: theme font 속성으로 lettering-space 추가

* style: 주석 삭제 및 format date 변수명 변경

* refactor: 제목과 내용 blob 변환 삭제

* refactor: 파싱 함수 삭제

* refactor: api request 값을 위한  formdata 코드를 post와 patch 조건문 밖으로 빼내어 코드 간결화

* style: 세미콜론 및 들여쓰기 수정

* style: 들여쓰기 수정

* style: export문을 마지막에 작성

* refactor: useFileReader import문 수정

* refactor: DiaryForm 폴더 및 파일 생성후 Form 관리 컴포넌트 분리

* [feat] 로그인 안 하고 url 이동 방지 (#222)

* feat: fallback UI 설정 및 router 적용

* fix: FallbackUI style 코드 작성

* feat: login error 페이지에 카카오 로그인 버튼 추가

* feat: serverInstance와 aiInstance에 interceptor를 걸어서 로그인 안 하고 접근하는 것을 방지

* style: 함수 선언식으로 수정

* style: login error 와 fallbackIUI 수정 및 mypage memberId 삭제

* fix: 버튼 클릭 시 이동 기능 수정

---------

Co-authored-by: Wang HoEun <hoeunwang@gmail.com>

* feat: 송필수 사진 추가 후 꿀비들 이미지 폴더 생성

* style: 들여쓰기 공백 수정 및 이미지 설정

* Refactor/#223 onboarding funnel refactoring (#224)

* style: 온보딩 페이지 스타일 코드 수정

* style: 온보딩 페이지 필요없는 import문 삭제

* style: onboarding steps 스타일 코드, 들여쓰기, imort문 정리

* feat: 온보딩 이미지 파일을 webp로 변경

* feat: 다음 단계로 이동하는 ButtonField를 하단으로 수정

* feat: step5 complete 버튼 props 넘기는 방식 수정 및 complete 버튼 이벤트 핸들러를 화살표 함수로 정의

* feat: step6 complete 버튼 props 넘기는 방식 수정

* style: OnBoardingHeader 컴포넌트 mixin을 flexCenter로 변경

* style: 필요없는 스타일 컴포넌트 삭제

* style: Next 버튼 코드를 가독성 좋게 수정

* feat: onboarding 페이지에서 onNext props 넘겨주는 방식 수정

* style: useFunnel의 Step과 Funnel 컴포넌트에서 props를 구조 분해 할당으로 작성

* style: StepProgress 가독성 있게 수정

* feat: useFunnel 에서 childStep에서 props 작성하는 방식 수정

* style: Next 버튼에 그림자 추가

* style: px값을 rem으로 수정

---------

Co-authored-by: Wang HoEun <hoeunwang@gmail.com>
Co-authored-by: Wang Hoeun <38005874+hoeun0723@users.noreply.github.com>
* refactor: 폰트 default 설정

* fix: default 폰트를 theme에 설정

* fix: globalstyle에도 font default 추가

* fix: 허니어리란? black으로 색상 변동

* fix: 모바일 숫자가 폰트 적용 안되는 이슈로 default 폰트 코드 삭제

* fix: 일기 수정하기 삭제하기 폰트 사이즈 줄이기

* fix: 다양한 브라우저마다 폰트가 다르게 보여지는 것 때문에 padding을 없애고, width 값을 고정하여 width 100%로 맞추기

* fix: og tag 이미지 이슈 해결

* fix: globalstyle에 font 다 없애기

* fix: theme 에서 default fonts 재 삭제

* [refactor]날씨 주석 해제 (#212)

* refactor: 감정 여부 조건문 수정

* refactor: 날씨 주석 해제

* [refactor] 느린 일기 페이지 리팩토링 (#218)

* style: style 파일 들여쓰기 수정

* style: 배경색 theme 활용하여 적용

* style: 공통된 부분을 공통 style 속성으로 관리

* style: theme font 속성으로 lettering-space 추가

* style: 주석 삭제 및 format date 변수명 변경

* refactor: 제목과 내용 blob 변환 삭제

* refactor: 파싱 함수 삭제

* refactor: api request 값을 위한  formdata 코드를 post와 patch 조건문 밖으로 빼내어 코드 간결화

* style: 세미콜론 및 들여쓰기 수정

* style: 들여쓰기 수정

* style: export문을 마지막에 작성

* refactor: useFileReader import문 수정

* refactor: DiaryForm 폴더 및 파일 생성후 Form 관리 컴포넌트 분리

* [feat] 로그인 안 하고 url 이동 방지 (#222)

* feat: fallback UI 설정 및 router 적용

* fix: FallbackUI style 코드 작성

* feat: login error 페이지에 카카오 로그인 버튼 추가

* feat: serverInstance와 aiInstance에 interceptor를 걸어서 로그인 안 하고 접근하는 것을 방지

* style: 함수 선언식으로 수정

* style: login error 와 fallbackIUI 수정 및 mypage memberId 삭제

* fix: 버튼 클릭 시 이동 기능 수정

---------

Co-authored-by: Wang HoEun <hoeunwang@gmail.com>

* feat: 송필수 사진 추가 후 꿀비들 이미지 폴더 생성

* style: 들여쓰기 공백 수정 및 이미지 설정

* Refactor/#223 onboarding funnel refactoring (#224)

* style: 온보딩 페이지 스타일 코드 수정

* style: 온보딩 페이지 필요없는 import문 삭제

* style: onboarding steps 스타일 코드, 들여쓰기, imort문 정리

* feat: 온보딩 이미지 파일을 webp로 변경

* feat: 다음 단계로 이동하는 ButtonField를 하단으로 수정

* feat: step5 complete 버튼 props 넘기는 방식 수정 및 complete 버튼 이벤트 핸들러를 화살표 함수로 정의

* feat: step6 complete 버튼 props 넘기는 방식 수정

* style: OnBoardingHeader 컴포넌트 mixin을 flexCenter로 변경

* style: 필요없는 스타일 컴포넌트 삭제

* style: Next 버튼 코드를 가독성 좋게 수정

* feat: onboarding 페이지에서 onNext props 넘겨주는 방식 수정

* style: useFunnel의 Step과 Funnel 컴포넌트에서 props를 구조 분해 할당으로 작성

* style: StepProgress 가독성 있게 수정

* feat: useFunnel 에서 childStep에서 props 작성하는 방식 수정

* style: Next 버튼에 그림자 추가

* style: px값을 rem으로 수정

---------

Co-authored-by: Wang HoEun <hoeunwang@gmail.com>
Co-authored-by: Wang Hoeun <38005874+hoeun0723@users.noreply.github.com>
@hoeun0723 hoeun0723 requested review from P1su and funcsom September 9, 2024 09:34
@hoeun0723 hoeun0723 self-assigned this Sep 9, 2024
@hoeun0723 hoeun0723 linked an issue Sep 9, 2024 that may be closed by this pull request
2 tasks
@hoeun0723 hoeun0723 added the feat 기능 구현 관련 태그입니다. label Sep 9, 2024
@vercel
Copy link
Copy Markdown

vercel bot commented Sep 9, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
sanhak-client ✅ Ready (Inspect) Visit Preview 💬 Add feedback Sep 9, 2024 9:34am

Copy link
Copy Markdown
Member

@P1su P1su left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

제 PR 에도 남겨두었는데, 현재 main 화면에서 검색뷰로 넘어가는 이벤트 핸들러를 alert 함수로만 처리해두었습니다.
아마 나중에 merge 하시게 되는 사람이 해당 부분까지 처리해서 같이 merge 해두면 좋을 것 같습니다 !!
고생많으셨습니다 !!!

Comment on lines +3 to +14
export const CarouselWrapper = styled.div`
width: 100%;
display: flex;
overflow-x: scroll; /* 가로 스크롤을 활성화 */
scroll-snap-type: x mandatory; /* 스크롤 스냅을 적용하여 자연스러운 캐러셀 */
gap: 1.4rem;

&::-webkit-scrollbar {
display: none; /* 스크롤바 숨기기 */
}

`;
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

라이브러리 안 쓰고 캐러셀 구현하는 법 배워갑니다👍👍👍

Comment on lines +6 to +9
<S.Input
placeholder='검색할 키워드를 입력하세요.'
onMouseEnter={() => onHoverChange(true)}
onMouseLeave={() => onHoverChange(false)}/>
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

저도 다음부터 input 태그 다룰 일이 있다면 여러 이벤트들 사용해 봐야겠네요 !!

Copy link
Copy Markdown
Collaborator

@funcsom funcsom left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

수고 많으셨습니다!!
생판 새로운 뷰를 만들어야해서 그것대로 정말 고생 많으셨습니다!
LGTM!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feat 기능 구현 관련 태그입니다. 검색페이지

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[feat] 검색 페이지 뷰 제작

3 participants