Skip to content

[임주민] week5#247

Open
imkrmin wants to merge 11 commits intocodeit-bootcamp-frontend:mainfrom
imkrmin:part2-임주민-week6

Hidden character warning

The head ref may contain hidden characters: "part2-\uc784\uc8fc\ubbfc-week6"
Open

[임주민] week5#247
imkrmin wants to merge 11 commits intocodeit-bootcamp-frontend:mainfrom
imkrmin:part2-임주민-week6

Conversation

@imkrmin
Copy link
Copy Markdown
Collaborator

@imkrmin imkrmin commented Nov 26, 2023

요구사항

기본

  • 네비게이션 바, 푸터가 랜딩 페이지와 동일한 스타일과 규칙으로 만들어졌나요? (week 1 ~ 3 요구사항 참고)

  • 상단 네비게이션 바에 프로필 영역의 데이터는 https://bootcamp-api.codeit.kr/docs 에 명세된 “/api/sample/user”를 활용했나요?

  • 상단 네비게이션 바에 프로필 영역의 데이터가 없는 경우 “로그인” 버튼이 보이도록 만들었나요?

  • 폴더 소유자, 폴더 이름 영역, 링크들에 대한 데이터는 “/api/sample/folder”를 활용했나요?

  • Static, no image, Hover 상태 디자인을 보여주는 카드 컴포넌트를 만들었나요?

  • Hover 상태에서 이미지가 기본 크기의 130%로 커지나요?

  • 카드 컴포넌트를 클릭하면 해당 링크로 새로운 창을 띄워서 이동하나요?

  • Tablet에서 카드 리스트가 화면의 너비 1124px를 기준으로 이상일 때는 3열로 작을 때는 2열로 배치되나요?

  • Tablet, Mobile에서 좌우 최소 여백은 32px 인가요?

심화

  • 커스텀 hook을 만들어 활용했나요?

주요 변경사항

스크린샷

멘토에게

  • 지난주 위클리 미션을 못 해서 구현하고 week5 폴더에 넣었습니다. 이번주 미션은 파일만 만들고 네브바랑 풋터 css 적용하고, 서치바만 넣었습니다.... ㅠㅠ 이것도 잘 한건지 모르겠네요,, 그리고 landing.css를 적용 시켰는데 화면에 꽉차지 않더라구요 뭐 때문인지 알 수 있을까요 ? ㅠㅠ 한 게 없어서 당황스러우시겠지만 일단 올려봅니다....
  • landing.css 쪼개서 컴포넌트 별로 하는 게 좋을 거 같은데 이것도 못 하고 올렸습니다 ..
  • 리액트를 다루는게 많이 어렵습니다...................................................... 이해하는 것도 느리고 위클리 미션을 하기에도 벅차지만 열심히 따라가겠습니다 part2 잘 부탁드립니다 !!
  • 셀프 코드 리뷰를 통해 질문 이어가겠습니다.

@imkrmin imkrmin requested review from 00eun and domuk-k and removed request for 00eun November 26, 2023 13:17
@imkrmin imkrmin added the 미완성 죄송합니다... label Nov 26, 2023
@imkrmin imkrmin changed the title [임주민] week6 [임주민] week5 Nov 27, 2023
Comment thread week5/src/signin.js
}
localStorage.setItem("accessToken", accessToken);
location.href = "/folder";
} catch {
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

해당 catch 블록 내부에서는 서버 측 에러도 포함됩니다. 즉 사용자에게 이메일을 확인해주세요, 비밀번호를 확인해주세요 라는 메시지를 무조건적으로 던져준다는 것은 전적으로 사용자에게 잘못이 있다는 뜻이 되므로 5xx 상태코드에 대해서도 예외처리가 필요합니다.

Comment thread week5/src/signup.js
);

function validatePasswordInput(password) {
if (password === "" || !isPasswordValid(password)) {
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

password 가 빈 문자열인 것 조차도 isPasswordValid 함수 내부에서 체크할 수 있도록 만들어주시면 코드가 더 간략해집니다.

Comment thread week5/src/signup.js
const signForm = document.querySelector("#form");
signForm.addEventListener("submit", submitForm);
async function submitForm(event) {
event.preventDefault();
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

다음부터는 굳이 form 태그를 사용하지 않으면 event.preventDefault() 코드를 쓸 필요 없어지니 참고해주세요.

Comment thread week5/src/utils.js
@@ -0,0 +1,52 @@
const SIGN_INPUT_ERROR_CLASSNAME = "sign-input-error";
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

SIGN_INPUT_ERROR_CLASSNAME , ERROR_MESSAGE_CLASSNAME, EMAIL_REGEX 는 상수 개념이므로 src/const.js에서 관리해주시면 되겠습니다.

@domuk-k domuk-k removed their request for review November 27, 2023 14:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

미완성 죄송합니다...

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants