Feature(#24): Error 페이지, 강의 종료 페이지 구현 #191
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- 에러 페이지 라우팅 작업을 완료하였습니다. - 에러 페이지의 UI 작업을 완료하였습니다. - 모바일을 고려하여 반응형 작업을 완료하였습니다.
- 홈 화면으로 돌아가기 버튼 클릭 시에 Home으로 이동하도록 navigate를 추가하였습니다.
- 강의 종료 페이지 UI를 구성하였습니다.
✅ Deploy Preview for boarlog ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
Byeonjin
reviewed
Dec 4, 2023
Comment on lines
+12
to
+15
| <p className="font-pretendard font-semibold text-size-32 -mt-20 md:-mt-32 md:text-size-64">CLOSED</p> | ||
| <p className="semibold-20 text-grayscale-darkgray mt-12 mb-6">강의가 종료되었어요.</p> | ||
| <Button type="full" buttonStyle="black" onClick={() => navigate("/")}> | ||
| <HomeIcon className="fill-grayscale-white" />홈 화면으로 돌아가기 |
Jw705
approved these changes
Dec 4, 2023
frontend/src/App.tsx
Outdated
| @@ -12,6 +12,8 @@ import Example from "./pages/Example/Example"; | |||
| import ToastContainer from "./components/Toast/ToastContainer"; | |||
| import Start from "./pages/Start/Start"; | |||
| import MyPage from "./pages/MyPage/MyPage"; | |||
| import Error from "./pages/Error/Error"; | |||
There was a problem hiding this comment.
이름에서 조금 혼동이 올 수 있을 것 같은데 ErrorPage라는 이름은 어떠신가요?
There was a problem hiding this comment.
좋습니다! 수정해보겠습니다 :)
- Error 페이지의 이름을 명시적으로 변경하였습니다.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
작업 개요
Error 페이지, 강의 종료 페이지 구현 close #24
작업 사항
고민한 점들(필수 X)
Error 페이지와 강의 종료 페이지 역시 모바일에서 접근이 가능하기 때문에 이를 반응형으로 구현하고자 하였습니다. tailwind의
md를 기준으로 하여 반응형 작업을 완료하였습니다. 추가적으로 text 역시 크기가 변경되어야 했기 때문에 tailwind.config에 정의한 내용을 활용하여 이를 구현하였습니다. (global.css에 정의한 custom class 미사용)특정 페이지에서 올바르지 않은 접근을 시도했을 경우에도
error페이지로 redirect할 필요가 있었기 때문에,/error로 접근할 경우에Error페이지를, 라우팅하지 않은 다른 주소에 접근하였을 경우에는Navigate를 활용하여/error로 이동하도록 하였습니다.스크린샷(필수 X)
Error 페이지
2023-12-04.20-30-54.mp4
강의 종료 페이지
2023-12-04.20-30-40.mp4