20210412(월)

2021-04-12

1. 학습 날짜

• 2021-04-12

2. 학습 시간

• 10:00 ~ 23:00

3. 학습 범위 및 주제

• vue js 학습

4. 학습 목표

• vue 강의 듣기

5. 학습 정리

• x

6. 상세 학습 내용

• vue js 를 이용해서 간단한 todo 앱을 만들었다.

• 그제까지 해서 바닐라JS 를 이용해서 todo 앱을 만들어서인지 프레임워크의 강력함을 아주 절실히 느낄 수 있었던거 같다.

• 먼저 이전에 백본JS 로 앱을 구현했을 때는 view 를 나눠서 구현했었는데, vue 에서는 컴포넌트 단위로 나눠서 구현을 한다.

• 뷰에서 컴포넌트라는건 하나의 태그를 의미한다. 그리고 이 컴포넌트에는 반드시 루트 태그가 한개가 있어야한다. 이제 이 루트 태그 아래에 여러 개의 다른 하위 ㅓㅁ포넌트를 만들 수 있게된다.

• 따라서 이런 컴포넌트 단위로 todo 를 나눠보면

• todoApp

  • todoHeader

  • todoInput

  • todoList

  • todoFooter

• 와 같은 구조를 갖게 된다.

• 오늘 학습한 설계 방법중에 하위 컴포넌트는 보여주는 부분을 담당하고 실제 데이터 연산의 처리는 부모컴포넌트에서 하는 방법을 학습했다.

• 이게 무슨말이냐면, 현재 todoApp 이라는 부모컴포넌트가 있는데, 실제 이벤트와 마크업등을 하위 컴포넌트들에서 감지하면 이 감지한걸 본인이 처리하는게 아니라 부모 컴포넌트로 넘기고 부모컴포넌트는 올라온 데이터를 처리하고 그걸 props 기능을 이용해서 자식들한테 넘기게 하는것.

7. 오늘 학습 내용에 대한 개인적인 총평

• 프레임워크란 정말 대단하다... 아주 손쉽게 무언가를 만들어 낼 수 있게 된거 같다.

• 다만 아직도 html ,css 가 부족하다는게 뼈저리게 느껴진다. 확실히 학습을 하자.

8. 다음 학습 계획

• vue 강의 듣기