Feat postui : PDP 위주 디자인 수정, 게시물 공유 기능 추가 등

[hongregii]

• fontAwesome의 SVG 아이콘을 적용해 따봉, 붐따, 공유 버튼을 만들었어요.
• PDP 디자인은 chat 거 따라갔습니다!
• 하 디자인 뭔가 더 잘할수 있을것 같은데 디씨 클론이 된 것 같은..
• 공유 버튼 추가했습니다 - 클립보드에 현 주소 복사 기능이에요. useParams 사용했고 Clipboard API 사용했어요

이 블로그 참고했습니다. https://velog.io/@hayoung474/React-%EB%AC%B8%EC%9E%90%EC%97%B4-%ED%81%B4%EB%A6%BD%EB%B3%B4%EB%93%9C-%EB%B3%B5%EC%82%AC-%EA%B8%B0%EB%8A%A5-%EA%B5%AC%ED%98%84-copy-to-clipboard

• clipboard API 는 https://developer.mozilla.org/ko/docs/Web/API/Clipboard_API 이렇다고 하네요! 최신 브라우저 API인것 같습니다.

• PDP에서 로그인 안한채로 따봉/붐따/댓글달기 시, 모달 띄워주는 로직을 만들려고 했는데 이것도 chat 페이지에 있는거 따라하려다 보니까 로직이 생각보다 복잡하더라구요... 설명 들으면 제가 구현할 수 있을 것 같네요!

@ABizCho

[vercel[bot]]

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

Name	Status	Preview	Comments	Updated (UTC)
ganoverflow	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 17, 2023 4:50pm
ganoverflow-front	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 17, 2023 4:50pm

[ABizCho]

@hongregii 고생하셨어요! ! 코드에 개별적으로 리뷰남길 내용은 아닌 것 같아서 종합해서 코멘트하겠슴다

1. 클립보드는 저렇게 사용하는거였군요 좋습니다
2. 디자인은 차차 발전시켜도 좋을것같슴다
3. 아! 로그인 모달은 제가 이번 리팩터링 커밋에서 모달 좀 더 발전시키고 사용법도 표준화시켜뒀습니다! 다음 커밋에서 변경내용 확인하시고 그때 반영해주시면 될 것 같아용.

지금 간단하게 말씀드리면,

• isSigned라는 전역 리코일상태를 만들었습니다.
• isSigned가 unknown인 상태에서 로그인이 필요한 어떤 이벤트를 트리깅 할 경우, 세션스토리지의 userData를 참조하여 로그인상태를 판별하여 로그인되지 않았을 경우 isSigned를 F로 만드는 훅을 만들었고, 필요한 이벤트핸들러에서 훅을 통해 가져온 함수를 넣어주기만 하면 됩니다!
• isSigned가 F인 경우, 로그인모달을 조건부로 렌더링하도록 필요한 페이지에 삽입만 해두면 그 이후는 모두 잘 돌아가도록 해뒀습니다.

chat페이지 측 사용된 코드 참고해보면 사용측은 굉장히 간단해서 쉽게 사용하실 수 있을거에요! !

수고하셨습니다잉 머지할게요~!

[ABizCho]

92