[TIL#1 내배캠 Chapter 1 미니프로젝트] 이게 뭐지?

인생 첫 TIL이다.
원래 계획대로라면 2일 전에 써야 했었는데 진도를 못 따라가서 이제야 쓴다.

 

작성 구조는 데일리루틴, 오늘 있었던 일, 하루 한 줄 TMI 이 셋을 필수로 작성하고 추가적인 내용들을 써보고자 한다.

 

내배캠 Chapter 1 미니프로젝트를 시작했다. 

맡은 작업이 체크박스와 연동되어 달성률을 보여주는 progress bar를 만드는 것이었다. <script type="module">을 적용하기 전까지는 혼자 만들 수 있었다.

 

1. ("input[type='checkbox']:checked") 이러한 방식으로 체크박스를 가져올 수 있다는 것을 알았고

2. .length 를 사용해 보기도 했다.

3. class, id, name 선택자를 사용했다.

4. progress.style.wide = ((count / n) * 100) + "%") 를 사용하니 카운트된 것을 퍼센트로 bar에 적용하더라.

뭐가 더 있었는데 시간이 지나니 기억이 잘 안 난다. 역시 바로바로 적어야겠다.

 

그러나 결국 <script type="module">을 적용한 후 문제에 봉착했다.

 

1. progress bar와 연동되는 값을 파이어베이스에 올리는 것은 가능했으나 가져오는 기능이 작동하지 않았다.

2. 1번의 문제가 뒤지게 해결이 안 됐다.

 

결국 SOS를 쳤고 팀 내의 '큰누나' 포지션을 맡고 있는 분께서 완성을 하셨다. 존경심이 들었다.

 

해결하신 코드를 살펴보니

 

1. 값을 올릴 때 adddoc을 쓰시지 않고, 파이어베이스에서 직접 문서를 생성하시고'main': $(`#main`).is(':checked'), 이런 식으로 바로 연결을 하셨다. 나는 계속 각 체크를 구분하지 않고 숫자를 카운트하는 방식으로만 생각했는데 박스들의 상태를 저장하고 숫자로 카운트하도록 만들어 놓으셨다.

2. adddoc, getdoc 말고 updatedoc이라는 함수(?아직 용어가 익숙하지 않아 맞는지 모르겠다.)를 쓰셨다. 추측건대 문서를 생성하지 않고 덮어쓰는 기능을 하는 것 같다. 혼자 사용해 봐야겠다.

3. $('#main').prop("checked", main); 여기서 prop이라는 함수를 쓰셨는데 무슨 기능을 하는지 잘 모르겠다. 찾아봐야겠다.

물론 더 많은 배울 점이 있는 코드겠지만, 지금 내 수준에서는 3가지 밖에 안 보인다.

 

저걸 해결하려면 지금 내 수준에서 못해도 3일은 넘게 갈아 넣었어야 할 것 같아 보여 팀적으로는 다행이지만, 한편으로는 스스로 해결한 게 아니라서 조금 불안하기도 하다. 같은 팀원 분 중 '동생' 포지션을 맡고 계시는 분은 끝까지 자기 파트를 혼자 하고 계시고 진척이 되고 있는 걸 보면 다들 대단하다는 생각이 든다.

 

오늘 운동은 파이팅을 채우는 느낌으로 좀 무겁게 들어야곘다.

 

 

<TMI. 같은 팀원 분들을 보면 각각 '어머니', '큰누나', '동생'에 대입되는 것 같다. 난 그냥 버스승객이다ㅜ.>