OnadWeb => next 변환

[GoMotiv]

기존 풀리퀘 내용

Next.js 적용한 메인페이지
관련 사항들은 노션에 업로드하였습니다.

Onad Main with Next.js

React-query 훅 중에 현재 생방송 중인 크리에이터 관련은 적용시키지 않았습니다.
페이지 요청 시 마다 데이터 페칭을 하도록 기본적으로 구성해놓았고 마운트 후에 요청해서 렌더링하는 것보다 초기 페이지 구축은 약간 느리나
전체 컨텐츠 확인하는데 불편함이 없기도 함이며 페이지 재입장 시에도 동일하였습니다.

---

2021.09.02.Thu 최신

1. client-ts => client-next에 최종 rewriting 완료(메인페이지, 마이페이지).
2. zustand, react-qeury 도입 사항들 최종 테스트 완료.
3. 현재 onadWeb production에서 버그나는 사항들(광고주 ID 및 비밀번호 찾기, 소셜 회원가입)
4. .env.local에 .env.development, .env.production 구별필요가 없는 공통사항이 모두 들어가있음.
   => .env.local 내일은 슬랙을 통해서 전달할 예정.

[hwasurr]

배포에 대한 준비가 필요합니다

1. 메인, 마이페이지로 서버가 두개로 나누어 지기 때문에, 도메인도 달라집니다.

   1-1. /mypage/... 로 이동시키는 링크, 히스토리 푸시 등의 경우 mypage 에 대한 호스트명을 명시해주어야 합니다.
   개발환경, 배포환경에서 모두 올바르게 작동하도록 하려면 환경변수로 작성해야 합니다.

   1-2. 기존 CRA 마이페이지에서 메인페이지로 이동시키는 링크, 히스토리 푸시등을 1-1에서와 같이 올바른 호스트명을 명시해주도록 변경해야 합니다.

   1-3. Next메인페이지를 main.onad.io 로 만들지, CRA기존 마이페이지를 mypage.onad.io 로 만들지 생각해보아야 합니다.
   -> 고려해야할 점은 검색엔진의 문제 + 만약에라도 메인페이지를 즐찾해두었다면, 없는 페이지로 이동 될 것이라는 점 정도
   -> Next메인페이지를 onad.io로, CRA마이페이지를 mypage.onad.io 로 만드는 것이 좋을 듯 합니다만, 위 1-1, 1-2 이외에도 어떤 버그가 생길 지 모르겠습니다.

   1-4. 소셜로그인 시, 소셜 로그인 성공 시, callback URL에서 리디렉트 시켜주는 페이지를 변경해야 합니다.

   1-5. 로그인 세션에 대한 접근이 양 페이지(메인,마이) 에서 공유되는 지, 확인해 보아야 합니다. 만약 되지 않는다면, 방법을 강구해야 합니다

   1-6. 기존 CRA 마이페이지에서, Next 메인페이지로 옮겨진 모든 페이지를 (관련 컴포넌트 및 유틸 등 모든 코드베이스) 제거해야 합니다. 그러지 않으면, 혼선 + 두가지 코드베이스를 관리해야 할 일이 생길 수 있습니다.

   이 모든 문제에 대한 고려 없이 돌아가는 앱을 만드는 가장 간단하게 생각해 낼 수 있는 방법은 모든 페이지를 nextjs로 옮기는 것입니다

2. 새롭게 추가된 환경변수(NEXT_ 로 시작하는)에 대해 정리해 주셔야 합니다.

   2-1. 배포환경에 따라, 필요 환경변수를 따로 입력해주어야 합니다.