블랙커피 자바스크립트 스터디 - 1주차

1주차

드디어 1주차 시간이 되었다.

코딩을 시작하기 전에 알아야 할점

우리가 요구사항을 완성 시키려면 4가지를 알아야 한다.

• DOM (Document Object Model)
• BOM (Browser Object Model
• Event
• 프론트엔드 상태관리

이중 아는것도 있었고 처음 들어보는것도 있었다. 특히 프론트엔드 상태관리에 대해서는 인지 하고 있었으나 ,
실제로 적용하려고 당장에 보고 해보니까 쉽지 않은 부분이였다.
차근차근 해보자 나는 DOM, BOM, Event를 적극적으로 활용을 했다.
코드를 보고싶으면 아래의 깃 저장소에서 확인하면 된다.

• 레포지토리

우리가 해야할 요구사항은 다음과 같았다.

• 요구사항

  • todo List에 todoItem을 엔터 키보드로 입력하여 추가한다.
  • list에 새로운 요소를 삽입한다.
  • todoList에 X버튼을 이용해서 엘리먼트를 삭제한다.
  • todoList를 더블 클릭했을때 input모드로 변경하고, li tag에 editing class로 만든다. 단, 이때 수정완료하지
    않은 상태에서 esc키를 누르면 수정되지 않은채로 다시 view모드로 복귀해야한다.

• 참고 사이트(구현이 완료되어서 aws cloudfront에 배포를 하였습니다.)

  • 사이트

처음 페어 프로그래밍을 진행했었다. 부랴부랴 최대한 일을 빨리 끝낸뒤 퇴근 후 7시 30분부터 시작을 했다.
처음 같이 페어프로그래밍을 하는 분은 아직 학부생이라고 했고, 바닐라js실력은 비슷한 수준이였던것 같다.
우리는 처음 페어 프로그래밍해서 갈팡질팡을 했다. 그래서 기능 단위로 완성을 하면 서로 화면을 바꾸기로 했었다.
그런데, 나중에 물어보니까 기능단위보다는 시간단위가 맞다고 하셨다.

우리는 3시간정도 페어프로그래밍을 마치고 서로의 회고시간을 가졌다.
진행하면서 아쉬웠던 점은 첫번째로, 당시에 요구사항을 분석하고 코드를 짜려고 하니까 뒤죽박죽 되는 느낌이 많이 들었다.

• 진행하면서 아쉬웠던점
  • 그 시간에 분석을 하고 바로 코드를 짜려고 하니까 너무 뒤죽박죽이 되는 느낌이다.
  • 선 공부를 하고와서 페어프로그래밍을 하면 좋겠다.
• 궁금했던점
  • 스터디장님은 약 20분씩 돌아가면서 하라고 했었는데, 우리는 기능 구현단위에 교대를 했다.
  • 어떤것이 맞을까?
• 좋았던점
  • 현업에 있어도 혼자 짜는 시간이 많아서 서로의 코드를 신경 안쓰게 되는데, 그러다 보니 가독성이 확실히 떨어지는 코드를 짤수 밖에 없었다.
  • 그래서 이번에는 서로 의견을 맞춰서 짰었기 때문에, 고민을 하고 서로에게 배려를 할수 있었다.

코드를 다 작성하고 PR을 올린 시점부터 대망의 코드리뷰 시간이 되었다.
3인 1조로 한 팀이 되어서 코드리뷰를 남겨야 하기 때문에 몇가지를 질문드리면서 개선할 점을 찾아보았다.
내가 적극적으로 다른분들께 코드리뷰를 남겼다.

js-todo-list-step1 리뷰1
js-todo-list-step1 리뷰2
js-todo-list-step1 내가 한것

아쉽게 PR을 늦게 올려서 코드리뷰를 많이 받지 못했다.

이번에 한 파일에 자바스크립트를 넣으면서 모듈화를 시키지 못해서 코드들이 난잡해진 느낌이 많이 났다.
다음 스텝에 모듈화를 시키면서 적용을 하기로 마음을 먹었다.