# 부스트캠프 WEEK 4 피어세션

## 피어세션 멤버
- 김민성 J035
- 김종은 J053
- 류남광 J064
- 유현우 J127

## 코드리뷰
### 김민성 J035
- 로그인을 헤더에서 user id를 입력해서 한다
- 도메인 등록! :+1:
- 선택 사항들은 빼고 필수 사항들은 모두 구현 완료
- History는 최근 10개만 보여준다
- Drap and Drop API 사용
- Log 저장할 때 description 자체를 저장
- TimeStamp 값 자체를 DB의 bigInt에 저장 `Date().getTime()` -> `Date(number).toDateString()`으로 js에서 사용
- 카드 순서를 linked list로 구현
- 진정한 DB는 Delete를 사용하지 않는다 -> `visible` column 사용
- 데이터가 바뀌면
- Deploy.sh는 사용!
- forever를 사용해서 자동으로 배포하도록
- 서버가 멈췄을 때 자동으로 재시작하도록 해줌
- `bash deploy.sh`
- Heidi 짱 좋음!
- 한글은 3 byte가 될 수 있기 때문에 Varchar을 1500으로 지정
- 프론트에서 `response.json()`처럼 사용할 수 있음
- 유저는 자기가 가진 Todo들만 변경하도록 함 → 유저 세션의 id와 request의 id를 확인

- `stopImediatePropagate`
- x 버튼을 누르면 delete 뿐만 아니라 수정 모달 event도 fire 되어서 `stopImediatePropagate`을 통해서 x 버튼에 대한 event는 삭제만 실행되도록 제한한다.
- transition 사용함
- class를 사용하지 않음 → 글로벌 변수가 만들어지기 때문
- class를 다시 사용할 일이 없어서
- 사용자가 글로벌 변수에 접근 할수도 있어서
- `insertAdjacentHTML`
- 순서를 지정해서 넣을 수 있음
- fetch 함수를 만들어서 변수를 통해서 필요한 값만 바꾸도록 함

### 김종은 J053
- menu에서 로그인
- 카드 생성까지 개발
- 새로고침 시 새로 로그인
- 데이터베이스 쿼리 모아둠
- 로그인은 미들웨어 거쳐 로그인 상태 체크함
- 클래스로 관리 - card, column
- board에 이벤트 등록. event delegation
- scss 사용
- webpack sass-loader
- 변수를 지정할 수 있어 편했음
- mixin 사용
- indentation을 톨한 DOM 선택
- webpack url-loader 시도, 잘 안 됐음
- webpack에서 image의 이름을 원하는 것으로 지정할 수 있음 →

    // webpack.config.js
    test: /\.(png|gif|svg|jpe?g)$/,
    loader: "file-loader",
    options: {
      name: "[name].[ext]?[hash]",
    },

- SQL → 쿼리 문으로 필요한 모든 카드의 order를 update함
- husky랑 lint-staged사용

### 류남광 J064
- 브라우저를 실행하면 필요한 데이터들을 바로 fetch한다
- 로그를 간단하게 표시 → 어느 카드에 어떤 action을 했는지만 표시
- 수정 모달을 띄워주는 것까지만 구현
- 액션마다 로그를 바로 생성
- class로 card와 column을 관리
- html구조를 만들어 주는 함수
- 만든 구조를 원하는 곳에 넣어주는 함수
- `innerHTML`를 사용하면 등록한 이벤트가 사려져서 `insertAdjacentHTML`를 사용
- 애니메이션을 사용! → 메뉴 나타가고 사라질 때
- card와 column의 데이터를 불러올 때 array에 저장해서 관리
- 관리하기 더 편함
- 카드를 감싸고 있는 모든 div에 event를 등록[](https://)
- 문자를 바로 넣지 않고 [html escape code](https://www.freeformatter.com/html-entities.html)를 사용하기
- x + → × +
- `x + `→ `× +`
- Animation css
- `transform`
- `transition`

### 유현우 J127
- 배포! :100:
- 카드 생성 기능 구현 완료
- Column을 동적으로 생성
- `innerHTML`
- event 사라지는 문제가 발생
- `createElement` 사용
- class를 사용해서 관리
- 메모리 관리 및 누수 발생 가능성?!
- 프로젝트 설계 및 설정에 많은 고민을 했음
- 구조 및 로직을 나누는 단위에 대해서 고민을 많이 했음