211009_TIL

10월 09일 (토)

오늘 한 일

1.JavaScript를 활용하여 블랙커피 레벨1 문벅스 카페메뉴 앱 만들기 step2을 진행했다.

1-1

situation

this.menu = []; 에서

Cannot set properties of undefined

에러가 발생했다.

원래는 이렇게 하면 실행이 됬다.

App()

하지만 어느 순간 이렇게 바꿔야 실행이 되었다.

const app =new App()
app.init()

what I learned

우선 this.menu = [] 라고 설정한 이유는 상태가 어떤 데이터 형태가 들어올지 모르니까 push라는 메서드를 쓸 수 없다. 그리고 초기화를 해놓으면은 다른 사람들과 협업을 할 때 이 상태는 어떤 형태로 데이터가 관리가 되겠구나가 명확해 진다.

init 할때 앱이 인스턴스로 띄워진다. 함수가 하나가 있다고 하면은 함수는 하나만 존재한다.
인스턴스로 new 로 만든다는 것은 함수를 모델로 새로운 객체들이 여러 개가 만들어 질 수 있는 것이다. 또한 각각의 상태를 가질 수 있다. ex) 채팅창을 여러 개 띄운다, 채팅창 하나 하나가 하나의 인스턴스 이다. 인스턴스를 만드는 형태로 해야지 채팅창이라는 하나의 객체만 짜도 계속 재사용 할 수 있다.

1-2 데이터 속성 가지고 올 때는 해당 엘리먼트의 dataset. categoryName

const categoryName = e.target.dataset.categoryName

1-3
JSON 저장할 때 JSON.stringify()

localStorage.setItem("menu", JSON.stringify(menu));

하나의 문자열로 가져온 것을 JSON 객체로 변환시키는 것 JSNO.parse()

return JSON.parse(localStorage.getItem("menu"));

2. 함께 자라기 애자일로 가는길을 189p(챕터2 함께)까지 읽었다.

2-1 공감하고 이해하려는 대화

술퍼맨 : 정규식에 익숙하질 않아서...
홍춘이 : 정규식에 익숙해지기가 어렵죠.
...
술퍼맨 : 말씀하신 대로 안 되는 부분이 있네요. 다른 시도를 위해서 뭘 해보셨나요?
술퍼맨 : 우선 구글에서 검색을 해봤는데요.

2-2 행동을 유도하는 대화

홍춘이 : 첫 발걸음을 일단 내딛는다면, 첫 번째 액션은 뭘까요? 현재 뭘 할 수 있으시겠어요?
술퍼맨 : 일단 책을 한번 읽어볼 수 있을 것 같아요. 제가 아직 정규식을 제대로 공부해본 적이 없어서요.
...
홍춘이 :  좋네요. 그렇게 하는 데에 걱정되는 게 있다면 어떤 거예요?
술퍼맨 : 어... 사실은 이제까지도 정규식 공부해야지 하면서 계속 미뤄왔는데 또 미루지 않을까 하는 걱정이 있기는 하네요.
홍춘이 : 그럼 대책을 한번 같이 브레인 스토밍 해볼까요?
...
홍춘이 : 예를 좀 더 가까운 시일 내에 가벼운 액션을 취하는 걸로 바꾸면 어떨까 싶네요. 어떠세요?

사수로서뿐 아니라 훌륭한 부모로써의 좋은 대화방법이라고 생각들지만 부모로써 행동으로 옮겨도 되는 방법인지 좀 더 공부가 필요하다. 지금 내 생각으로는 자식이 영유아시기가 아니라면 그리고 부모로써 더 조심스럽게 다가간다면 좋은 방법이 될 것 같다.

2-3 삼투압적 의사소통
뛰어난 팀이라면 거의 한 팀도 빠지지 않고 공통적으로 갖고 있는 특징이 있었는데, '삼투압적 의사소통'이 거기에 속합니다.
발신, 수신이 정해져 있고 화살을 쏘는 방식이 아닌 은연중에 서로 간에 정보가 스며드는 겁니다.

예를 들어 프로그래밍하다가 "저기 이거 뭐무 안되는데 아는 사람 있어요?"라고 외칩니다. 테이블 건너편에 있던 디자이너가 답을 해줍니다. 옆에 앉아 자기 일을 하던 기획자는 프로그래머 둘이 하는 대화를 우연히 듣습니다. 그러다가 " 아, 그런 문제가 있었나요? 저는 어쩌구 ..." 하면서 끼어들어 새롭고 가치 있는 정보를 줍니다.  

최근에 안될과학의 괴도님께서 "가장 신뢰도가 높은 것은 엿들은 것이다." 라는 말씀을 하셨다. 나는 경험적으로 그것이 아주 그럴써한 말이라는 것을 느꼈었다. 긍정적인 말이 아닌 부정적인 말이라면 매우 큰 부작용이 작용할 것 이다.

2-4 웹개발에서 추상화의 단계를 다섯 면으로 나눕니다.

1. 전략(strategy)
2. 범위(scope)
3. 구조(structure)
4. 뼈대(skeleton)
5. 표면/비주얼(surface/visual)

우리가 전문가의 이미지를 잘못 가지고 있다면 전문가가 다음과 같이 일을 처리하리라 생각하기 쉽습니다.

'전략이 깔끔히 완료되고 나서야 범위(무슨 기능이 들어갈지 결정)를 정하고, 다음에 구조(기능들을 어떻게 연결할지, 흐름은 어떻게 될지, 사이트 구조 등)를 정하고, 거기에서 뼈대(화면에 어떤 요소들이 대략 들어가야 하는지, 배치는 어떤지)가 나오고, 마지막에 이르러서 비주얼 디자인에 도달할 수 있다.

하지만 사실은 이와 다릅니다. 더 높은 품질을 얻기 위해서는 이 사다리를 오르락내리락 반복하는 것이 필요합니다. 어느 한 단계를 한번에 완료하는 것은 더 낮은 품질로 가는 지름길 입니다. 특히나 문제와 해결책에 불확실성이 높을 경우.

3. ssafy

GSAT 실전모의고사 1회를 진행함.
내일은 아직은 생소하고 부족한 CT 공부를 해야겠다.