프로젝트 - 블로그(이름 미정)

김정현·2023년 1월 12일
0

기타

목록 보기
19/25

관련 링크
포스트맨 API
프론트 레포지토리
피그마
트렐로
노션


개요

지속적인 유지/보수를 위하여,
사용성과 확정성이 좋은 포맷인 블로그를 프로젝트 주제로 선정하였다.

프론트엔드 3명, 백엔드2명으로 구성되었으며,
타입스크립트, eslint를 적용한 첫 번째 프로젝트이다.


컨벤션

import순서

1.라이브러리 (리액트, 외부 라이브러리)
2. 컴포넌트 (공통 컴포넌트, 먼 컴포넌트 -> 가까운 컴포넌트)
3. 함수,변수 설정파일
4. 미디어 파일(.png)
5. css 파일 (스타일 관련 파일)

css 순서

1. 레이아웃(position, float, display)
2. Box Modal(width, height, margin, padding….)
3. Visual Property (color, background-color, border…)
4. Typo (font, text-align)
5. Misc(cursor, overflow, z-index…) 

Commit message, pr message

- 기능 추가) ADD :상세기록
- 기능 변경) MODIFY : 상세기록
- 기능 수정) FIX : 상세기록
- 에러 수정) ERROR : 상세기록 

branch, style, variable

- Branch
    - 리팩토링: refactor/기능명
    - 기능: feature/기능명
    - 수정: fix/기능명
    - 필요에 따라 임시로 브랜치 명 정하고, push하기 전에 브랜치 명 바꾸고 push
    - 급한 에러: hotfix/기능명
- [Front] Style
    - Inline-style 금지
    - module.scss 파일 사용 → 새로 추가되는 파일만 사용
    - SASS - Nesting 적극 사용
- [Front] Variable
    - 변수: camelCase - 새로 추가되는 파일부터 사용
    - 함수: 동사로 시작 / arrow-function 사용(상황에 따라 function() 사용)
    - Component: functional component

담당 파트 프로토 타입


느낀점

클론 프로젝트가 아닌 이상,
시작 단계에서 들어갈 컴포넌트들의 디자인을 많이 찾아보고 결정한 상태에서
작업을 시작하는 것이 더 빠르게 작업할 수 있는 방법인 것 같다.

profile
개발 공부 블로그

0개의 댓글