[목표]
개발활경을 세팅합니다.
벡엔드와 프론트엔드 리포지트리를 받아옵니다.
V0로 어느정도의 welcome과 projects 페이지를 만듭니다.
11:40 ~ 12:00
식사 전까지 우리의 이슈 형태가 전체 개발을 기준으로 템플릿을 작성할지, 버그 기준으로 작성할지 이야기를 해보았다. 각자의 의견과 이슈트래킹 구현 2분의 의견을 총 종합하여 결정했다. 결론적으로 전체 개발 기준으로 이슈트래킹 시스템을 구축하기로 했다.
12:00 ~ 13:00
오늘은 쉑쉑 버거가 나왔다. 이에 더해 감자튀김 쿠폰도 줘서 놀랐다.
13:00 ~ 14:20
노션을 정리하고 벨로그를 정리했다.
14:20 ~ 19:00
Welcome과 Projects 페이지 구현 시작
본격적으로 웰컴페이지와 프로젝트 생성 페이지를 만들기 위해 환경설정을 하고
v0를 통해 프론트엔드를 만들었다.
- 먼저, V0가 만든 파일을 다운로드 받아서 리엑트로 실행되는지 확인해보았다.
- 패키지 관련 오류가 떠서
npm install --legacy-peer-deps를 통해 의존성 검사하지말고 인스톨한다음npm run build로 NextJS 패키지를 빌드하여 npm start 로 서버가 정상적으로 실행됨을 확인했다. - 이후에 클론 받은 리포지트리에 이식을 했다. 패키지는 GPT를 통해 동기화했다. 나머지 파일들을 복붙해서 돌려보니 성공적으로 돌아갔다.
- 아까 npm install에서 의존성 문제가 있어서 이유를 확인해보니, 패키지 중에 리엑트 버전이 너무 높아 설치 않되는 문제가 있었다. 추후에 19 버전에서 18 버전으로 내리는 것을 팀원들과 함께 확인해보겠다.
중간에 농구 대회 시간에 쪽잠을 자서 좀 늦게 끝났다. 프론트 엔드 외에 환경 설정해야될 것들이 있어서 시간이 좀 걸렸다.
19:00 ~20:40
프로젝트 파일에서 코드 최적화가 안되고, 편집하지 용이 하지 않아 깃허브에 새 브런치를 파서 올린다음에 깃허브에 해석을 부탁했다.
Nextjs 프로젝트에서 동적 반영(Dev모드)
이와 동시에 Nextjs가 빌드파일을 지우고 재빌드해야 디자인이 반영되는 문제가 있어서 해결해보고 있다.
알고보니까 npm run dev 하면 된다. ㅋㅋㅋ
원래는 파일 구조도 보고 코드 이해하면서 코드최적화를 진행하려 했는데, V0한테 최적화 시키고, 파일 구조도와 코드 설명을 해달라고 했다.
20:40 ~ 21:00
코드의 최적화와 호환성 오류
V0가 최적화한 코드를 적용하기 위해 깃에서 새로 클론 받아 왔다.
패키지 호환성 오류 때문에 React 버전을 18로 지정했다.
21:00 ~ 21:45
식사를 했다. 오늘 저녁 식사는 9900원 혜자 물회다.
21:45 ~ 23:30
벡엔드 시작 전 프론트엔드 점검
최적화된 welcome, project 페이지를 우리 프로젝트에 적용 시켰다.
벡엔드 작업전에 프로젝트 페이지 구성요소에 대한 이야기를 했다. 다른 기능들은 괜찮은데 필요없는 요소를 제거하기로 했다.
→ 프로젝트 카드에 우선순위, 코드품질, 상세보기 및 편집 버튼 제거하기로 했다.
23:30 ~ 24:10
잠깐 숙소에 갔다왔다.
24:10 ~ 04:15
DB: 포스트sql만 사용
Next.js에 대한 고민
Next.js를 굳이 써야하는지에 대해 이야기를 나눴다. 내가 V0 Ai를 통해서 welcome과 project_list를 구현했기 때문이다.
최종적으로 내가 순수 React + Tailwind CSS 로 변환할 수 있는지 여부를 알아보았고, 익숙치 않은 팀원들을 위해 순수 React만 쓰기로 했다. 그에 따라 V0를 통해 변환을 했다.
V0를 통한 순수 React 가 안되는 이유
순수 React로 하니까 V0자체 프리뷰가 Nextjs로 작동되서 화면이 뜨지 않는다. 임시방편으로 롤백해서 모든 프론트엔드 작업을 마치고 마지막에 순수 리엑트로 변환을 해야겠다.
사이트 화면 구성에 대한 결정
projects(완료)
프로젝트 패널: 제목, 설명, 담당자, (프로젝트 총)이슈, 우측상단 프로젝트 상태(진행중, 완료, 대기중, 보류)만 포함(추가사항으로 참여인원, 마감일)
header(일부 완료)
헤더: 프로젝트 목록(Code Planner클릭), 내 정보를 볼 수 있는 프로필 아이콘, 설정, 알림(팝업 스타일) 추가 구성 (검색 기능은 필요한 페이지 내에다가 탑재)
project_detail(아직 구현 안함)
최근 활동, 남은 업무 유형, 주요 업무, 업무 진행률,
왼쪽 사이드패널: 타임라인, 백로그, 보드, 목록, 모든 업무, 코드
우선적으로 projects 페이지를 가독성 좋고 중요한 정보들만 넣고 재작성하고 있다.
UI 리팩토링, header 및 V0 크래딧 제한
welcome, projects, header까지는 어느정도 구현 완료 했다.
수정점을 고치고 project_detail 페이지도 수정하려 했으나 V0 토큰 한달짜리를 다써서 앞으로는 내가 직접 짜보겠다.
본 프로젝트하고 합치는 작업도 내일 해야겠다.
