Merge pull request #29 from whatever-mentoring/dev

merge: 배포

.env

@@ -0,0 +1,4 @@
+REACT_APP_NAVER_CLIENT_ID = 'mp0CQ1x6hXjAn1PDkrgT'
+REACT_APP_NAVER_CLIENT_SECRET= 'yZJwVrevKp'
+REACT_APP_NAVER_REDIRECT_URI = "http://localhost:3000/oauth"
+

package.json

@@ -15,17 +15,22 @@
         "@types/react-router-dom": "^5.3.3",
         "@types/react-slick": "^0.23.10",
         "@types/styled-components": "^5.1.26",
+        "add": "^2.0.6",
+        "axios": "^1.5.0",
         "polished": "^4.2.2",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
+        "react-intersection-observer": "^9.5.2",
         "react-router": "^6.16.0",
         "react-router-dom": "^6.16.0",
         "react-scripts": "5.0.1",
         "react-slick": "^0.29.0",
+        "recoil": "^0.7.7",
         "slick-carousel": "^1.8.1",
         "styled-components": "^6.0.7",
         "typescript": "^5.2.2",
-        "web-vitals": "^2.1.0"
+        "web-vitals": "^2.1.0",
+        "yarn": "^1.22.19"
     },
     "scripts": {
         "start": "craco start",

src/App.tsx

@@ -1,5 +1,4 @@
 import Main from 'pages/Main';
-import Answer from 'pages/Answer';
 import PostDetail from 'pages/Main/PostDetail';
 import Search from 'pages/Main/Search';
 import React from 'react';
@@ -12,32 +11,50 @@ import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import WriteAnswer from 'pages/Answer/WriteAnswer';
 import Ask from 'pages/Ask';
 import WriteQuestion from 'pages/Ask/WriteQuestion';
+import Signup from 'pages/Signup';
+import Oauth from 'pages/Signup/Oauth';
+import TermsOfService from 'pages/Signup/TermsOfService';
+import SignupSuccess from 'pages/Signup/SignupSuccess';
+import { RecoilRoot } from 'recoil';
+import Answer from 'pages/Answer';
+import { Onboarding } from 'pages/Onboarding';
 
 function App() {
   return (
-    <BrowserRouter>
-      <Routes>
-        {/* MainPage */}
-        <Route path="/" element={<Main />} />
-        <Route path="/post/:id" element={<PostDetail />} />
-        <Route path="/search" element={<Search />} />
+    <RecoilRoot>
+      <BrowserRouter>
+        <Routes>
+          {/* OnboardingPage */}
+          <Route path="/onBoarding" element={<Onboarding />} />
+
+          {/* MainPage */}
+          <Route path="/" element={<Main />} />
+          <Route path="/post/:idx" element={<PostDetail />} />
+          <Route path="/search" element={<Search />} />
+
+          {/* SignupPage */}
+          <Route path="/signup" element={<Signup />} />
+          <Route path="/oauth" element={<Oauth />} />
+          <Route path="/signup/terms" element={<TermsOfService />} />
+          <Route path="/signup/success" element={<SignupSuccess />} />
 
-        {/* AnswerPage */}
-        <Route path="/answer" element={<Answer />} />
-        <Route path="/answer/:id" element={<WriteAnswer />} />
+          {/* AnswerPage */}
+          <Route path="/answer" element={<Answer />} />
+          <Route path="/answer/:idx" element={<WriteAnswer />} />
 
-        {/* AskPage */}
-        <Route path="/ask" element={<Ask />} />
-        <Route path="/ask/write" element={<WriteQuestion />} />
+          {/* AskPage */}
+          <Route path="/ask" element={<Ask />} />
+          <Route path="/ask/write" element={<WriteQuestion />} />
 
-        {/* MyPage */}
-        <Route path="/myPage" element={<Mypage />} />
-        <Route path="/myPage/myQna" element={<MyQna />} />
-        <Route path="/myPage/myComment" element={<MyComment />} />
-        <Route path="/myPage/myScrap" element={<MyScrap />} />
-        <Route path="/myPage/provision" element={<Provision />} />
-      </Routes>
-    </BrowserRouter>
+          {/* MyPage */}
+          <Route path="/myPage" element={<Mypage />} />
+          <Route path="/myPage/myQna" element={<MyQna />} />
+          <Route path="/myPage/myComment" element={<MyComment />} />
+          <Route path="/myPage/myScrap" element={<MyScrap />} />
+          <Route path="/myPage/provision" element={<Provision />} />
+        </Routes>
+      </BrowserRouter>
+    </RecoilRoot>
   );
 }
 

src/assets/common.ts

@@ -85,3 +85,8 @@ export const StyledLink = styled(Link)<{ color?: string }>`
   text-decoration: none;
   color: ${({ color }) => (color ? color : Palette.Black)};
 `;
+
+export const Img = styled.img`
+  width: 100%;
+  height: 100%;
+`;

src/assets/data/MypageData.ts

@@ -1,9 +1,42 @@
 import { mypageMenuInterface } from 'pages/Mypage';
+import closure from 'store/closure';
+
+const userType = closure.getUserType();
 
 export const myPageMemu: mypageMenuInterface[] = [
-  { link: 'myQna', icon: 'myQnaIcon', menu: '내 질문', margin: 0 },
-  { link: 'myComment', icon: 'myCommentIcon', menu: '내 댓글', margin: 0 },
-  { link: 'myScrap', icon: 'myScrapIcon', menu: '스크랩', margin: 0 },
-  { link: '', icon: 'newsLetterIcon', menu: '뉴스레터 구독하기', margin: 10 },
-  { link: '', icon: 'logoutIcon', menu: '로그아웃', margin: 10 },
+  {
+    link: 'myQna',
+    icon: 'myQnaIcon',
+    menu: `${userType === 'Juni' ? '내 질문' : '내 답변'}`,
+    margin: 0,
+    count: 'questionCount',
+  },
+  {
+    link: 'myComment',
+    icon: 'myCommentIcon',
+    menu: '내 댓글',
+    margin: 0,
+    count: 'commentCount',
+  },
+  {
+    link: 'myScrap',
+    icon: 'myScrapIcon',
+    menu: '스크랩',
+    margin: 0,
+    count: 'scrapCount',
+  },
+  {
+    link: '',
+    icon: 'newsLetterIcon',
+    menu: '뉴스레터 구독하기',
+    margin: 10,
+    count: '',
+  },
+  {
+    link: '',
+    icon: 'logoutIcon',
+    menu: '로그아웃',
+    margin: 10,
+    count: '',
+  },
 ];