본문 바로가기

전체 글11

2023-10-14 소북소북 | 공통 컴포넌트 정리 및 브랜치 정리, 이미지 업로드 공통 컴포넌트 정리 및 주석달기 figma를 계속 들여다 보며 공통 컴포넌트로 뺄만한 것들을 최대한 빼서 작성했다. 이왕 MUI쓰는 김에 Emotion도 익숙해지려했지만 단순히 한개에 컴포넌트에 스타일링 할때는 아직 필요성을 못느끼겠당,,, 뒤죽박죽 작성해 둔것들을 MUI sx prop으로 다 통일했다. 아직 UI 밖에 안짰지만 보기 편하게 주석을 달아서 정리했다. (진짜 별거 없지만,,,) 공통 컴포넌트에서 router Link 적용이 필요한 부분들 찾아서 작성했다. 페이지 왔다갔다 하는거 재밌음ㅎ 메인 컴포넌트 쪼개기 Main Page 컴포넌트는 생각보다 크게 쪼개졌다. 데이터를 어떻게 받아서 가공할 것인지에 따라서 더 쪼갤수도 있을 것 같은데,,, 아직 감이 안와가지고 나중에 더 쪼갤 필요가 있으면.. 2023. 10. 14.
2023-10-12 소북소북 | 공통 컴포넌트 및 메인 UI MUI theme 적용 사용될 컬러를 일정하게 맞추고 싶어서 style/theme.ts 파일을 만들어서 createTheme안에 컬러를 미리 정해서 셋팅 Typography 글꼴 크기를 반응형으로 만들기 위해 MUI에서 제공하는 responsiveFontSizes() helper를 사용 import { red } from "@mui/material/colors"; import { createTheme, responsiveFontSizes } from "@mui/material/styles"; const theme = responsiveFontSizes( createTheme({ palette: { ... }, }), ); export default theme; ------------------------.. 2023. 10. 12.
2023-10-11 소북소북 | 프로젝트 구조 셋팅 및 이름 선정 프로젝트(폴더) 구조 client |... - src | - components | - common(공용 컴포넌트) - pagename(특정 페이지에서 사용하는 컴포넌트) - pages - constants(상수) - styles - hooks - libs(공용함수) - apis | - service - store(redux) 프로젝트 이름 및 디자인 소북소북 이전에 잠깐 혼자했던 프로젝트와 유사한 부분이 많아 그때 사용한 이름을 가져오기로 함 디자인은 일단 이름에 맞춰서 눈 오는 겨울느낌을 내기로 함 컬러셋 참고 2023년 10월 11일 진행상황 react-router 설정 완료 MainLayout과 SubLayout 생성 MainLayout에 들어갈 HeaderBar와 Footer 생성 및 배치 도서.. 2023. 10. 11.
2023-10-04 소북소북 | 프로젝트 셋팅 ERD ErdCloudLink 기술스택 ReactJS TypeScript MUI-emotion Redux React-query 초기 셋팅 CRA npx create-react-app client --template typescript eslint / prettier npx eslint --init eslint 관련 파일 생성 npm install --save-dev @typescript-eslint/parser @typescript-eslint/eslint-plugin npm install --save-dev --save-exact prettier .prettier 파일 생성 필요 npm install --save-dev eslint-config-prettier eslint-plugin-prettier .. 2023. 10. 11.
2023-10-03 소북소북 | 주제 선정 및 요구사항 정의서 작성, 화면 스케치 주요 기능 회원에 한해 완독하고 싶은 책과 기간을 설정하면 하루에 몇 페이지씩 읽어야 하는지 계산해서 제공 완독한 책에 한해 독서기록을 작성가능 기타 기능 완독 데이터 기반으로 인기도서 제공 독서기록 피드 제공(최신순, 추천순, 댓글순) 팔로우한 유저의 독서기록만 모아보기 제공 독서 모임을 생성하여 이 달의 도서 선정 및 채팅기능 제공(일정상 여유가 될 경우에 구현) 개발 일정 2023년 10월 한 달 간 개발 인원 프론트엔드 1명 https://github.com/codekyz 백엔드 2명 https://github.com/hwanghojun https://github.com/cwhite723 2023년 10월 3일 진행상황 주제 선정 완료 사용자 요구사항 정의서 작성 완료 대락적인 화면 구성 완료(F.. 2023. 10. 11.