[FE] 문의하기 페이지 구현 #772
Merged
[FE] 문의하기 페이지 구현 #772
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jinhokim98
approved these changes
Oct 22, 2024
Comment on lines
-18
to
+20
| {/* TODO: (@soha) 문의 페이지 링크로 꼭!! 추후 수정 */} | ||
| <Link to={'/'}>문의하기</Link> | ||
| <a href="https://forms.gle/qtGXJ8WdPsWA3KURA" target="_blank"> | ||
| 문의하기 | ||
| </a> |
There was a problem hiding this comment.
아쉽긴하지만 지금은 빠른 해결이 더 중요하니깐 좋은 선택인 것 같아요
There was a problem hiding this comment.
마자용.. 이게 중요한건 아니니까! 다음 배포로 미루던가 하는게 더 좋을 것 같아서 구글폼을 사용했어요!
There was a problem hiding this comment.
_blank 를 통해서 새 탭에서 열리게 한 디테일이 너무 좋네요!
보안상의 이유로 target="_blank"만 사용하면 외부 페이지가 window.opener를 통해 원래 페이지에 접근할 수 있는 위험이 있습니다. 이를 방지하기 위해 rel="noopener noreferrer" 속성을 추가하는 것이 좋습니다. 이렇게 하면 보안이 강화되고, 외부 페이지가 원래 페이지에 접근할 수 없게 됩니다.
지피티는 이런 의견을 남겼지만, 구글 링크가 우리의 페이지를 접근해서 뭐 할수 있는게 없을테니... 그냥 읽어보시라고 올려드려용~!~!
pakxe
approved these changes
Oct 22, 2024
Todari
approved these changes
Oct 23, 2024
Comment on lines
-18
to
+20
| {/* TODO: (@soha) 문의 페이지 링크로 꼭!! 추후 수정 */} | ||
| <Link to={'/'}>문의하기</Link> | ||
| <a href="https://forms.gle/qtGXJ8WdPsWA3KURA" target="_blank"> | ||
| 문의하기 | ||
| </a> |
There was a problem hiding this comment.
_blank 를 통해서 새 탭에서 열리게 한 디테일이 너무 좋네요!
보안상의 이유로 target="_blank"만 사용하면 외부 페이지가 window.opener를 통해 원래 페이지에 접근할 수 있는 위험이 있습니다. 이를 방지하기 위해 rel="noopener noreferrer" 속성을 추가하는 것이 좋습니다. 이렇게 하면 보안이 강화되고, 외부 페이지가 원래 페이지에 접근할 수 없게 됩니다.
지피티는 이런 의견을 남겼지만, 구글 링크가 우리의 페이지를 접근해서 뭐 할수 있는게 없을테니... 그냥 읽어보시라고 올려드려용~!~!
Merged
Todari
pushed a commit
that referenced
this pull request
Oct 23, 2024
* feat: 문의하기 구글 forms 페이지 링크 연결 * fix: chromatic 에러 해결
Todari
added a commit
that referenced
this pull request
Oct 24, 2024
* refactor: 랜딩 페이지 디렉토리 구조 변경 (#767) * refactor: 랜딩 페이지 디렉토리 구조 변경 * refactor: nav 관련 스타일 nav로 이동 * remove: 사용하지 않는 컴포넌트 제거 * style: div => section, article 태그로 변경 * style: 컴포넌트 이름 조금 더 의미있게 변경 * refactor: App을 제외한 페이지 컴포넌트 lazy loading * refactor: QueryClient가 필요하지 않은 랜딩 페이지에서 tanstack-query script 제거 * refactor: tree shaking을 deep하게 적용하기 위해 package.json에 sideEffects false 적용 * feat: prod build 파일에서 sourcemap과 license 파일 제거 * feat: 문의하기 페이지 구현 (#772) * feat: 문의하기 구글 forms 페이지 링크 연결 * fix: chromatic 에러 해결 * refactor 성능 개선 : Preconnect to requered origins (#771) * refactor: 성능개선 Preconnect to requered origins (font) * fix: storybook에서 pretendard 폰트가 적용되도록 스토리북 preview.tsx 수정 * refactor: 성능 개선 : 랜딩 페이지 이미지를 필요한 만큼만 불러오기 (#774) * feat: intersection api를 이용해서 특정 영역이 관측될 때 이미지 src를 채우는 hook 구현 * feat: useImageLazyLoading 훅 적용 * feat: 이미지 alt 값을 한국말로 변경 * fix: feature4,5 이미지를 4 불러올 때 한 번에 불러오는 방식으로 변경 * feat: threshold를 0.1에서 0.05로 조금 더 빨리 불러오도록 변경 * feat: alt 행댕이를 행댕이 - 행동대장 마스코트 라고 자세하게 설명 * feat: threshold default value 0.1 -> 0.05로 변경 * feat: 0.1 -> 0.05 놓친 부분 수정 * refactor: 성능 개선 : Kakao script를 필요한 곳에서 다운로드 받기 (#776) * feat: Kakao script 동적으로 불러올 수 있는 함수 작성 * feat: 드롭다운 버튼 베이스 onClick 메서드 추가 * feat: 모바일 환경에서 초대버튼 눌렀을 때 카카오 스크립트를 불러오도록 설정 * feat: KakaoInitializer 제거 * refactor: v2.1.1에서 구현한 랜딩페이지 개선 (#777) * feat: 랜딩페이지 개선 * fix: 첫 스크롤이 이상하게 되던 오류 수정 * design: image가 꽉차게 보이도록 변경 * move: CreatorSection 파일 위치 변경 * fix: IOS 환경에서 svg 렌더를 위해 object tag 로 변경 * fix: import 잘못된 오류 수정 * style: lint 적용 * fix: `useMainPageYScroll.ts`를 FeatureSection 내부에서 호출하도록 변경 * refactor: avatar style 분ㄹ * fix: avatar를 button이 아니라 a태그로 감싸도록 변경 * style: lint 적용 및 사용하지 않는 주석과 코드 제거 * refactor: Avatar 부분 리스트 렌더링으로 변경 * style: fix 적용 * fix: object tag에 alt property 제거 * fix: 이벤트 홈 페이지에 있을 땐 토큰이 있어도 지출 상세로 접근 불가하도록 수정 (#781) * fix: cypress에서는 sideEffects를 tree shaking하지 않음 * refactor: 성능 개선 : Serve images in next-gen formats (#784) * feat: 랜딩페이지 개선 * fix: 첫 스크롤이 이상하게 되던 오류 수정 * design: image가 꽉차게 보이도록 변경 * move: CreatorSection 파일 위치 변경 * fix: IOS 환경에서 svg 렌더를 위해 object tag 로 변경 * fix: import 잘못된 오류 수정 * style: lint 적용 * chore: webp포맷의 이미지 추가 * chore: webp타입 추가 * feat: 이미지 호스팅 경로를 생성하는 함수 구현 * feat: src, fallbackSrc를 지정해 대체 이미지를 보여줄 수 있는 Image 컴포넌트 구현 * feat: Image컴포넌트를 사용해 이미지를 불러오도록 수정 * feat: Avatar 컴포넌트에서 이미지 경량화를 위한 Image 컴포넌트를 사용 * chore: 사용하지 않고있는 토스 아이콘 제거 * feat: 용량 큰 이미지를 사용하는 곳에선 webp이미지를 사용하도록 수정 * feat: 이미지 경로를 받아오는 함수가 svg포맷도 받아들일 수 있도록 수정 * fix: 이미지 크기가 넘쳐버리지 않도록 width 속성 추가 * feat: 은행 목록 이미지를 webp로 이미지 호스팅 서버에서 가져오도록 수정 * chore: 사용하지 않는 이미지 제거 * feat: 흔듯콘을 webp로 불러오도록 함 * fix: 흔듯콘에 width부여 * design: 행동개시 행댕이의 크기가 너무 커지지 않도록 maxWidth 속성 추가 --------- Co-authored-by: 이태훈 <[email protected]> * feat: QR코드로 초대하기 기능 추가 (#783) * fix: DropDown에 Tap 글씨가 위에 있는 에러 수정 * feat: QR코드로 초대하기 페이지 디자인 구현 및 navigate 추가 * feat: qrcode.react 라이브러리를 활용하여 행사 접속 QR코드 생성 구현 * feat: 데스크탑 초대하기를 DropDown으로 변경하여 QR코드 초대 기능 추가하기 --------- Co-authored-by: Soyeon Choe <[email protected]> Co-authored-by: TaehunLee <[email protected]> Co-authored-by: Pakxe <[email protected]> Co-authored-by: 이태훈 <[email protected]>
Todari
added a commit
that referenced
this pull request
Oct 24, 2024
* refactor: 랜딩 페이지 디렉토리 구조 변경 (#767) * refactor: 랜딩 페이지 디렉토리 구조 변경 * refactor: nav 관련 스타일 nav로 이동 * remove: 사용하지 않는 컴포넌트 제거 * style: div => section, article 태그로 변경 * style: 컴포넌트 이름 조금 더 의미있게 변경 * refactor: App을 제외한 페이지 컴포넌트 lazy loading * refactor: QueryClient가 필요하지 않은 랜딩 페이지에서 tanstack-query script 제거 * refactor: tree shaking을 deep하게 적용하기 위해 package.json에 sideEffects false 적용 * feat: prod build 파일에서 sourcemap과 license 파일 제거 * feat: 문의하기 페이지 구현 (#772) * feat: 문의하기 구글 forms 페이지 링크 연결 * fix: chromatic 에러 해결 * refactor 성능 개선 : Preconnect to requered origins (#771) * refactor: 성능개선 Preconnect to requered origins (font) * fix: storybook에서 pretendard 폰트가 적용되도록 스토리북 preview.tsx 수정 * refactor: 성능 개선 : 랜딩 페이지 이미지를 필요한 만큼만 불러오기 (#774) * feat: intersection api를 이용해서 특정 영역이 관측될 때 이미지 src를 채우는 hook 구현 * feat: useImageLazyLoading 훅 적용 * feat: 이미지 alt 값을 한국말로 변경 * fix: feature4,5 이미지를 4 불러올 때 한 번에 불러오는 방식으로 변경 * feat: threshold를 0.1에서 0.05로 조금 더 빨리 불러오도록 변경 * feat: alt 행댕이를 행댕이 - 행동대장 마스코트 라고 자세하게 설명 * feat: threshold default value 0.1 -> 0.05로 변경 * feat: 0.1 -> 0.05 놓친 부분 수정 * refactor: 성능 개선 : Kakao script를 필요한 곳에서 다운로드 받기 (#776) * feat: Kakao script 동적으로 불러올 수 있는 함수 작성 * feat: 드롭다운 버튼 베이스 onClick 메서드 추가 * feat: 모바일 환경에서 초대버튼 눌렀을 때 카카오 스크립트를 불러오도록 설정 * feat: KakaoInitializer 제거 * refactor: v2.1.1에서 구현한 랜딩페이지 개선 (#777) * feat: 랜딩페이지 개선 * fix: 첫 스크롤이 이상하게 되던 오류 수정 * design: image가 꽉차게 보이도록 변경 * move: CreatorSection 파일 위치 변경 * fix: IOS 환경에서 svg 렌더를 위해 object tag 로 변경 * fix: import 잘못된 오류 수정 * style: lint 적용 * fix: `useMainPageYScroll.ts`를 FeatureSection 내부에서 호출하도록 변경 * refactor: avatar style 분ㄹ * fix: avatar를 button이 아니라 a태그로 감싸도록 변경 * style: lint 적용 및 사용하지 않는 주석과 코드 제거 * refactor: Avatar 부분 리스트 렌더링으로 변경 * style: fix 적용 * fix: object tag에 alt property 제거 * fix: 이벤트 홈 페이지에 있을 땐 토큰이 있어도 지출 상세로 접근 불가하도록 수정 (#781) * fix: cypress에서는 sideEffects를 tree shaking하지 않음 * refactor: 성능 개선 : Serve images in next-gen formats (#784) * feat: 랜딩페이지 개선 * fix: 첫 스크롤이 이상하게 되던 오류 수정 * design: image가 꽉차게 보이도록 변경 * move: CreatorSection 파일 위치 변경 * fix: IOS 환경에서 svg 렌더를 위해 object tag 로 변경 * fix: import 잘못된 오류 수정 * style: lint 적용 * chore: webp포맷의 이미지 추가 * chore: webp타입 추가 * feat: 이미지 호스팅 경로를 생성하는 함수 구현 * feat: src, fallbackSrc를 지정해 대체 이미지를 보여줄 수 있는 Image 컴포넌트 구현 * feat: Image컴포넌트를 사용해 이미지를 불러오도록 수정 * feat: Avatar 컴포넌트에서 이미지 경량화를 위한 Image 컴포넌트를 사용 * chore: 사용하지 않고있는 토스 아이콘 제거 * feat: 용량 큰 이미지를 사용하는 곳에선 webp이미지를 사용하도록 수정 * feat: 이미지 경로를 받아오는 함수가 svg포맷도 받아들일 수 있도록 수정 * fix: 이미지 크기가 넘쳐버리지 않도록 width 속성 추가 * feat: 은행 목록 이미지를 webp로 이미지 호스팅 서버에서 가져오도록 수정 * chore: 사용하지 않는 이미지 제거 * feat: 흔듯콘을 webp로 불러오도록 함 * fix: 흔듯콘에 width부여 * design: 행동개시 행댕이의 크기가 너무 커지지 않도록 maxWidth 속성 추가 --------- Co-authored-by: 이태훈 <[email protected]> * feat: QR코드로 초대하기 기능 추가 (#783) * fix: DropDown에 Tap 글씨가 위에 있는 에러 수정 * feat: QR코드로 초대하기 페이지 디자인 구현 및 navigate 추가 * feat: qrcode.react 라이브러리를 활용하여 행사 접속 QR코드 생성 구현 * feat: 데스크탑 초대하기를 DropDown으로 변경하여 QR코드 초대 기능 추가하기 --------- Co-authored-by: Soyeon Choe <[email protected]> Co-authored-by: TaehunLee <[email protected]> Co-authored-by: Pakxe <[email protected]> Co-authored-by: 이태훈 <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
issue
구현 사항
구현 목적
이전 배포에서 Footer를 구현했지만 문의하기를 클릭하면 랜딩페이지로 이동했습니다. 해당 링크를 랜딩페이지가 아닌 구글 Forms로 연결하도록 수정했습니다.
구현 방법
Link를 a 링크로 변경했습니다. 또한, target을 _blank하여 클릭했을 때 새 창을 열도록 합니다.
참고사항
기존에는 페이지를 제작하고 구글 스프레드 시트를 DB로 사용하고자 했습니다. 그러나 다음주 배포 전까지 끝내기에는 다른 더 중요한 task가 있다고 판단하여 추후에 진행하려고 미뤘습니다. 대신 구글 Forms를 활용했습니다.