Notice 페이지 작성 및 CRUD 기능 구현

[syg0629]

Issue Number

#3

PR Type

• UI
• 기능개발

요약

• Notice(공지사항) 페이지 UI
• Notice CRUD 기능 구현
• 등록, 수정 페이지에서 사용할 WriteNoticeForm 컴포넌트 작성
• 웹 에디터 react-quill 설정
• 유효성 검사를 위한 react-hook-form 설정
• XSS 공격 방지를 위한 DOMPurify 설정

상세 내용

Notice UI

• 사이트 진입 시 왼쪽 하단에 Notice가 보이게 설정
• 오른쪽 하단은 WOD 페이지 작성 후 설정 예정

Notice 목록 페이지

Notice 등록/ 수정 페이지

• Notice 등록/수정 페이지는 같은 WriteNoticeForm 컴포넌트를 사용하고 있으며 isEdit props에 따라 분류됨

• Notice 등록 페이지

• Notice 수정 페이지

Notice 상세 페이지

[bglgwyng]

그리고 suspense fallback은 잘 잡히고있나요? 로딩 화면이라던가요.

[syg0629]

그리고 suspense fallback은 잘 잡히고있나요? 로딩 화면이라던가요.

넵! 잘 나옵니다 :)