1. WHAT : 가사일 도움 페이지

  • 집안일 하는 법을 검색하는 것에 시간을 쓰기 싫은, 바쁜 현대인을 위한 집안일 관리 페이지

2. Stacks

  • TypeScript, Firebase, (React-Query)
  • Craco (absolute path)
  • i18n (multilingual support)

3. 특징

  • 기초 보일러 플레이팅 [x]

  • 컴포넌트 제작 [x]

  • 아이콘 디자인 [x] // 돋보기 : 47 _ 47, // circle : 55 _ 55, border 5px - 멤버, 스티키 // 당근 : 30 _ 30 꽉차게 // 로고 : 150 _ 80 여유있게 // 섹션 타이틀 : 70 _ 30, 한글 25px, 영어 20px (하트는 25px 채워서) // 로딩: 100 _ 80

  • 반응형 화면 [x] -> 모바일 / 데스크탑 (768) // 상수 정리 [x] // 메뉴 드롭다운 [x] // useState [x] // 화면 사이즈 바뀔때마다 자동 새로고침 및 resize [x] + debounce [x] // adv 이미지 교체 + 수정 [x]

  • sticky 버튼 : question [x]

  • 컨텐츠 페이지 : 메뉴, 아이콘, 서브메뉴 등 + 상세페이지 [x]

  • 컨텐츠 페이지 초고 [x]

  • 컨텐츠 페이지 레이아웃 + 컴포넌트 정리 [x]

  • 내용 data 정리 [x] : 일단은 컴포넌트 자체적으로 입력

  • menu state 지정 [x]

  • 1메뉴 클릭하면 해당 2메뉴 출력 - 2메뉴 클릭하면 해당 3메뉴 출력 [x]

  • 메뉴-타입 입력 [x]

  • 클릭 메뉴 상태에 따라 색깔 변경 [x]

  • menu 전환 느리게 되는 문제 해결하기 [x]

  • 링크, 이미지 채우기 [x]

  • 스크롤 버튼 활성화 [x]

  • 다국어 지원 [x] : base

  • small size_dropdown bar 안되는 문제 해결 [x]

  • 내용 정리 : 한, 영, 일, 중, 베트남, 태국 [x]

  • 인라인스타일 제거 [x]

  • 새로고침시 언어 저장 풀림 해결 [x]: localstorage + 기본타입 설정

  • react-query 도입 (state 저장해서 내용 띄우기로) [ ]

  • 컨텐츠 채우기 : 세탁 [ ]

  • 컨텐츠 채우기 : 와인셀러 [ ]

  • 코드 효율화 : 자료구조 변경 및 중복 제거 [ ]

  • 일부만 스켈레톤 로더 적용 그 외는 로딩바(이미지 추가) [ ]

  • state: global로 옮기고 subMenu클릭시 inactivate [ ]

  • 슬슬 서버단으로 옮기기 구상 (복잡도 심화, 보안, 자료구조 불편) [ ]

  • TS 제네릭 이후 강의 정리 [ ] : 주말 안에는 꼭 마치기

  • 글쓰기 할 때 효과 적용 가능하게 [ ]

  • CRUD [ ] - 커뮤니티

  • 리팩토링 : state로 만든 data 서버로 옮기기

  • Template, 레이아웃 : 3개 [ ] // 컨텐츠 페이지 + 사진 페이지 (서브메뉴 + 컨텐츠) // 커뮤니티 (게시판) // store (바둑판식 구성)

  • dynamic import [x]

  • 페이지 제작 : 메인, 아코디언 메뉴, 컨텐츠 페이지 [x]

  • DB [ ]

  • 회원가입 [ ]

  • 로그인 [ ]

  • 북마크 [ ]

  • 검색 [ ]

  • 정기적 알람 세팅 [ ]

  • 관리자에게 채팅 [ ]

  • 관리자 로그인 [ ] + 관리자 페이지 디자인

  • 관리자 기능 [ ] - 채팅 받기

  • 관리자 기능 [ ] - 새 채팅 수신시 메일로 알람

  • 관리자 기능 [ ] - 게시글 삭제

  • 관리자 기능 [ ] - 신고 항목 리스트 및 게시글, 사용자 block

  • 관리자 기능 [ ] - 게시글 이동