[김은재] Week15 #466

rladmswo1715 · 2024-05-24T09:45:04Z

요구사항

기본

링크 공유 페이지의 url path를 ‘/shared/{folderId}’로 변경하고, {folderId}에 해당하는 폴더 데이터가 화면에 보이게 해주세요.
폴더 페이지의 url path를 전체 링크를 보는 경우 ‘/folder’로, 특정 폴더를 보는 경우 ‘/folder/{folderId}’로 변경하고, {folderId}에 해당하는 폴더 데이터가 화면에 보이게 해주세요.

심화

리퀘스트 헤더에 인증 토큰을 첨부할 때 axios interceptors를 활용해 주세요. (axios를 사용하지 않는다면 이와 유사한 기능을 활용해 주세요.)리퀘스트 헤더에 인증 토큰을 첨부할 때 axios interceptors를 활용해 주세요. (axios를 사용하지 않는다면 이와 유사한 기능을 활용해 주세요.)

주요 변경사항

스크린샷

멘토에게

https://ej-weekly-mission.vercel.app/

choinashil

은재님 수고 많으셨습니다! 👍🏽
남은 미션들도 화이팅이에요!!

choinashil · 2024-05-27T11:37:04Z

api/folder.ts

+  navId: string | string[] | undefined,
+  userToken: string | undefined


undefined 인 경우 아래와 같이 선택적 프로퍼티로 작성할 수도 있습니다!

Suggested change

navId: string | string[] | undefined,

userToken: string | undefined

navId?: string | string[],

userToken?: string

choinashil · 2024-05-27T11:38:12Z

api/folder.ts

+) => {
+  let query = "/api/links";
+  if (navId) {
+    query += `?folderId=${navId}`;


이렇게 넣는다면 navId 는 string[] 타입인 경우보다는 string 타입인 경우만 해당될 것 같네요
19라인에서는 string | string[] 으로 정의되어있는데 string[] 으로 들어오는 케이스가 있는지 확인 후, 없다면 타입을 좁혀주시면 좋을 것 같습니다!

다른 부분도 마찬가지

choinashil · 2024-05-27T11:53:46Z

components/common/modal/modalContent/LinkAddContent.tsx

@@ -39,6 +43,7 @@ const LinkAddContent = () => {
    <S.Content>
      <S.FolderList>
        {navList.map((navItem: INavItem, i) => {
+          console.log(navItem);


PR 올린 후 불필요한 코드가 있는지 꼭 확인해주세요

Suggested change

console.log(navItem);

choinashil · 2024-05-27T11:57:49Z

components/folder/NavBox.tsx

+                  isCurrentNav={
+                    pageNavId && navItem.id?.toString() === pageNavId[0]
+                      ? true
+                      : false
+                  }


조건문 자체가 boolean 이므로 간단하게 변경해볼수있겠네요

Suggested change

isCurrentNav={

pageNavId && navItem.id?.toString() === pageNavId[0]

? true

: false

}

isCurrentNav={

pageNavId && navItem.id?.toString() === pageNavId[0]

}

choinashil · 2024-05-27T11:58:25Z

components/folder/NavItem.tsx


 interface NavItemProps {
  navName?: string;
  navId?: number;
-  onClick: (navId: number) => void;
+  //onClick: (navId: number) => void;


미사용 코드 삭제!

choinashil · 2024-05-27T12:03:40Z

components/layout/header/UserProfile.tsx

+  const handleLogout = () => {
+    window.localStorage.removeItem("userToken");
+
+    router.reload();


새로고침 할 수도 있고,
전역에서 로그인 여부를 관리하는 상태를 참조하도록 해도 될 것 같아요
로그인 할 때 토큰 세팅하면서 해당 상태도 같이 true 로 변경해주고,
로그아웃할 때는 토큰 삭제하면서 같이 false 로 변경

이러면 새로고침 하지 않아도 상태 변경에 따라 새로고침 없이도 화면에 반영될 수 있을거고요

꼭 수정해야한다는 의미는 아니고 다양한 방법이 있다는 정도로 이해하시면 됩니다

choinashil · 2024-05-27T12:09:30Z

context/User.tsx

+      id: userInfo.id,
+      name: userInfo.name,
+      image_source: userInfo.image_source,
+      email: userInfo.email,


userInfo 에 id, name, image_source, email 만 포함되어있다면 아래처럼 작성할 수도 있겠네요

Suggested change

id: userInfo.id,

name: userInfo.name,

image_source: userInfo.image_source,

email: userInfo.email,

...userInfo

choinashil · 2024-05-27T12:13:27Z

pages/shared/[folderId].tsx

+  // run build 에러때문에 잠시 작성
+  const handleSearchChange = (value: string) => {};
+  const handleDeleteBtn = () => {};


SearchBar 에서 꼭 필요한 prop 맞나요?? 아니라면 SearchBar 의 prop 타입에서 두 함수를 옵셔널로 처리해도 될 것 같아요

choinashil · 2024-05-27T12:14:16Z

styles/Global.styled.ts

@@ -60,6 +52,11 @@ const GlobalStyle = createGlobalStyle<GlobalStyleProps>`
        cursor: pointer;
        background: none;
    }
+
+    a{


작은 여백도 꼼꼼하게 챙기기!

Suggested change

a{

a {

choinashil · 2024-05-27T12:15:05Z

styles/pages/Sign.styled.ts

  }
 `;

 export const EmailBox = styled.div`
  margin-top: 24px;
 `;

-export const PassWrodBox = styled.div`
+export const PassWordBox = styled.div`


password 는 한 단어이므로 중간에 대문자 대신 전체 소문자로 작성해야해요

Suggested change

export const PassWordBox = styled.div`

export const PasswordBox = styled.div`

rladmswo1715 added 7 commits May 21, 2024 19:36

feat: shared페이지 api연동 작업

29ccc6c

fix: userContext 수정 / Header 유저 정보 불러오기 수정

88517f2

feat: folder 페이지 api연동 작업

1009c4f

feat: 메인페이지 구현

ba000c7

14주차 피드백 반영

da966d2

test: 콘솔 삭제

99f230c

fix: Sign CSS수정 / 불필요코드 삭제

b4f8bd3

rladmswo1715 requested a review from choinashil May 24, 2024 09:45

O-daeun added the 매운맛🔥 뒤는 없습니다. 그냥 필터 없이 말해주세요. 책임은 제가 집니다. label May 27, 2024

rladmswo1715 added 2 commits May 27, 2024 13:53

fix: 추가하기 모달 api 수정

62c9a1d

feat: 로그아웃 기능

66d551e

choinashil approved these changes May 27, 2024

View reviewed changes

choinashil merged commit f22912f into codeit-bootcamp-frontend:part3-김은재 May 27, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[김은재] Week15 #466

[김은재] Week15 #466

rladmswo1715 commented May 24, 2024

choinashil left a comment

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

choinashil May 27, 2024

		navId: string \| string[] \| undefined,
		userToken: string \| undefined

	export const PassWordBox = styled.div`
	export const PasswordBox = styled.div`

[김은재] Week15 #466

[김은재] Week15 #466

Conversation

rladmswo1715 commented May 24, 2024

요구사항

기본

심화

주요 변경사항

스크린샷

멘토에게

choinashil left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment