✨ 편지 작성 - 텍스트 에디터, 툴바 기능 개발 - Githubissues

depromeet / ggogeet-client

GgoGeet - 꼬깃 접어 전하는 이야기💌

13 stars 2 forks source link

✨ 편지 작성 - 텍스트 에디터, 툴바 기능 개발 #29

Closed ding-co closed 1 year ago

ding-co commented 1 year ago

📎 이슈번호

24

📃 변경사항

ToolbarContainer 컴포넌트 -> Styled component로 변경 (wrapper, style 용도)
ToolbarItem 컴포넌트 -> Toolbar 컴포넌트로 변경
TextTip 기본 컴포넌트 추가
TextEditor React Quill 기본 컴포넌트 추가 및 커스터마이징을 위한 forwardRef 추가
CustomTextEdtiorToolbar UI 컴포넌트 추가 및 현재 디자인 연동 테스트 완료 (정렬 4종류, 텍스트 4종류)

📌 중점적으로 볼 부분

Toolbar 컴포넌트
TextEditor - CustomTextEditorToolbar 연동

🎇 스크린샷

💫 기타사항

텍스트 에디터에서 임베디드로 기본적으로 제공하는 툴바를 이용하는 것이 아닌 커스텀 툴바를 이용하므로 고려할 것이 조금 있습니다. 우선 현재 디자인에서 사이즈, 색상, 배경색은 빠져 있는 상태이고 각 툴바에 대한 중복 사용 및 제한 여부, active/in-active 디자인, color picker 등 추가와 같은 작업이 필요합니다. 또 모바일 사용성을 고려하여 터치에 대한 UI/UX도 잘 살펴봐야 할 것 같습니다.

✔ 체크리스트

[x] 브랜치 전략에 맞는 브랜치에 PR을 올리고 있습니다. (master/main이 아닙니다.)
[x] 커밋 메세지를 컨벤션에 맞추었습니다.
[x] 변경 후 코드는 컴파일러/브라우저 warning/error 가 발생시키지 않습니다.
[x] 변경 후 코드는 기존의 테스트를 통과합니다.
[x] 테스트 추가가 필요한지 검토해보았고, 필요한 경우 테스트를 추가했습니다.
[x] docs 수정이 필요한지 검토해보았고, 필요한 경우 docs를 수정했습니다.

ding-co commented 1 year ago

초반에 React Quill 라이브러리 설치할 때 설정을 잘못해서 충돌나서 작은 feature 단위의 feature/text-editor 브랜치를 따로 만들었습니다. 해당 브랜치로 작업 이어가겠습니다.

ding-co commented 1 year ago