[브라우저 OS를 만들어보자 - 2] FigJam 으로 플로우 작성하기

개발깎새·2023년 7월 16일
0

포트폴리오

목록 보기
3/3

프로젝트 구조를 정리해보자🧾

어느 정도 규모가 있는 프로젝트를 무턱대고 개발을 시작했다가 일정이 매우 꼬이고, 코드가 더러워지는 현상을 스타트업을 다니며 너무 많이 겪었습니다. 깨달은점은 코드 컨벤션과 논리 흐름이 있어야 개발에 기준이 생기기 때문에 최근 회사에서 도입중인 기획정립 방법을 내 프로젝트에 도입해보려고 합니다.

FigJam 으로 플로우 정리

이전 DaedalOS 프로젝트를 분석해보면서 코드 해석이 굉장히 힘들다는걸 알게되었습니다...

코드를 해석하다가 너무 존경스러운 나머지 DustinBrett씨 유튜브에 댓글생성.
단순한 1. 2. 3... 번호로만 순서를 구분하는 식으로의 플로우 정리는 오히려 독이될것이라고 생각해서 제대로 툴을 사용하여 플로우를 정리해보기로 했습니다.

FigJam을 이용해서 플로우를 정리하였고 개발자 친화적인 관점으로 플로우 정리를 해볼려고 노력했습니다.

기획 정립에 필요한 팔레트를 생성

중구난방으로 플로우가 짜지는 것을 방지하기 위해서 위에 자주 사용할 만한 오브젝트를 정립해두었습니다.

페이지 로딩시 플로우생성


이전 시리즈에서 다뤘던 코드 분석을 바탕으로 플로우를 만들었습니다.

state, store 관점에서 플로우생성(진행중)


데이터를 저장하고 사용할때 필요한 플로우로 계속 작성이 필요합니다.
아래는 예상되는 플로우 예시들

  • IndexedDB 초기화
  • 파일 생성
  • 파일 삭제
  • 폴더 생성
  • 폴더 삭제
  • etc...

파일시스템의 관리에 필요한 플로우를 여기 항목에 차근차근 작성해두려고 합니다.
데이터의 생성과 crud 흐름을 구축한 이후 화면상에 보여지는 플로우또한 작성이 필요할 듯합니다.

마무리

우선 페이지 로딩시의 플로우를 구현하고 후 계획을 정립하는 것으로 결정 📝

profile
웹 개발 재너럴리스트가 되고픈 개발자 박병훈입니다.

0개의 댓글